refactor(mcp): improve UI consistency and i18n
- Add MCP-specific green button style (buttonStyles.mcp) - Unify MCP panel and form buttons with emerald theme - Adjust MCP entry button width to match AppSwitcher (px-3) - Reduce JSON editor height from h-64 to h-48 - Update translations: "Add/Edit Server" → "Add/Edit MCP" - Change form label to "MCP Title (Unique)" for clarity - Move config wizard button to right side of JSON label - Fix McpListItem enabled state check (explicit true check)
This commit is contained in:
@@ -244,13 +244,13 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setIsWizardOpen(true)}
|
||||
className="text-xs text-blue-500 dark:text-blue-400 hover:text-blue-600 dark:hover:text-blue-300 transition-colors"
|
||||
className="text-sm text-blue-500 dark:text-blue-400 hover:text-blue-600 dark:hover:text-blue-300 transition-colors"
|
||||
>
|
||||
{t("mcp.form.useWizard")}
|
||||
</button>
|
||||
</div>
|
||||
<textarea
|
||||
className={`${inputStyles.text} h-64 resize-none font-mono text-xs`}
|
||||
className={`${inputStyles.text} h-48 resize-none font-mono text-xs`}
|
||||
placeholder={t("mcp.form.jsonPlaceholder")}
|
||||
value={formJson}
|
||||
onChange={(e) => handleJsonChange(e.target.value)}
|
||||
@@ -272,7 +272,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
|
||||
<button
|
||||
onClick={handleSubmit}
|
||||
disabled={saving || (!isEditing && !!idError)}
|
||||
className={buttonStyles.primary}
|
||||
className={`inline-flex items-center gap-2 ${buttonStyles.mcp}`}
|
||||
>
|
||||
<Save size={16} />
|
||||
{saving
|
||||
|
||||
@@ -26,8 +26,8 @@ const McpListItem: React.FC<McpListItemProps> = ({
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
// 默认启用
|
||||
const enabled = server.enabled !== false;
|
||||
// 仅当显式为 true 时视为启用;避免 undefined 被误判为启用
|
||||
const enabled = server.enabled === true;
|
||||
|
||||
// 只显示 description,没有则留空
|
||||
const description = (server as any).description || "";
|
||||
|
||||
@@ -8,7 +8,7 @@ import { ConfirmDialog } from "../ConfirmDialog";
|
||||
import { extractErrorMessage } from "../../utils/errorUtils";
|
||||
import { mcpPresets } from "../../config/mcpPresets";
|
||||
import McpToggle from "./McpToggle";
|
||||
import { cardStyles, cn } from "../../lib/styles";
|
||||
import { buttonStyles, cardStyles, cn } from "../../lib/styles";
|
||||
|
||||
interface McpPanelProps {
|
||||
onClose: () => void;
|
||||
@@ -178,7 +178,7 @@ const McpPanel: React.FC<McpPanelProps> = ({ onClose, onNotify }) => {
|
||||
<div className="flex items-center gap-3">
|
||||
<button
|
||||
onClick={handleAdd}
|
||||
className="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium rounded-md bg-emerald-500 text-white hover:bg-emerald-600 dark:bg-emerald-600 dark:hover:bg-emerald-700 transition-colors"
|
||||
className={`inline-flex items-center gap-2 ${buttonStyles.mcp}`}
|
||||
>
|
||||
<Plus size={16} />
|
||||
{t("mcp.add")}
|
||||
|
||||
Reference in New Issue
Block a user