npm - @openhands/agent-canvas - Versions diffs - 1.1.0 → 1.2.0 - Mend

@openhands/agent-canvas 1.1.0 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1373) hide show

package/dist/components/features/mcp-page/install-server-modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"install-server-modal.js","names":[],"sources":["../../../../src/components/features/mcp-page/install-server-modal.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { AxiosError } from \"axios\";\nimport { v4 as uuidv4 } from \"uuid\";\nimport { ModalBackdrop } from \"#/components/shared/modals/modal-backdrop\";\nimport { ModalCloseButton } from \"#/components/shared/modals/modal-close-button\";\nimport { BrandButton } from \"#/components/features/settings/brand-button\";\nimport { SettingsInput } from \"#/components/features/settings/settings-input\";\nimport { SaveAsSecretToggle } from \"#/components/features/mcp-page/save-as-secret-toggle\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport type {\n IntegrationCatalogEntry as MarketplaceEntry,\n MarketplaceField,\n} from \"@openhands/extensions/integrations\";\nimport { McpLogoBadge } from \"#/components/features/mcp-logo-badge\";\nimport { ExtendedMCPTestFailure, MCPServerConfig } from \"#/types/mcp-server\";\nimport { useAddMcpServer } from \"#/hooks/mutation/use-add-mcp-server\";\nimport { useTestMcpServer } from \"#/hooks/mutation/use-test-mcp-server\";\nimport { displaySuccessToast } from \"#/utils/custom-toast-handlers\";\nimport {\n getInstallableMcpConnectionOption,\n type McpMarketplaceConnectionOption,\n} from \"#/utils/mcp-marketplace-utils\";\nimport { retrieveAxiosErrorMessage } from \"#/utils/retrieve-axios-error-message\";\nimport { useSaveFieldsAsSecrets } from \"#/hooks/mutation/use-save-fields-as-secrets\";\nimport { modalTitleLgClassName } from \"#/utils/modal-classes\";\n\n/*\n Renders a helperText string as React nodes, converting any `[text](url)`\n * markdown links into real `<a>` elements. Plain text segments are left as-is.\n * Only `http:` and `https:` URLs are rendered as links; anything else falls\n * back to `#` to guard against `javascript:` / `data:` XSS vectors.\n /\nfunction renderHelperText(text: string): React.ReactNode {\n const linkPattern = /\\[([^\\]]+)\\]\$([^)]+)\$/g;\n const parts: React.ReactNode[] = [];\n let lastIndex = 0;\n for (const match of text.matchAll(linkPattern)) {\n if (match.index > lastIndex) {\n parts.push(text.slice(lastIndex, match.index));\n }\n parts.push(\n <a\n key={match.index}\n href={/^https?:\\/\\//i.test(match[2]) ? match[2] : \"#\"}\n target=\"_blank\"\n rel=\"noreferrer\"\n className=\"underline hover:text-white transition-colors\"\n >\n {match[1]}\n </a>,\n );\n lastIndex = match.index + match[0].length;\n }\n if (lastIndex < text.length) {\n parts.push(text.slice(lastIndex));\n }\n return parts;\n}\n\ninterface InstallServerModalProps {\n entry: MarketplaceEntry;\n onClose: () => void;\n onSuccess?: (entry: MarketplaceEntry) => void;\n}\n\ninterface FieldState {\n values: Record<string, string>;\n errors: Record<string, string \| null>;\n savedAsSecret: Record<string, boolean>;\n}\n\nfunction optionNeedsCredentialField(\n option: McpMarketplaceConnectionOption \| undefined,\n): boolean {\n if (option?.transport.kind !== \"shttp\" && option?.transport.kind !== \"sse\") {\n return false;\n }\n return [\"api_key\", \"bearer\", \"basic\"].includes(option.auth.strategy);\n}\n\nfunction isCredentialOptional(option: McpMarketplaceConnectionOption): boolean {\n if (option.transport.kind === \"stdio\") {\n return option.auth.apiKeyOptional ?? false;\n }\n return option.auth.apiKeyOptional ?? option.transport.apiKeyOptional ?? false;\n}\n\nfunction makeInitialState(entry: MarketplaceEntry): FieldState {\n const values: Record<string, string> = {};\n const savedAsSecret: Record<string, boolean> = {};\n const option = getInstallableMcpConnectionOption(entry);\n const template = option?.transport;\n if (template?.kind === \"stdio\") {\n for (const field of template.envFields ?? []) {\n values[field.key] = \"\";\n // Pre-check password fields; non-password fields default to off.\n savedAsSecret[field.key] = field.type === \"password\";\n }\n for (const field of template.argFields ?? []) {\n values[field.key] = \"\";\n }\n } else if (optionNeedsCredentialField(option)) {\n values.api_key = \"\";\n if (option?.auth.credentialSecretName) {\n savedAsSecret.api_key =\n option.auth.saveCredentialAsSecretByDefault ?? false;\n }\n }\n return { values, errors: {}, savedAsSecret };\n}\n\n// The marketplace install modal is intentionally add-only: clicking\n// a catalog tile always appends a new server (the user might want\n// two Slack workspaces, two Postgres connections, etc.) even when\n// one of the same template kind is already installed. Editing an\n// existing server is reached via the installed-server-card's edit\n// button, which opens `CustomServerEditor` instead.\nexport function InstallServerModal({\n entry,\n onClose,\n onSuccess,\n}: InstallServerModalProps) {\n const { t } = useTranslation(\"openhands\");\n const { mutate: addMcpServer, isPending: isAdding } = useAddMcpServer();\n const { mutate: testMcpServer, isPending: isTesting } = useTestMcpServer();\n const saveFieldsAsSecrets = useSaveFieldsAsSecrets();\n\n const [state, setState] = React.useState<FieldState>(() =>\n makeInitialState(entry),\n );\n // Always holds the latest state so async callbacks (onSuccess) never read\n // stale closure values, even under React concurrent-mode scheduling.\n const stateRef = React.useRef(state);\n stateRef.current = state;\n\n const [globalError, setGlobalError] = React.useState<string \| null>(null);\n const [isFinalizingInstall, setIsFinalizingInstall] = React.useState(false);\n const option = getInstallableMcpConnectionOption(entry);\n const template = option?.transport;\n\n const isPending = isTesting \|\| isAdding \|\| isFinalizingInstall;\n\n const setValue = (key: string, value: string) => {\n setState((prev) => ({\n ...prev,\n values: { ...prev.values, [key]: value },\n errors: { ...prev.errors, [key]: null },\n }));\n setGlobalError(null);\n };\n\n const toggleSecret = (key: string, value: boolean) => {\n setState((prev) => ({\n ...prev,\n savedAsSecret: { ...prev.savedAsSecret, [key]: value },\n }));\n };\n\n const saveHostedCredentialAsSecret = (): Promise<void> => {\n const secretName = option?.auth.credentialSecretName;\n const apiKey = stateRef.current.values.api_key?.trim();\n if (!secretName \|\| !apiKey \|\| !stateRef.current.savedAsSecret.api_key) {\n return Promise.resolve();\n }\n\n const field: MarketplaceField = {\n key: secretName,\n label: option.auth.credentialLabel ?? secretName,\n type: \"password\",\n };\n return saveFieldsAsSecrets(\n [field],\n { [secretName]: apiKey },\n { [secretName]: true },\n );\n };\n\n const saveSelectedSecrets = (): Promise<void> => {\n if (template?.kind === \"stdio\") {\n return saveFieldsAsSecrets(\n template.envFields ?? [],\n stateRef.current.values,\n stateRef.current.savedAsSecret,\n );\n }\n if (template?.kind === \"shttp\" \|\| template?.kind === \"sse\") {\n return saveHostedCredentialAsSecret();\n }\n return Promise.resolve();\n };\n\n const makeTestErrorMessage = (failure: ExtendedMCPTestFailure): string => {\n switch (failure.error_kind) {\n case \"timeout\":\n return t(I18nKey.MCP$TEST_ERROR_TIMEOUT);\n case \"connection\":\n return t(I18nKey.MCP$TEST_ERROR_CONNECTION);\n case \"credentials\":\n return t(I18nKey.MCP$TEST_ERROR_CREDENTIALS, { error: failure.error });\n default:\n return t(I18nKey.MCP$TEST_ERROR_UNKNOWN, { error: failure.error });\n }\n };\n\n const submitServer = (payload: MCPServerConfig) => {\n testMcpServer(payload, {\n onSuccess: (result) => {\n if (!result.ok) {\n setGlobalError(makeTestErrorMessage(result));\n // Modal stays open — do NOT call onClose.\n return;\n }\n addMcpServer(payload, {\n onSuccess: () => {\n displaySuccessToast(t(I18nKey.MCP$INSTALL_SUCCESS));\n setIsFinalizingInstall(true);\n void (async () => {\n try {\n await saveSelectedSecrets();\n } finally {\n onSuccess?.(entry);\n onClose();\n }\n })();\n },\n onError: (err: unknown) => {\n const message = retrieveAxiosErrorMessage(err as AxiosError);\n setGlobalError(message \|\| t(I18nKey.ERROR$GENERIC));\n },\n });\n },\n onError: (err: unknown) => {\n const message = retrieveAxiosErrorMessage(err as AxiosError);\n setGlobalError(message \|\| t(I18nKey.ERROR$GENERIC));\n },\n });\n };\n\n // ------------------------------------------------------------------\n // Per-template submit handlers. Each is small and self-contained:\n // validate user input, build the payload, then hand off to\n // submitServer.\n // ------------------------------------------------------------------\n const handleHttpServerSubmit = () => {\n // TS narrows this branch to shttp\|sse; the equality guard is a\n // runtime/defensive belt to make the helper safe in isolation.\n if (template?.kind !== \"shttp\" && template?.kind !== \"sse\") {\n return;\n }\n if (!option) return;\n const apiKey = state.values.api_key?.trim() ?? \"\";\n const needsCredential = optionNeedsCredentialField(option);\n if (needsCredential && !isCredentialOptional(option) && !apiKey) {\n setState((prev) => ({\n ...prev,\n errors: { api_key: t(I18nKey.MCP$ERROR_FIELD_REQUIRED) },\n }));\n return;\n }\n const payload: MCPServerConfig = {\n id: `${template.kind}-${uuidv4()}`,\n type: template.kind,\n // Name remote servers after the catalog slug (e.g. \"github\") so they\n // get a referenceable mcp_config key instead of the auto-generated\n // \"sse\"/\"shttp\" fallback. Stdio installs already carry serverName.\n name: entry.id,\n url: template.url,\n ...(needsCredential && apiKey && { api_key: apiKey }),\n };\n submitServer(payload);\n };\n\n const handleStdioSubmit = () => {\n if (template?.kind !== \"stdio\") return;\n const stdio = template;\n const errors: Record<string, string \| null> = {};\n\n for (const field of stdio.envFields ?? []) {\n if (field.required && !(state.values[field.key] ?? \"\").trim()) {\n errors[field.key] = t(I18nKey.MCP$ERROR_FIELD_REQUIRED);\n }\n }\n for (const field of stdio.argFields ?? []) {\n if (field.required && !(state.values[field.key] ?? \"\").trim()) {\n errors[field.key] = t(I18nKey.MCP$ERROR_FIELD_REQUIRED);\n }\n }\n if (Object.values(errors).some(Boolean)) {\n setState((prev) => ({ ...prev, errors }));\n return;\n }\n\n const env: Record<string, string> = {};\n for (const field of stdio.envFields ?? []) {\n const v = state.values[field.key]?.trim();\n if (v) env[field.key] = v;\n }\n const extraArgs: string[] = [];\n for (const field of stdio.argFields ?? []) {\n const v = state.values[field.key]?.trim();\n if (v) {\n // Filesystem-style multi-token input: split on whitespace.\n for (const token of v.split(/\\s+/)) {\n if (token) extraArgs.push(token);\n }\n }\n }\n\n const payload: MCPServerConfig = {\n id: `stdio-${uuidv4()}`,\n type: \"stdio\",\n name: stdio.serverName,\n command: stdio.command,\n args: [...stdio.args, ...extraArgs],\n ...(Object.keys(env).length > 0 && { env }),\n };\n submitServer(payload);\n };\n\n const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {\n event.preventDefault();\n setGlobalError(null);\n if (template?.kind === \"shttp\" \|\| template?.kind === \"sse\") {\n return handleHttpServerSubmit();\n }\n return handleStdioSubmit();\n };\n\n const renderFields = () => {\n if (template?.kind === \"shttp\" \|\| template?.kind === \"sse\") {\n const shouldRenderCredential = optionNeedsCredentialField(option);\n const apiKeyOptional = option ? isCredentialOptional(option) : false;\n const credentialSecretName = option?.auth.credentialSecretName;\n return (\n <>\n <SettingsInput\n testId=\"mcp-install-field-url\"\n name=\"url\"\n type=\"url\"\n label={t(I18nKey.SETTINGS$MCP_URL)}\n value={template.url}\n onChange={() => {}}\n isDisabled\n className=\"w-full\"\n />\n {shouldRenderCredential ? (\n <div className=\"flex flex-col gap-1\">\n <SettingsInput\n testId=\"mcp-install-field-api_key\"\n name=\"api_key\"\n type=\"password\"\n label={\n option?.auth.credentialLabel ??\n t(I18nKey.SETTINGS$MCP_API_KEY)\n }\n value={state.values.api_key ?? \"\"}\n onChange={(v) => setValue(\"api_key\", v)}\n placeholder={\n option?.auth.credentialPlaceholder ??\n t(I18nKey.SETTINGS$MCP_API_KEY_PLACEHOLDER)\n }\n showOptionalTag={apiKeyOptional}\n required={!apiKeyOptional}\n className=\"w-full\"\n />\n {option?.auth.credentialHelp && (\n <p className=\"text-xs text-tertiary-alt\">\n {renderHelperText(option.auth.credentialHelp)}\n </p>\n )}\n {state.errors.api_key && (\n <p className=\"text-xs text-red-500\">{state.errors.api_key}</p>\n )}\n {credentialSecretName && (\n <SaveAsSecretToggle\n fieldKey={credentialSecretName}\n checked={state.savedAsSecret.api_key ?? false}\n onToggle={(v) => toggleSecret(\"api_key\", v)}\n />\n )}\n </div>\n ) : null}\n </>\n );\n }\n\n if (template?.kind !== \"stdio\") return null;\n const stdio = template;\n return (\n <>\n <SettingsInput\n testId=\"mcp-install-field-command-readonly\"\n name=\"command-readonly\"\n type=\"text\"\n label={t(I18nKey.MCP$COMMAND_LABEL)}\n value={`${stdio.command} ${stdio.args.join(\" \")}`.trim()}\n onChange={() => {}}\n isDisabled\n className=\"w-full\"\n />\n {(stdio.envFields ?? []).map((field) => (\n <div key={field.key} className=\"flex flex-col gap-1\">\n <SettingsInput\n testId={`mcp-install-field-${field.key}`}\n name={field.key}\n type={field.type === \"password\" ? \"password\" : \"text\"}\n label={field.label}\n value={state.values[field.key] ?? \"\"}\n onChange={(v) => setValue(field.key, v)}\n placeholder={field.placeholder}\n required={field.required}\n showOptionalTag={!field.required}\n className=\"w-full\"\n />\n {field.helperText && (\n <p className=\"text-xs text-tertiary-alt\">\n {renderHelperText(field.helperText)}\n </p>\n )}\n {state.errors[field.key] && (\n <p className=\"text-xs text-red-500\">{state.errors[field.key]}</p>\n )}\n {field.key in state.savedAsSecret && (\n <SaveAsSecretToggle\n fieldKey={field.key}\n checked={state.savedAsSecret[field.key]}\n onToggle={(v) => toggleSecret(field.key, v)}\n />\n )}\n </div>\n ))}\n {/ argFields are CLI arguments, not credentials — they don't need\n a \"save as secret\" toggle and are excluded from savedAsSecret. */}\n {(stdio.argFields ?? []).map((field) => (\n <div key={field.key} className=\"flex flex-col gap-1\">\n <SettingsInput\n testId={`mcp-install-field-${field.key}`}\n name={field.key}\n type={field.type === \"password\" ? \"password\" : \"text\"}\n label={field.label}\n value={state.values[field.key] ?? \"\"}\n onChange={(v) => setValue(field.key, v)}\n placeholder={field.placeholder}\n required={field.required}\n showOptionalTag={!field.required}\n className=\"w-full\"\n />\n {field.helperText && (\n <p className=\"text-xs text-tertiary-alt\">\n {renderHelperText(field.helperText)}\n </p>\n )}\n {state.errors[field.key] && (\n <p className=\"text-xs text-red-500\">{state.errors[field.key]}</p>\n )}\n </div>\n ))}\n </>\n );\n };\n\n return (\n <ModalBackdrop onClose={onClose} aria-label={entry.name}>\n <form\n data-testid=\"mcp-install-modal\"\n data-marketplace-id={entry.id}\n onSubmit={handleSubmit}\n className=\"relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)] w-[520px] max-w-[90vw] max-h-[85vh] overflow-y-auto custom-scrollbar\"\n >\n <ModalCloseButton\n onClose={onClose}\n testId=\"mcp-install-modal-close\"\n disabled={isPending}\n />\n <div className=\"flex items-start gap-3 pr-6\">\n <McpLogoBadge entry={entry} />\n <div className=\"flex flex-col flex-1\">\n <h2 className={modalTitleLgClassName}>{entry.name}</h2>\n <p className=\"text-xs text-tertiary-light\">{entry.description}</p>\n </div>\n </div>\n\n {entry.installHint && (\n <p className=\"text-xs text-tertiary-light\">{entry.installHint}</p>\n )}\n\n {entry.docsUrl && (\n <a\n href={entry.docsUrl}\n target=\"_blank\"\n rel=\"noreferrer\"\n className=\"text-xs text-[var(--oh-muted)] hover:text-white hover:underline self-start transition-colors\"\n >\n {t(I18nKey.MCP$VIEW_DOCS)}\n </a>\n )}\n\n <div className=\"flex flex-col gap-3\">{renderFields()}</div>\n\n {globalError && (\n <p\n data-testid=\"mcp-install-modal-error\"\n className=\"text-sm text-red-500 whitespace-pre-wrap\"\n >\n {globalError}\n </p>\n )}\n\n <div className=\"flex justify-end gap-2 mt-2\">\n <BrandButton\n type=\"button\"\n variant=\"secondary\"\n onClick={onClose}\n testId=\"mcp-install-cancel\"\n isDisabled={isPending}\n >\n {t(I18nKey.BUTTON$CANCEL)}\n </BrandButton>\n <BrandButton\n type=\"submit\"\n variant=\"primary\"\n isDisabled={isPending}\n testId=\"mcp-install-submit\"\n >\n {isTesting\n ? t(I18nKey.MCP$VERIFYING)\n : isAdding \|\| isFinalizingInstall\n ? t(I18nKey.SETTINGS$SAVING)\n : t(I18nKey.MCP$INSTALL_BUTTON)}\n </BrandButton>\n </div>\n </form>\n </ModalBackdrop>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"install-server-modal.js","names":[],"sources":["../../../../src/components/features/mcp-page/install-server-modal.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { AxiosError } from \"axios\";\nimport { v4 as uuidv4 } from \"uuid\";\nimport { ModalBackdrop } from \"#/components/shared/modals/modal-backdrop\";\nimport { ModalCloseButton } from \"#/components/shared/modals/modal-close-button\";\nimport { BrandButton } from \"#/components/features/settings/brand-button\";\nimport { SettingsInput } from \"#/components/features/settings/settings-input\";\nimport { SaveAsSecretToggle } from \"#/components/features/mcp-page/save-as-secret-toggle\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport type {\n IntegrationCatalogEntry as MarketplaceEntry,\n MarketplaceField,\n} from \"@openhands/extensions/integrations\";\nimport { McpLogoBadge } from \"#/components/features/mcp-logo-badge\";\nimport { ExtendedMCPTestFailure, MCPServerConfig } from \"#/types/mcp-server\";\nimport type { MCPAuthCredential } from \"#/types/mcp-auth\";\nimport { useAddMcpServer } from \"#/hooks/mutation/use-add-mcp-server\";\nimport { useTestMcpServer } from \"#/hooks/mutation/use-test-mcp-server\";\nimport { displaySuccessToast } from \"#/utils/custom-toast-handlers\";\nimport {\n getMcpOAuthAuthenticationConfig,\n getInstallableMcpConnectionOption,\n type McpMarketplaceConnectionOption,\n} from \"#/utils/mcp-marketplace-utils\";\nimport { retrieveAxiosErrorMessage } from \"#/utils/retrieve-axios-error-message\";\nimport { useSaveFieldsAsSecrets } from \"#/hooks/mutation/use-save-fields-as-secrets\";\nimport { modalTitleLgClassName } from \"#/utils/modal-classes\";\nimport McpService from \"#/api/mcp-service/mcp-service.api\";\nimport { toMcpServerName } from \"#/utils/mcp-server-name\";\n\n/*\n Renders a helperText string as React nodes, converting any `[text](url)`\n * markdown links into real `<a>` elements. Plain text segments are left as-is.\n * Only `http:` and `https:` URLs are rendered as links; anything else falls\n * back to `#` to guard against `javascript:` / `data:` XSS vectors.\n /\nfunction renderHelperText(text: string): React.ReactNode {\n const linkPattern = /\\[([^\\]]+)\\]\$([^)]+)\$/g;\n const parts: React.ReactNode[] = [];\n let lastIndex = 0;\n for (const match of text.matchAll(linkPattern)) {\n if (match.index > lastIndex) {\n parts.push(text.slice(lastIndex, match.index));\n }\n parts.push(\n <a\n key={match.index}\n href={/^https?:\\/\\//i.test(match[2]) ? match[2] : \"#\"}\n target=\"_blank\"\n rel=\"noreferrer\"\n className=\"underline hover:text-white transition-colors\"\n >\n {match[1]}\n </a>,\n );\n lastIndex = match.index + match[0].length;\n }\n if (lastIndex < text.length) {\n parts.push(text.slice(lastIndex));\n }\n return parts;\n}\n\ninterface InstallServerModalProps {\n entry: MarketplaceEntry;\n onClose: () => void;\n onSuccess?: (entry: MarketplaceEntry) => void;\n}\n\ninterface FieldState {\n values: Record<string, string>;\n errors: Record<string, string \| null>;\n savedAsSecret: Record<string, boolean>;\n}\n\nfunction optionNeedsCredentialField(\n option: McpMarketplaceConnectionOption \| undefined,\n): boolean {\n if (option?.transport.kind !== \"shttp\" && option?.transport.kind !== \"sse\") {\n return false;\n }\n return [\"api_key\", \"bearer\"].includes(option.auth.strategy);\n}\n\nfunction isOAuthOption(\n option: McpMarketplaceConnectionOption \| undefined,\n): boolean {\n return !!option && option.auth.strategy === \"oauth2\";\n}\n\nfunction isCredentialOptional(option: McpMarketplaceConnectionOption): boolean {\n if (option.transport.kind === \"stdio\") {\n return option.auth.apiKeyOptional ?? false;\n }\n return option.auth.apiKeyOptional ?? option.transport.apiKeyOptional ?? false;\n}\n\nfunction getRemoteHeaderFields(\n option: McpMarketplaceConnectionOption \| undefined,\n): MarketplaceField[] {\n if (option?.transport.kind !== \"shttp\" && option?.transport.kind !== \"sse\") {\n return [];\n }\n return option.transport.headerFields ?? [];\n}\n\nfunction makeInitialState(entry: MarketplaceEntry): FieldState {\n const values: Record<string, string> = {};\n const savedAsSecret: Record<string, boolean> = {};\n const option = getInstallableMcpConnectionOption(entry);\n const template = option?.transport;\n if (template?.kind === \"stdio\") {\n for (const field of template.envFields ?? []) {\n values[field.key] = \"\";\n // Pre-check password fields; non-password fields default to off.\n savedAsSecret[field.key] = field.type === \"password\";\n }\n for (const field of template.argFields ?? []) {\n values[field.key] = \"\";\n }\n } else if (template?.kind === \"shttp\" \|\| template?.kind === \"sse\") {\n values.url = template.url;\n for (const field of getRemoteHeaderFields(option)) {\n values[field.key] = \"\";\n savedAsSecret[field.key] = field.type === \"password\";\n }\n if (optionNeedsCredentialField(option)) {\n values.api_key = \"\";\n if (option?.auth.credentialSecretName) {\n savedAsSecret.api_key =\n option.auth.saveCredentialAsSecretByDefault ?? false;\n }\n }\n }\n return { values, errors: {}, savedAsSecret };\n}\n\n// The marketplace install modal is intentionally add-only: clicking\n// a catalog tile always appends a new server (the user might want\n// two Slack workspaces, two Postgres connections, etc.) even when\n// one of the same template kind is already installed. Editing an\n// existing server is reached via the installed-server-card's edit\n// button, which opens `CustomServerEditor` instead.\nexport function InstallServerModal({\n entry,\n onClose,\n onSuccess,\n}: InstallServerModalProps) {\n const { t } = useTranslation(\"openhands\");\n const { mutate: addMcpServer, isPending: isAdding } = useAddMcpServer();\n const { mutate: testMcpServer, isPending: isTesting } = useTestMcpServer();\n const saveFieldsAsSecrets = useSaveFieldsAsSecrets();\n\n const [state, setState] = React.useState<FieldState>(() =>\n makeInitialState(entry),\n );\n // Always holds the latest state so async callbacks (onSuccess) never read\n // stale closure values, even under React concurrent-mode scheduling.\n const stateRef = React.useRef(state);\n stateRef.current = state;\n\n const [globalError, setGlobalError] = React.useState<string \| null>(null);\n const [isFinalizingInstall, setIsFinalizingInstall] = React.useState(false);\n const [isAuthorizingOAuth, setIsAuthorizingOAuth] = React.useState(false);\n const option = getInstallableMcpConnectionOption(entry);\n const template = option?.transport;\n\n const isPending =\n isTesting \|\| isAuthorizingOAuth \|\| isAdding \|\| isFinalizingInstall;\n\n const setValue = (key: string, value: string) => {\n setState((prev) => ({\n ...prev,\n values: { ...prev.values, [key]: value },\n errors: { ...prev.errors, [key]: null },\n }));\n setGlobalError(null);\n };\n\n const toggleSecret = (key: string, value: boolean) => {\n setState((prev) => ({\n ...prev,\n savedAsSecret: { ...prev.savedAsSecret, [key]: value },\n }));\n };\n\n const saveHostedCredentialAsSecret = (): Promise<void> => {\n const secretName = option?.auth.credentialSecretName;\n const apiKey = stateRef.current.values.api_key?.trim();\n if (!secretName \|\| !apiKey \|\| !stateRef.current.savedAsSecret.api_key) {\n return Promise.resolve();\n }\n\n const field: MarketplaceField = {\n key: secretName,\n label: option.auth.credentialLabel ?? secretName,\n type: \"password\",\n };\n return saveFieldsAsSecrets(\n [field],\n { [secretName]: apiKey },\n { [secretName]: true },\n );\n };\n\n const saveSelectedSecrets = (): Promise<void> => {\n if (template?.kind === \"stdio\") {\n return saveFieldsAsSecrets(\n template.envFields ?? [],\n stateRef.current.values,\n stateRef.current.savedAsSecret,\n );\n }\n if (template?.kind === \"shttp\" \|\| template?.kind === \"sse\") {\n return Promise.all([\n saveHostedCredentialAsSecret(),\n saveFieldsAsSecrets(\n getRemoteHeaderFields(option),\n stateRef.current.values,\n stateRef.current.savedAsSecret,\n ),\n ]).then(() => undefined);\n }\n return Promise.resolve();\n };\n\n const makeTestErrorMessage = (failure: ExtendedMCPTestFailure): string => {\n switch (failure.error_kind) {\n case \"timeout\":\n return t(I18nKey.MCP$TEST_ERROR_TIMEOUT);\n case \"connection\":\n return t(I18nKey.MCP$TEST_ERROR_CONNECTION);\n case \"credentials\":\n return t(I18nKey.MCP$TEST_ERROR_CREDENTIALS, { error: failure.error });\n default:\n return t(I18nKey.MCP$TEST_ERROR_UNKNOWN, { error: failure.error });\n }\n };\n\n const submitServer = (payload: MCPServerConfig) => {\n if (payload.auth?.strategy === \"oauth2\") {\n setIsAuthorizingOAuth(true);\n void McpService.authorizeOAuth(payload)\n .then((result) => {\n if (!result.ok) {\n setGlobalError(makeTestErrorMessage(result));\n return;\n }\n const serverToSave = result.oauth_state\n ? {\n ...payload,\n auth: { ...payload.auth!, state: result.oauth_state },\n }\n : payload;\n addMcpServer(serverToSave, {\n onSuccess: () => {\n displaySuccessToast(t(I18nKey.MCP$INSTALL_SUCCESS));\n setIsFinalizingInstall(true);\n void (async () => {\n try {\n await saveSelectedSecrets();\n } finally {\n onSuccess?.(entry);\n onClose();\n }\n })();\n },\n onError: (err: unknown) => {\n const message = retrieveAxiosErrorMessage(err as AxiosError);\n setGlobalError(message \|\| t(I18nKey.ERROR$GENERIC));\n },\n });\n })\n .catch((err: unknown) => {\n const message = retrieveAxiosErrorMessage(err as AxiosError);\n setGlobalError(message \|\| t(I18nKey.ERROR$GENERIC));\n })\n .finally(() => setIsAuthorizingOAuth(false));\n return;\n }\n testMcpServer(payload, {\n onSuccess: (result) => {\n if (!result.ok) {\n setGlobalError(makeTestErrorMessage(result));\n // Modal stays open — do NOT call onClose.\n return;\n }\n const serverToSave =\n result.oauth_state && payload.auth?.strategy === \"oauth2\"\n ? {\n ...payload,\n auth: { ...payload.auth, state: result.oauth_state },\n }\n : payload;\n addMcpServer(serverToSave, {\n onSuccess: () => {\n displaySuccessToast(t(I18nKey.MCP$INSTALL_SUCCESS));\n setIsFinalizingInstall(true);\n void (async () => {\n try {\n await saveSelectedSecrets();\n } finally {\n onSuccess?.(entry);\n onClose();\n }\n })();\n },\n onError: (err: unknown) => {\n const message = retrieveAxiosErrorMessage(err as AxiosError);\n setGlobalError(message \|\| t(I18nKey.ERROR$GENERIC));\n },\n });\n },\n onError: (err: unknown) => {\n const message = retrieveAxiosErrorMessage(err as AxiosError);\n setGlobalError(message \|\| t(I18nKey.ERROR$GENERIC));\n },\n });\n };\n\n // ------------------------------------------------------------------\n // Per-template submit handlers. Each is small and self-contained:\n // validate user input, build the payload, then hand off to\n // submitServer.\n // ------------------------------------------------------------------\n const handleHttpServerSubmit = () => {\n // TS narrows this branch to shttp\|sse; the equality guard is a\n // runtime/defensive belt to make the helper safe in isolation.\n if (template?.kind !== \"shttp\" && template?.kind !== \"sse\") {\n return;\n }\n if (!option) return;\n const apiKey = state.values.api_key?.trim() ?? \"\";\n const url = template.urlEditable\n ? (state.values.url?.trim() ?? \"\")\n : template.url;\n const oauthMode = isOAuthOption(option);\n const needsCredential = optionNeedsCredentialField(option);\n const headerFields = getRemoteHeaderFields(option);\n const headerErrors: Record<string, string \| null> = {};\n if (!url) {\n headerErrors.url = t(I18nKey.SETTINGS$MCP_ERROR_URL_REQUIRED);\n } else {\n try {\n const parsedUrl = new URL(url);\n if (![\"http:\", \"https:\"].includes(parsedUrl.protocol)) {\n headerErrors.url = t(I18nKey.SETTINGS$MCP_ERROR_URL_INVALID_PROTOCOL);\n }\n } catch {\n headerErrors.url = t(I18nKey.SETTINGS$MCP_ERROR_URL_INVALID);\n }\n }\n for (const field of headerFields) {\n if (field.required && !(state.values[field.key] ?? \"\").trim()) {\n headerErrors[field.key] = t(I18nKey.MCP$ERROR_FIELD_REQUIRED);\n }\n }\n if (\n !oauthMode &&\n needsCredential &&\n !isCredentialOptional(option) &&\n !apiKey\n ) {\n headerErrors.api_key = t(I18nKey.MCP$ERROR_FIELD_REQUIRED);\n }\n if (Object.values(headerErrors).some(Boolean)) {\n setState((prev) => ({ ...prev, errors: headerErrors }));\n return;\n }\n const oauthAuthentication = oauthMode\n ? getMcpOAuthAuthenticationConfig(option)\n : undefined;\n const fieldHeaders = Object.fromEntries(\n headerFields\n .map((field) => [field.key, state.values[field.key]?.trim() ?? \"\"])\n .filter(([, value]) => value),\n );\n const hasFieldHeaders = Object.keys(fieldHeaders).length > 0;\n let auth: MCPAuthCredential \| undefined;\n if (oauthMode) {\n auth = {\n strategy: \"oauth2\",\n ...(oauthAuthentication && { authentication: oauthAuthentication }),\n };\n } else if (needsCredential && apiKey) {\n auth =\n option.auth.strategy === \"api_key\"\n ? {\n strategy: \"api_key\",\n value: apiKey,\n ...(option.auth.apiKeyHeaderName && {\n header_name: option.auth.apiKeyHeaderName,\n }),\n }\n : { strategy: \"bearer\", value: apiKey };\n } else if (hasFieldHeaders) {\n auth = { strategy: \"header\", headers: fieldHeaders };\n }\n const payload: MCPServerConfig = {\n id: `${template.kind}-${uuidv4()}`,\n type: template.kind,\n // Name remote servers after the catalog slug (e.g. \"github\") so they\n // get a referenceable, LLM-tool-safe mcp_config key instead of the\n // auto-generated \"sse\"/\"shttp\" fallback. Stdio installs already carry\n // serverName from the catalog.\n name: toMcpServerName(entry.id),\n url,\n ...(auth && { auth }),\n ...(hasFieldHeaders &&\n auth?.strategy !== \"header\" && { headers: fieldHeaders }),\n };\n submitServer(payload);\n };\n\n const handleStdioSubmit = () => {\n if (template?.kind !== \"stdio\") return;\n const stdio = template;\n const errors: Record<string, string \| null> = {};\n\n for (const field of stdio.envFields ?? []) {\n if (field.required && !(state.values[field.key] ?? \"\").trim()) {\n errors[field.key] = t(I18nKey.MCP$ERROR_FIELD_REQUIRED);\n }\n }\n for (const field of stdio.argFields ?? []) {\n if (field.required && !(state.values[field.key] ?? \"\").trim()) {\n errors[field.key] = t(I18nKey.MCP$ERROR_FIELD_REQUIRED);\n }\n }\n if (Object.values(errors).some(Boolean)) {\n setState((prev) => ({ ...prev, errors }));\n return;\n }\n\n const env: Record<string, string> = {};\n for (const field of stdio.envFields ?? []) {\n const v = state.values[field.key]?.trim();\n if (v) env[field.key] = v;\n }\n const extraArgs: string[] = [];\n for (const field of stdio.argFields ?? []) {\n const v = state.values[field.key]?.trim();\n if (v) {\n // Filesystem-style multi-token input: split on whitespace.\n for (const token of v.split(/\\s+/)) {\n if (token) extraArgs.push(token);\n }\n }\n }\n\n const payload: MCPServerConfig = {\n id: `stdio-${uuidv4()}`,\n type: \"stdio\",\n name: stdio.serverName,\n command: stdio.command,\n args: [...stdio.args, ...extraArgs],\n ...(Object.keys(env).length > 0 && { env }),\n };\n submitServer(payload);\n };\n\n const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {\n event.preventDefault();\n setGlobalError(null);\n if (template?.kind === \"shttp\" \|\| template?.kind === \"sse\") {\n return handleHttpServerSubmit();\n }\n return handleStdioSubmit();\n };\n\n const renderFields = () => {\n if (template?.kind === \"shttp\" \|\| template?.kind === \"sse\") {\n const oauthMode = isOAuthOption(option);\n const shouldRenderCredential = optionNeedsCredentialField(option);\n const apiKeyOptional = option ? isCredentialOptional(option) : false;\n const credentialSecretName = option?.auth.credentialSecretName;\n const headerFields = getRemoteHeaderFields(option);\n return (\n <>\n <SettingsInput\n testId=\"mcp-install-field-url\"\n name=\"url\"\n type=\"url\"\n label={t(I18nKey.SETTINGS$MCP_URL)}\n value={state.values.url ?? template.url}\n onChange={(value) => setValue(\"url\", value)}\n isDisabled={!template.urlEditable}\n className=\"w-full\"\n />\n {state.errors.url && (\n <p className=\"text-xs text-red-500\">{state.errors.url}</p>\n )}\n {headerFields.map((field) => (\n <div key={field.key} className=\"flex flex-col gap-1\">\n <SettingsInput\n testId={`mcp-install-field-${field.key}`}\n name={field.key}\n type={field.type === \"password\" ? \"password\" : \"text\"}\n label={field.label}\n value={state.values[field.key] ?? \"\"}\n onChange={(v) => setValue(field.key, v)}\n placeholder={field.placeholder}\n required={field.required}\n showOptionalTag={!field.required}\n className=\"w-full\"\n />\n {field.helperText && (\n <p className=\"text-xs text-tertiary-alt\">\n {renderHelperText(field.helperText)}\n </p>\n )}\n {state.errors[field.key] && (\n <p className=\"text-xs text-red-500\">\n {state.errors[field.key]}\n </p>\n )}\n {field.key in state.savedAsSecret && (\n <SaveAsSecretToggle\n fieldKey={field.key}\n checked={state.savedAsSecret[field.key] ?? false}\n onToggle={(v) => toggleSecret(field.key, v)}\n />\n )}\n </div>\n ))}\n {oauthMode ? (\n <div\n data-testid=\"mcp-install-oauth-info\"\n className=\"flex flex-col gap-2 p-3 rounded-lg border border-[var(--oh-border)] bg-base-tertiary\"\n >\n <p className=\"text-sm text-secondary-light\">\n {t(I18nKey.MCP$OAUTH_CONNECT_INFO)}\n </p>\n <p className=\"text-xs text-tertiary-alt\">\n {t(I18nKey.MCP$OAUTH_CONNECT_HINT)}\n </p>\n </div>\n ) : shouldRenderCredential ? (\n <div className=\"flex flex-col gap-1\">\n <SettingsInput\n testId=\"mcp-install-field-api_key\"\n name=\"api_key\"\n type=\"password\"\n label={\n option?.auth.credentialLabel ??\n t(I18nKey.SETTINGS$MCP_API_KEY)\n }\n value={state.values.api_key ?? \"\"}\n onChange={(v) => setValue(\"api_key\", v)}\n placeholder={\n option?.auth.credentialPlaceholder ??\n t(I18nKey.SETTINGS$MCP_API_KEY_PLACEHOLDER)\n }\n showOptionalTag={apiKeyOptional}\n required={!apiKeyOptional}\n className=\"w-full\"\n />\n {option?.auth.credentialHelp && (\n <p className=\"text-xs text-tertiary-alt\">\n {renderHelperText(option.auth.credentialHelp)}\n </p>\n )}\n {state.errors.api_key && (\n <p className=\"text-xs text-red-500\">{state.errors.api_key}</p>\n )}\n {credentialSecretName && (\n <SaveAsSecretToggle\n fieldKey={credentialSecretName}\n checked={state.savedAsSecret.api_key ?? false}\n onToggle={(v) => toggleSecret(\"api_key\", v)}\n />\n )}\n </div>\n ) : null}\n </>\n );\n }\n\n if (template?.kind !== \"stdio\") return null;\n const stdio = template;\n return (\n <>\n <SettingsInput\n testId=\"mcp-install-field-command-readonly\"\n name=\"command-readonly\"\n type=\"text\"\n label={t(I18nKey.MCP$COMMAND_LABEL)}\n value={`${stdio.command} ${stdio.args.join(\" \")}`.trim()}\n onChange={() => {}}\n isDisabled\n className=\"w-full\"\n />\n {(stdio.envFields ?? []).map((field) => (\n <div key={field.key} className=\"flex flex-col gap-1\">\n <SettingsInput\n testId={`mcp-install-field-${field.key}`}\n name={field.key}\n type={field.type === \"password\" ? \"password\" : \"text\"}\n label={field.label}\n value={state.values[field.key] ?? \"\"}\n onChange={(v) => setValue(field.key, v)}\n placeholder={field.placeholder}\n required={field.required}\n showOptionalTag={!field.required}\n className=\"w-full\"\n />\n {field.helperText && (\n <p className=\"text-xs text-tertiary-alt\">\n {renderHelperText(field.helperText)}\n </p>\n )}\n {state.errors[field.key] && (\n <p className=\"text-xs text-red-500\">{state.errors[field.key]}</p>\n )}\n {field.key in state.savedAsSecret && (\n <SaveAsSecretToggle\n fieldKey={field.key}\n checked={state.savedAsSecret[field.key]}\n onToggle={(v) => toggleSecret(field.key, v)}\n />\n )}\n </div>\n ))}\n {/ argFields are CLI arguments, not credentials — they don't need\n a \"save as secret\" toggle and are excluded from savedAsSecret. */}\n {(stdio.argFields ?? []).map((field) => (\n <div key={field.key} className=\"flex flex-col gap-1\">\n <SettingsInput\n testId={`mcp-install-field-${field.key}`}\n name={field.key}\n type={field.type === \"password\" ? \"password\" : \"text\"}\n label={field.label}\n value={state.values[field.key] ?? \"\"}\n onChange={(v) => setValue(field.key, v)}\n placeholder={field.placeholder}\n required={field.required}\n showOptionalTag={!field.required}\n className=\"w-full\"\n />\n {field.helperText && (\n <p className=\"text-xs text-tertiary-alt\">\n {renderHelperText(field.helperText)}\n </p>\n )}\n {state.errors[field.key] && (\n <p className=\"text-xs text-red-500\">{state.errors[field.key]}</p>\n )}\n </div>\n ))}\n </>\n );\n };\n\n return (\n <ModalBackdrop onClose={onClose} aria-label={entry.name}>\n <form\n data-testid=\"mcp-install-modal\"\n data-marketplace-id={entry.id}\n onSubmit={handleSubmit}\n className=\"relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)] w-[520px] max-w-[90vw] max-h-[85vh] overflow-y-auto custom-scrollbar\"\n >\n <ModalCloseButton\n onClose={onClose}\n testId=\"mcp-install-modal-close\"\n disabled={isPending}\n />\n <div className=\"flex items-start gap-3 pr-6\">\n <McpLogoBadge entry={entry} />\n <div className=\"flex flex-col flex-1\">\n <h2 className={modalTitleLgClassName}>{entry.name}</h2>\n <p className=\"text-xs text-tertiary-light\">{entry.description}</p>\n </div>\n </div>\n\n {entry.installHint && (\n <p className=\"text-xs text-tertiary-light\">{entry.installHint}</p>\n )}\n\n {entry.docsUrl && (\n <a\n href={entry.docsUrl}\n target=\"_blank\"\n rel=\"noreferrer\"\n className=\"text-xs text-[var(--oh-muted)] hover:text-white hover:underline self-start transition-colors\"\n >\n {t(I18nKey.MCP$VIEW_DOCS)}\n </a>\n )}\n\n <div className=\"flex flex-col gap-3\">{renderFields()}</div>\n\n {globalError && (\n <p\n data-testid=\"mcp-install-modal-error\"\n className=\"text-sm text-red-500 whitespace-pre-wrap\"\n >\n {globalError}\n </p>\n )}\n\n <div className=\"flex justify-end gap-2 mt-2\">\n <BrandButton\n type=\"button\"\n variant=\"secondary\"\n onClick={onClose}\n testId=\"mcp-install-cancel\"\n isDisabled={isPending}\n >\n {t(I18nKey.BUTTON$CANCEL)}\n </BrandButton>\n <BrandButton\n type=\"submit\"\n variant=\"primary\"\n isDisabled={isPending}\n testId=\"mcp-install-submit\"\n >\n {isTesting \|\| isAuthorizingOAuth\n ? t(I18nKey.MCP$VERIFYING)\n : isAdding \|\| isFinalizingInstall\n ? t(I18nKey.SETTINGS$SAVING)\n : t(I18nKey.MCP$INSTALL_BUTTON)}\n </BrandButton>\n </div>\n </form>\n </ModalBackdrop>\n );\n}\n"],"mappings":"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"}

package/dist/components/features/mcp-page/installed-server-card.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../node_modules/lucide-react/dist/esm/icons/puzzle.cjs`),i=require(`../../../utils/utils.cjs`),a=require(`../../../utils/extension-module-card-classes.cjs`),o=require(`../../../utils/mcp-marketplace-utils.cjs`),s=require(`../../../node_modules/@openhands/extensions/integrations/index.cjs`),c=require(`../mcp-logo-badge.cjs`),l=require(`../../shared/buttons/circle-plus-check-toggle.cjs`);let u=require(`react`);u=e.__toESM(u,1);let d=require(`react/jsx-runtime`);function f(e){switch(e){case`sse`:return`SSE`;case`shttp`:return`HTTP`;case`stdio`:return`STDIO`;default:return e}}function p(e){return e.type===`stdio`?e.name??e.command??``:e.url??``}function m(e){if(e.type===`stdio`){let t=e.args&&e.args.length>0?` ${e.args.join(` `)}`:``;return`${e.command??``}${t}`.trim()}return e.url??``}function h({server:e,onEdit:u,onDelete:h}){let{t:g}=t.useTranslation(`openhands`),_=o.findCatalogEntryForServer(e,o.getMcpMarketplaceCatalog(s.default)),v=_?.name??p(e),y=m(e),b=f(e.type);return(0,d.jsx)(`div`,{"data-testid":`mcp-server-item`,"data-server-id":e.id,role:`button`,tabIndex:0,onClick:u,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),u())},"aria-label":g(n.I18nKey.MCP$EDIT_SERVER_ARIA,{name:v}),className:i.cn(`flex min-h-[132px] flex-col overflow-hidden p-4 text-left`,a.extensionModuleCardSurfaceClassName,a.extensionModuleCardInteractiveClassName),children:(0,d.jsxs)(`div`,{className:`flex items-start gap-3`,children:[(0,d.jsx)(c.McpLogoBadge,{entry:_,fallback:(0,d.jsx)(r.Puzzle,{strokeWidth:2.25})}),(0,d.jsxs)(`div`,{className:`flex min-w-0 flex-1 flex-col gap-3`,children:[(0,d.jsxs)(`header`,{className:`flex items-start justify-between gap-3`,children:[(0,d.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[(0,d.jsx)(`h3`,{className:`truncate text-sm font-semibold`,title:v,children:v}),(0,d.jsx)(`p`,{className:`mt-0.5 text-xs text-tertiary-alt`,children:b})]}),(0,d.jsx)(l.CirclePlusCheckToggle,{testId:`mcp-installed-toggle-${e.id}`,isSelected:!0,onToggle:e=>{e||h()},enableLabelKey:n.I18nKey.MCP$TOGGLE_ADD_SERVER,disableLabelKey:n.I18nKey.MCP$TOGGLE_REMOVE_SERVER})]}),_?.description?(0,d.jsx)(`p`,{"data-testid":`mcp-server-description-${e.id}`,className:`line-clamp-2 break-words text-xs leading-relaxed text-tertiary-light`,children:_.description}):null,y?(0,d.jsx)(`p`,{"data-testid":`mcp-server-detail-${e.id}`,className:`truncate text-xs text-tertiary-alt`,title:y,children:y}):null]})]})})}exports.InstalledServerCard=h;
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../node_modules/lucide-react/dist/esm/icons/puzzle.cjs`),i=require(`../../../utils/utils.cjs`),a=require(`../../../utils/extension-module-card-classes.cjs`),o=require(`../../../utils/mcp-marketplace-utils.cjs`),s=require(`../../../node_modules/@openhands/extensions/integrations/index.cjs`),c=require(`../mcp-logo-badge.cjs`),l=require(`../../shared/buttons/circle-plus-check-toggle.cjs`),u=require(`../../../utils/mcp-installed-server-display.cjs`);let d=require(`react`);d=e.__toESM(d,1);let f=require(`react/jsx-runtime`);function p(e){switch(e){case`sse`:return`SSE`;case`shttp`:return`HTTP`;case`stdio`:return`STDIO`;default:return e}}function m(e){if(e.type===`stdio`){let t=e.args&&e.args.length>0?` ${e.args.join(` `)}`:``;return`${e.command??``}${t}`.trim()}return e.url??``}function h({server:e,onEdit:d,onDelete:h}){let{t:g}=t.useTranslation(`openhands`),_=o.findCatalogEntryForServer(e,o.getMcpMarketplaceCatalog(s.default)),v=u.getInstalledServerTitle(e,_),y=m(e),b=p(e.type);return(0,f.jsx)(`div`,{"data-testid":`mcp-server-item`,"data-server-id":e.id,role:`button`,tabIndex:0,onClick:d,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),d())},"aria-label":g(n.I18nKey.MCP$EDIT_SERVER_ARIA,{name:v}),className:i.cn(`flex min-h-[132px] flex-col overflow-hidden p-4 text-left`,a.extensionModuleCardSurfaceClassName,a.extensionModuleCardInteractiveClassName),children:(0,f.jsxs)(`div`,{className:`flex items-start gap-3`,children:[(0,f.jsx)(c.McpLogoBadge,{entry:_,fallback:(0,f.jsx)(r.Puzzle,{strokeWidth:2.25})}),(0,f.jsxs)(`div`,{className:`flex min-w-0 flex-1 flex-col gap-3`,children:[(0,f.jsxs)(`header`,{className:`flex items-start justify-between gap-3`,children:[(0,f.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[(0,f.jsx)(`h3`,{className:`truncate text-sm font-semibold`,title:v,children:v}),(0,f.jsx)(`p`,{className:`mt-0.5 text-xs text-tertiary-alt`,children:b})]}),(0,f.jsx)(l.CirclePlusCheckToggle,{testId:`mcp-installed-toggle-${e.id}`,isSelected:!0,onToggle:e=>{e||h()},enableLabelKey:n.I18nKey.MCP$TOGGLE_ADD_SERVER,disableLabelKey:n.I18nKey.MCP$TOGGLE_REMOVE_SERVER})]}),_?.description?(0,f.jsx)(`p`,{"data-testid":`mcp-server-description-${e.id}`,className:`line-clamp-2 break-words text-xs leading-relaxed text-tertiary-light`,children:_.description}):null,y?(0,f.jsx)(`p`,{"data-testid":`mcp-server-detail-${e.id}`,className:`truncate text-xs text-tertiary-alt`,title:y,children:y}):null]})]})})}exports.InstalledServerCard=h;
 //# sourceMappingURL=installed-server-card.cjs.map

package/dist/components/features/mcp-page/installed-server-card.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"installed-server-card.cjs","names":[],"sources":["../../../../src/components/features/mcp-page/installed-server-card.tsx"],"sourcesContent":["import React from \"react\";\nimport { Puzzle } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { McpLogoBadge } from \"#/components/features/mcp-logo-badge\";\nimport { CirclePlusCheckToggle } from \"#/components/shared/buttons/circle-plus-check-toggle\";\nimport { MCPServerConfig } from \"#/types/mcp-server\";\nimport { INTEGRATION_CATALOG as MCP_MARKETPLACE } from \"@openhands/extensions/integrations\";\nimport {\n findCatalogEntryForServer,\n getMcpMarketplaceCatalog,\n} from \"#/utils/mcp-marketplace-utils\";\nimport { cn } from \"#/utils/utils\";\nimport {\n extensionModuleCardInteractiveClassName,\n extensionModuleCardSurfaceClassName,\n} from \"#/utils/extension-module-card-classes\";\n\ninterface InstalledServerCardProps {\n server: MCPServerConfig;\n onEdit: () => void;\n onDelete: () => void;\n}\n\nfunction getServerTransportLabel(type: MCPServerConfig[\"type\"]) {\n switch (type) {\n case \"sse\":\n return \"SSE\";\n case \"shttp\":\n return \"HTTP\";\n case \"stdio\":\n return \"STDIO\";\n default:\n return type;\n }\n}\n\nfunction ~~getServerTitle(server: MCPServerConfig): string {\n if (server.type === \"stdio\") return server.name ?? server.command ?? \"\";\n return server.url ?? \"\";\n}\n\nfunction~~ getServerDetailLine(server: MCPServerConfig): string {\n if (server.type === \"stdio\") {\n const args =\n server.args && server.args.length > 0 ? ` ${server.args.join(\" \")}` : \"\";\n return `${server.command ?? \"\"}${args}`.trim();\n }\n return server.url ?? \"\";\n}\n\nexport function InstalledServerCard({\n server,\n onEdit,\n onDelete,\n}: InstalledServerCardProps) {\n const { t } = useTranslation(\"openhands\");\n const catalog = findCatalogEntryForServer(\n server,\n getMcpMarketplaceCatalog(MCP_MARKETPLACE),\n );\n\n const title = ~~catalog?.name ?? getServerTitle~~(server);\n const detailLine = getServerDetailLine(server);\n const transport = getServerTransportLabel(server.type);\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n onEdit();\n }\n };\n\n return (\n <div\n data-testid=\"mcp-server-item\"\n data-server-id={server.id}\n role=\"button\"\n tabIndex={0}\n onClick={onEdit}\n onKeyDown={handleKeyDown}\n aria-label={t(I18nKey.MCP$EDIT_SERVER_ARIA, { name: title })}\n className={cn(\n \"flex min-h-[132px] flex-col overflow-hidden p-4 text-left\",\n extensionModuleCardSurfaceClassName,\n extensionModuleCardInteractiveClassName,\n )}\n >\n <div className=\"flex items-start gap-3\">\n <McpLogoBadge\n entry={catalog}\n fallback={<Puzzle strokeWidth={2.25} />}\n />\n\n <div className=\"flex min-w-0 flex-1 flex-col gap-3\">\n <header className=\"flex items-start justify-between gap-3\">\n <div className=\"min-w-0 flex-1\">\n <h3 className=\"truncate text-sm font-semibold\" title={title}>\n {title}\n </h3>\n <p className=\"mt-0.5 text-xs text-tertiary-alt\">{transport}</p>\n </div>\n <CirclePlusCheckToggle\n testId={`mcp-installed-toggle-${server.id}`}\n isSelected\n onToggle={(selected) => {\n if (!selected) {\n onDelete();\n }\n }}\n enableLabelKey={I18nKey.MCP$TOGGLE_ADD_SERVER}\n disableLabelKey={I18nKey.MCP$TOGGLE_REMOVE_SERVER}\n />\n </header>\n\n {catalog?.description ? (\n <p\n data-testid={`mcp-server-description-${server.id}`}\n className=\"line-clamp-2 break-words text-xs leading-relaxed text-tertiary-light\"\n >\n {catalog.description}\n </p>\n ) : null}\n\n {detailLine ? (\n <p\n data-testid={`mcp-server-detail-${server.id}`}\n className=\"truncate text-xs text-tertiary-alt\"\n title={detailLine}\n >\n {detailLine}\n </p>\n ) : null}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"~~mpBAwBA~~,SAAS,EAAwB,EAA+B,CAC9D,OAAQ,EAAR,CACE,IAAK,MACH,MAAO,MACT,IAAK,QACH,MAAO,OACT,IAAK,QACH,MAAO,QACT,QACE,OAAO,GAIb,SAAS,~~EAAe,EAAiC,CAEvD,OADI,EAAO,OAAS,QAAgB,EAAO,MAAQ,EAAO,SAAW,GAC9D,EAAO,KAAO,GAGvB,SAAS,~~EAAoB,EAAiC,CAC5D,GAAI,EAAO,OAAS,QAAS,CAC3B,IAAM,EACJ,EAAO,MAAQ,EAAO,KAAK,OAAS,EAAI,IAAI,EAAO,KAAK,KAAK,IAAI,GAAK,GACxE,MAAO,GAAG,EAAO,SAAW,KAAK,IAAO,MAAM,CAEhD,OAAO,EAAO,KAAO,GAGvB,SAAgB,EAAoB,CAClC,SACA,SACA,YAC2B,CAC3B,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,EAAU,EAAA,0BACd,EACA,EAAA,yBAAyB,EAAA,QAAgB,CAC1C,CAEK,EAAQ,~~GAAS~~,~~MAAQ~~,~~EAAe~~,~~EAAO~~,~~CAC/C~~,EAAa,EAAoB,EAAO,CACxC,EAAY,EAAwB,EAAO,KAAK,CAStD,OACE,EAAA,EAAA,KAAC,MAAD,CACE,cAAY,kBACZ,iBAAgB,EAAO,GACvB,KAAK,SACL,SAAU,EACV,QAAS,EACT,UAdmB,GAA+B,EAChD,EAAM,MAAQ,SAAW,EAAM,MAAQ,OACzC,EAAM,gBAAgB,CACtB,GAAQ,GAYR,aAAY,EAAE,EAAA,QAAQ,qBAAsB,CAAE,KAAM,EAAO,CAAC,CAC5D,UAAW,EAAA,GACT,4DACA,EAAA,oCACA,EAAA,wCACD,WAED,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,kCAAf,EACE,EAAA,EAAA,KAAC,EAAA,aAAD,CACE,MAAO,EACP,UAAU,EAAA,EAAA,KAAC,EAAA,OAAD,CAAQ,YAAa,KAAQ,CAAA,CACvC,CAAA,EAEF,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,8CAAf,EACE,EAAA,EAAA,MAAC,SAAD,CAAQ,UAAU,kDAAlB,EACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,0BAAf,EACE,EAAA,EAAA,KAAC,KAAD,CAAI,UAAU,iCAAwC,iBACnD,EACE,CAAA,EACL,EAAA,EAAA,KAAC,IAAD,CAAG,UAAU,4CAAoC,EAAc,CAAA,CAC3D,IACN,EAAA,EAAA,KAAC,EAAA,sBAAD,CACE,OAAQ,wBAAwB,EAAO,KACvC,WAAA,GACA,SAAW,GAAa,CACjB,GACH,GAAU,EAGd,eAAgB,EAAA,QAAQ,sBACxB,gBAAiB,EAAA,QAAQ,yBACzB,CAAA,CACK,GAER,GAAS,aACR,EAAA,EAAA,KAAC,IAAD,CACE,cAAa,0BAA0B,EAAO,KAC9C,UAAU,gFAET,EAAQ,YACP,CAAA,CACF,KAEH,GACC,EAAA,EAAA,KAAC,IAAD,CACE,cAAa,qBAAqB,EAAO,KACzC,UAAU,qCACV,MAAO,WAEN,EACC,CAAA,CACF,KACA,GACF,GACF,CAAA"}
1	+ {"version":3,"file":"installed-server-card.cjs","names":[],"sources":["../../../../src/components/features/mcp-page/installed-server-card.tsx"],"sourcesContent":["import React from \"react\";\nimport { Puzzle } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { McpLogoBadge } from \"#/components/features/mcp-logo-badge\";\nimport { CirclePlusCheckToggle } from \"#/components/shared/buttons/circle-plus-check-toggle\";\nimport { MCPServerConfig } from \"#/types/mcp-server\";\nimport { INTEGRATION_CATALOG as MCP_MARKETPLACE } from \"@openhands/extensions/integrations\";\nimport {\n findCatalogEntryForServer,\n getMcpMarketplaceCatalog,\n} from \"#/utils/mcp-marketplace-utils\";\nimport { cn } from \"#/utils/utils\";\nimport {\n extensionModuleCardInteractiveClassName,\n extensionModuleCardSurfaceClassName,\n} from \"#/utils/extension-module-card-classes\";\nimport { getInstalledServerTitle } from \"#/utils/mcp-installed-server-display\";\n\ninterface InstalledServerCardProps {\n server: MCPServerConfig;\n onEdit: () => void;\n onDelete: () => void;\n}\n\nfunction getServerTransportLabel(type: MCPServerConfig[\"type\"]) {\n switch (type) {\n case \"sse\":\n return \"SSE\";\n case \"shttp\":\n return \"HTTP\";\n case \"stdio\":\n return \"STDIO\";\n default:\n return type;\n }\n}\n\nfunction getServerDetailLine(server: MCPServerConfig): string {\n if (server.type === \"stdio\") {\n const args =\n server.args && server.args.length > 0 ? ` ${server.args.join(\" \")}` : \"\";\n return `${server.command ?? \"\"}${args}`.trim();\n }\n return server.url ?? \"\";\n}\n\nexport function InstalledServerCard({\n server,\n onEdit,\n onDelete,\n}: InstalledServerCardProps) {\n const { t } = useTranslation(\"openhands\");\n const catalog = findCatalogEntryForServer(\n server,\n getMcpMarketplaceCatalog(MCP_MARKETPLACE),\n );\n\n const title = getInstalledServerTitle(server, catalog);\n const detailLine = getServerDetailLine(server);\n const transport = getServerTransportLabel(server.type);\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n onEdit();\n }\n };\n\n return (\n <div\n data-testid=\"mcp-server-item\"\n data-server-id={server.id}\n role=\"button\"\n tabIndex={0}\n onClick={onEdit}\n onKeyDown={handleKeyDown}\n aria-label={t(I18nKey.MCP$EDIT_SERVER_ARIA, { name: title })}\n className={cn(\n \"flex min-h-[132px] flex-col overflow-hidden p-4 text-left\",\n extensionModuleCardSurfaceClassName,\n extensionModuleCardInteractiveClassName,\n )}\n >\n <div className=\"flex items-start gap-3\">\n <McpLogoBadge\n entry={catalog}\n fallback={<Puzzle strokeWidth={2.25} />}\n />\n\n <div className=\"flex min-w-0 flex-1 flex-col gap-3\">\n <header className=\"flex items-start justify-between gap-3\">\n <div className=\"min-w-0 flex-1\">\n <h3 className=\"truncate text-sm font-semibold\" title={title}>\n {title}\n </h3>\n <p className=\"mt-0.5 text-xs text-tertiary-alt\">{transport}</p>\n </div>\n <CirclePlusCheckToggle\n testId={`mcp-installed-toggle-${server.id}`}\n isSelected\n onToggle={(selected) => {\n if (!selected) {\n onDelete();\n }\n }}\n enableLabelKey={I18nKey.MCP$TOGGLE_ADD_SERVER}\n disableLabelKey={I18nKey.MCP$TOGGLE_REMOVE_SERVER}\n />\n </header>\n\n {catalog?.description ? (\n <p\n data-testid={`mcp-server-description-${server.id}`}\n className=\"line-clamp-2 break-words text-xs leading-relaxed text-tertiary-light\"\n >\n {catalog.description}\n </p>\n ) : null}\n\n {detailLine ? (\n <p\n data-testid={`mcp-server-detail-${server.id}`}\n className=\"truncate text-xs text-tertiary-alt\"\n title={detailLine}\n >\n {detailLine}\n </p>\n ) : null}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"gtBAyBA,SAAS,EAAwB,EAA+B,CAC9D,OAAQ,EAAR,CACE,IAAK,MACH,MAAO,MACT,IAAK,QACH,MAAO,OACT,IAAK,QACH,MAAO,QACT,QACE,OAAO,GAIb,SAAS,EAAoB,EAAiC,CAC5D,GAAI,EAAO,OAAS,QAAS,CAC3B,IAAM,EACJ,EAAO,MAAQ,EAAO,KAAK,OAAS,EAAI,IAAI,EAAO,KAAK,KAAK,IAAI,GAAK,GACxE,MAAO,GAAG,EAAO,SAAW,KAAK,IAAO,MAAM,CAEhD,OAAO,EAAO,KAAO,GAGvB,SAAgB,EAAoB,CAClC,SACA,SACA,YAC2B,CAC3B,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,EAAU,EAAA,0BACd,EACA,EAAA,yBAAyB,EAAA,QAAgB,CAC1C,CAEK,EAAQ,EAAA,wBAAwB,EAAQ,EAAQ,CAChD,EAAa,EAAoB,EAAO,CACxC,EAAY,EAAwB,EAAO,KAAK,CAStD,OACE,EAAA,EAAA,KAAC,MAAD,CACE,cAAY,kBACZ,iBAAgB,EAAO,GACvB,KAAK,SACL,SAAU,EACV,QAAS,EACT,UAdmB,GAA+B,EAChD,EAAM,MAAQ,SAAW,EAAM,MAAQ,OACzC,EAAM,gBAAgB,CACtB,GAAQ,GAYR,aAAY,EAAE,EAAA,QAAQ,qBAAsB,CAAE,KAAM,EAAO,CAAC,CAC5D,UAAW,EAAA,GACT,4DACA,EAAA,oCACA,EAAA,wCACD,WAED,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,kCAAf,EACE,EAAA,EAAA,KAAC,EAAA,aAAD,CACE,MAAO,EACP,UAAU,EAAA,EAAA,KAAC,EAAA,OAAD,CAAQ,YAAa,KAAQ,CAAA,CACvC,CAAA,EAEF,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,8CAAf,EACE,EAAA,EAAA,MAAC,SAAD,CAAQ,UAAU,kDAAlB,EACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,0BAAf,EACE,EAAA,EAAA,KAAC,KAAD,CAAI,UAAU,iCAAwC,iBACnD,EACE,CAAA,EACL,EAAA,EAAA,KAAC,IAAD,CAAG,UAAU,4CAAoC,EAAc,CAAA,CAC3D,IACN,EAAA,EAAA,KAAC,EAAA,sBAAD,CACE,OAAQ,wBAAwB,EAAO,KACvC,WAAA,GACA,SAAW,GAAa,CACjB,GACH,GAAU,EAGd,eAAgB,EAAA,QAAQ,sBACxB,gBAAiB,EAAA,QAAQ,yBACzB,CAAA,CACK,GAER,GAAS,aACR,EAAA,EAAA,KAAC,IAAD,CACE,cAAa,0BAA0B,EAAO,KAC9C,UAAU,gFAET,EAAQ,YACP,CAAA,CACF,KAEH,GACC,EAAA,EAAA,KAAC,IAAD,CACE,cAAa,qBAAqB,EAAO,KACzC,UAAU,qCACV,MAAO,WAEN,EACC,CAAA,CACF,KACA,GACF,GACF,CAAA"}

package/dist/components/features/mcp-page/installed-server-card.js CHANGED Viewed

@@ -7,10 +7,11 @@ import { findCatalogEntryForServer as o, getMcpMarketplaceCatalog as s } from ".
 import c from "../../../node_modules/@openhands/extensions/integrations/index.js";
 import { McpLogoBadge as l } from "../mcp-logo-badge.js";
 import { CirclePlusCheckToggle as u } from "../../shared/buttons/circle-plus-check-toggle.js";
+import { getInstalledServerTitle as d } from "../../../utils/mcp-installed-server-display.js";
 import "react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/components/features/mcp-page/installed-server-card.tsx
-function p(e) {
+function m(e) {
 	switch (e) {
 		case "sse": return "SSE";
 		case "shttp": return "HTTP";
@@ -18,9 +19,6 @@ function p(e) {
 		default: return e;
 	}
 }
-function m(e) {
-	return e.type === "stdio" ? e.name ?? e.command ?? "" : e.url ?? "";
-}
 function h(e) {
 	if (e.type === "stdio") {
 		let t = e.args && e.args.length > 0 ? ` ${e.args.join(" ")}` : "";
@@ -29,8 +27,8 @@ function h(e) {
 	return e.url ?? "";
 }
 function g({ server: g, onEdit: _, onDelete: v }) {
-	let { t: y } = e("openhands"), b = o(g, s(c)), x = b?.name ?? m(g), S = h(g), C = p(g.type);
-	return /* @__PURE__ */ d("div", {
+	let { t: y } = e("openhands"), b = o(g, s(c)), x = d(g, b), S = h(g), C = m(g.type);
+	return /* @__PURE__ */ f("div", {
 		"data-testid": "mcp-server-item",
 		"data-server-id": g.id,
 		role: "button",
@@ -41,27 +39,27 @@ function g({ server: g, onEdit: _, onDelete: v }) {
 		},
 		"aria-label": y(t.MCP$EDIT_SERVER_ARIA, { name: x }),
 		className: r("flex min-h-[132px] flex-col overflow-hidden p-4 text-left", a, i),
-		children: /* @__PURE__ */ f("div", {
+		children: /* @__PURE__ */ p("div", {
 			className: "flex items-start gap-3",
-			children: [/* @__PURE__ */ d(l, {
+			children: [/* @__PURE__ */ f(l, {
 				entry: b,
-				fallback: /* @__PURE__ */ d(n, { strokeWidth: 2.25 })
-			}), /* @__PURE__ */ f("div", {
+				fallback: /* @__PURE__ */ f(n, { strokeWidth: 2.25 })
+			}), /* @__PURE__ */ p("div", {
 				className: "flex min-w-0 flex-1 flex-col gap-3",
 				children: [
-					/* @__PURE__ */ f("header", {
+					/* @__PURE__ */ p("header", {
 						className: "flex items-start justify-between gap-3",
-						children: [/* @__PURE__ */ f("div", {
+						children: [/* @__PURE__ */ p("div", {
 							className: "min-w-0 flex-1",
-							children: [/* @__PURE__ */ d("h3", {
+							children: [/* @__PURE__ */ f("h3", {
 								className: "truncate text-sm font-semibold",
 								title: x,
 								children: x
-							}), /* @__PURE__ */ d("p", {
+							}), /* @__PURE__ */ f("p", {
 								className: "mt-0.5 text-xs text-tertiary-alt",
 								children: C
 							})]
-						}), /* @__PURE__ */ d(u, {
+						}), /* @__PURE__ */ f(u, {
 							testId: `mcp-installed-toggle-${g.id}`,
 							isSelected: !0,
 							onToggle: (e) => {
@@ -71,12 +69,12 @@ function g({ server: g, onEdit: _, onDelete: v }) {
 							disableLabelKey: t.MCP$TOGGLE_REMOVE_SERVER
 						})]
 					}),
-					b?.description ? /* @__PURE__ */ d("p", {
+					b?.description ? /* @__PURE__ */ f("p", {
 						"data-testid": `mcp-server-description-${g.id}`,
 						className: "line-clamp-2 break-words text-xs leading-relaxed text-tertiary-light",
 						children: b.description
 					}) : null,
-					S ? /* @__PURE__ */ d("p", {
+					S ? /* @__PURE__ */ f("p", {
 						"data-testid": `mcp-server-detail-${g.id}`,
 						className: "truncate text-xs text-tertiary-alt",
 						title: S,

package/dist/components/features/mcp-page/installed-server-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"installed-server-card.js","names":[],"sources":["../../../../src/components/features/mcp-page/installed-server-card.tsx"],"sourcesContent":["import React from \"react\";\nimport { Puzzle } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { McpLogoBadge } from \"#/components/features/mcp-logo-badge\";\nimport { CirclePlusCheckToggle } from \"#/components/shared/buttons/circle-plus-check-toggle\";\nimport { MCPServerConfig } from \"#/types/mcp-server\";\nimport { INTEGRATION_CATALOG as MCP_MARKETPLACE } from \"@openhands/extensions/integrations\";\nimport {\n findCatalogEntryForServer,\n getMcpMarketplaceCatalog,\n} from \"#/utils/mcp-marketplace-utils\";\nimport { cn } from \"#/utils/utils\";\nimport {\n extensionModuleCardInteractiveClassName,\n extensionModuleCardSurfaceClassName,\n} from \"#/utils/extension-module-card-classes\";\n\ninterface InstalledServerCardProps {\n server: MCPServerConfig;\n onEdit: () => void;\n onDelete: () => void;\n}\n\nfunction getServerTransportLabel(type: MCPServerConfig[\"type\"]) {\n switch (type) {\n case \"sse\":\n return \"SSE\";\n case \"shttp\":\n return \"HTTP\";\n case \"stdio\":\n return \"STDIO\";\n default:\n return type;\n }\n}\n\nfunction ~~getServerTitle(server: MCPServerConfig): string {\n if (server.type === \"stdio\") return server.name ?? server.command ?? \"\";\n return server.url ?? \"\";\n}\n\nfunction~~ getServerDetailLine(server: MCPServerConfig): string {\n if (server.type === \"stdio\") {\n const args =\n server.args && server.args.length > 0 ? ` ${server.args.join(\" \")}` : \"\";\n return `${server.command ?? \"\"}${args}`.trim();\n }\n return server.url ?? \"\";\n}\n\nexport function InstalledServerCard({\n server,\n onEdit,\n onDelete,\n}: InstalledServerCardProps) {\n const { t } = useTranslation(\"openhands\");\n const catalog = findCatalogEntryForServer(\n server,\n getMcpMarketplaceCatalog(MCP_MARKETPLACE),\n );\n\n const title = ~~catalog?.name ?? getServerTitle~~(server);\n const detailLine = getServerDetailLine(server);\n const transport = getServerTransportLabel(server.type);\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n onEdit();\n }\n };\n\n return (\n <div\n data-testid=\"mcp-server-item\"\n data-server-id={server.id}\n role=\"button\"\n tabIndex={0}\n onClick={onEdit}\n onKeyDown={handleKeyDown}\n aria-label={t(I18nKey.MCP$EDIT_SERVER_ARIA, { name: title })}\n className={cn(\n \"flex min-h-[132px] flex-col overflow-hidden p-4 text-left\",\n extensionModuleCardSurfaceClassName,\n extensionModuleCardInteractiveClassName,\n )}\n >\n <div className=\"flex items-start gap-3\">\n <McpLogoBadge\n entry={catalog}\n fallback={<Puzzle strokeWidth={2.25} />}\n />\n\n <div className=\"flex min-w-0 flex-1 flex-col gap-3\">\n <header className=\"flex items-start justify-between gap-3\">\n <div className=\"min-w-0 flex-1\">\n <h3 className=\"truncate text-sm font-semibold\" title={title}>\n {title}\n </h3>\n <p className=\"mt-0.5 text-xs text-tertiary-alt\">{transport}</p>\n </div>\n <CirclePlusCheckToggle\n testId={`mcp-installed-toggle-${server.id}`}\n isSelected\n onToggle={(selected) => {\n if (!selected) {\n onDelete();\n }\n }}\n enableLabelKey={I18nKey.MCP$TOGGLE_ADD_SERVER}\n disableLabelKey={I18nKey.MCP$TOGGLE_REMOVE_SERVER}\n />\n </header>\n\n {catalog?.description ? (\n <p\n data-testid={`mcp-server-description-${server.id}`}\n className=\"line-clamp-2 break-words text-xs leading-relaxed text-tertiary-light\"\n >\n {catalog.description}\n </p>\n ) : null}\n\n {detailLine ? (\n <p\n data-testid={`mcp-server-detail-${server.id}`}\n className=\"truncate text-xs text-tertiary-alt\"\n title={detailLine}\n >\n {detailLine}\n </p>\n ) : null}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"~~;;;;;;;;;;;;AAwBA~~,SAAS,EAAwB,GAA+B;AAC9D,SAAQ,GAAR;EACE,KAAK,MACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,QACE,QAAO;;;AAIb,SAAS,~~EAAe,GAAiC;AAEvD,QADI,EAAO,SAAS,UAAgB,EAAO,QAAQ,EAAO,WAAW,KAC9D,EAAO,OAAO;;AAGvB,SAAS,~~EAAoB,GAAiC;AAC5D,KAAI,EAAO,SAAS,SAAS;EAC3B,IAAM,IACJ,EAAO,QAAQ,EAAO,KAAK,SAAS,IAAI,IAAI,EAAO,KAAK,KAAK,IAAI,KAAK;AACxE,SAAO,GAAG,EAAO,WAAW,KAAK,IAAO,MAAM;;AAEhD,QAAO,EAAO,OAAO;;AAGvB,SAAgB,EAAoB,EAClC,WACA,WACA,eAC2B;CAC3B,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAU,EACd,GACA,EAAyB,EAAgB,CAC1C,EAEK,IAAQ,~~GAAS~~,~~QAAQ~~,~~EAAe~~,~~EAAO~~,~~EAC/C,~~IAAa,EAAoB,EAAO,EACxC,IAAY,EAAwB,EAAO,KAAK;AAStD,QACE,kBAAC,OAAD;EACE,eAAY;EACZ,kBAAgB,EAAO;EACvB,MAAK;EACL,UAAU;EACV,SAAS;EACT,YAdmB,MAA+B;AACpD,IAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,SACzC,EAAM,gBAAgB,EACtB,GAAQ;;EAYR,cAAY,EAAE,EAAQ,sBAAsB,EAAE,MAAM,GAAO,CAAC;EAC5D,WAAW,EACT,6DACA,GACA,EACD;YAED,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,GAAD;IACE,OAAO;IACP,UAAU,kBAAC,GAAD,EAAQ,aAAa,MAAQ,CAAA;IACvC,CAAA,EAEF,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,UAAD;MAAQ,WAAU;gBAAlB,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,MAAD;QAAI,WAAU;QAAwC;kBACnD;QACE,CAAA,EACL,kBAAC,KAAD;QAAG,WAAU;kBAAoC;QAAc,CAAA,CAC3D;UACN,kBAAC,GAAD;OACE,QAAQ,wBAAwB,EAAO;OACvC,YAAA;OACA,WAAW,MAAa;AACtB,QAAK,KACH,GAAU;;OAGd,gBAAgB,EAAQ;OACxB,iBAAiB,EAAQ;OACzB,CAAA,CACK;;KAER,GAAS,cACR,kBAAC,KAAD;MACE,eAAa,0BAA0B,EAAO;MAC9C,WAAU;gBAET,EAAQ;MACP,CAAA,GACF;KAEH,IACC,kBAAC,KAAD;MACE,eAAa,qBAAqB,EAAO;MACzC,WAAU;MACV,OAAO;gBAEN;MACC,CAAA,GACF;KACA;MACF;;EACF,CAAA"}
1	+ {"version":3,"file":"installed-server-card.js","names":[],"sources":["../../../../src/components/features/mcp-page/installed-server-card.tsx"],"sourcesContent":["import React from \"react\";\nimport { Puzzle } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { McpLogoBadge } from \"#/components/features/mcp-logo-badge\";\nimport { CirclePlusCheckToggle } from \"#/components/shared/buttons/circle-plus-check-toggle\";\nimport { MCPServerConfig } from \"#/types/mcp-server\";\nimport { INTEGRATION_CATALOG as MCP_MARKETPLACE } from \"@openhands/extensions/integrations\";\nimport {\n findCatalogEntryForServer,\n getMcpMarketplaceCatalog,\n} from \"#/utils/mcp-marketplace-utils\";\nimport { cn } from \"#/utils/utils\";\nimport {\n extensionModuleCardInteractiveClassName,\n extensionModuleCardSurfaceClassName,\n} from \"#/utils/extension-module-card-classes\";\nimport { getInstalledServerTitle } from \"#/utils/mcp-installed-server-display\";\n\ninterface InstalledServerCardProps {\n server: MCPServerConfig;\n onEdit: () => void;\n onDelete: () => void;\n}\n\nfunction getServerTransportLabel(type: MCPServerConfig[\"type\"]) {\n switch (type) {\n case \"sse\":\n return \"SSE\";\n case \"shttp\":\n return \"HTTP\";\n case \"stdio\":\n return \"STDIO\";\n default:\n return type;\n }\n}\n\nfunction getServerDetailLine(server: MCPServerConfig): string {\n if (server.type === \"stdio\") {\n const args =\n server.args && server.args.length > 0 ? ` ${server.args.join(\" \")}` : \"\";\n return `${server.command ?? \"\"}${args}`.trim();\n }\n return server.url ?? \"\";\n}\n\nexport function InstalledServerCard({\n server,\n onEdit,\n onDelete,\n}: InstalledServerCardProps) {\n const { t } = useTranslation(\"openhands\");\n const catalog = findCatalogEntryForServer(\n server,\n getMcpMarketplaceCatalog(MCP_MARKETPLACE),\n );\n\n const title = getInstalledServerTitle(server, catalog);\n const detailLine = getServerDetailLine(server);\n const transport = getServerTransportLabel(server.type);\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n onEdit();\n }\n };\n\n return (\n <div\n data-testid=\"mcp-server-item\"\n data-server-id={server.id}\n role=\"button\"\n tabIndex={0}\n onClick={onEdit}\n onKeyDown={handleKeyDown}\n aria-label={t(I18nKey.MCP$EDIT_SERVER_ARIA, { name: title })}\n className={cn(\n \"flex min-h-[132px] flex-col overflow-hidden p-4 text-left\",\n extensionModuleCardSurfaceClassName,\n extensionModuleCardInteractiveClassName,\n )}\n >\n <div className=\"flex items-start gap-3\">\n <McpLogoBadge\n entry={catalog}\n fallback={<Puzzle strokeWidth={2.25} />}\n />\n\n <div className=\"flex min-w-0 flex-1 flex-col gap-3\">\n <header className=\"flex items-start justify-between gap-3\">\n <div className=\"min-w-0 flex-1\">\n <h3 className=\"truncate text-sm font-semibold\" title={title}>\n {title}\n </h3>\n <p className=\"mt-0.5 text-xs text-tertiary-alt\">{transport}</p>\n </div>\n <CirclePlusCheckToggle\n testId={`mcp-installed-toggle-${server.id}`}\n isSelected\n onToggle={(selected) => {\n if (!selected) {\n onDelete();\n }\n }}\n enableLabelKey={I18nKey.MCP$TOGGLE_ADD_SERVER}\n disableLabelKey={I18nKey.MCP$TOGGLE_REMOVE_SERVER}\n />\n </header>\n\n {catalog?.description ? (\n <p\n data-testid={`mcp-server-description-${server.id}`}\n className=\"line-clamp-2 break-words text-xs leading-relaxed text-tertiary-light\"\n >\n {catalog.description}\n </p>\n ) : null}\n\n {detailLine ? (\n <p\n data-testid={`mcp-server-detail-${server.id}`}\n className=\"truncate text-xs text-tertiary-alt\"\n title={detailLine}\n >\n {detailLine}\n </p>\n ) : null}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;AAyBA,SAAS,EAAwB,GAA+B;AAC9D,SAAQ,GAAR;EACE,KAAK,MACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,QACE,QAAO;;;AAIb,SAAS,EAAoB,GAAiC;AAC5D,KAAI,EAAO,SAAS,SAAS;EAC3B,IAAM,IACJ,EAAO,QAAQ,EAAO,KAAK,SAAS,IAAI,IAAI,EAAO,KAAK,KAAK,IAAI,KAAK;AACxE,SAAO,GAAG,EAAO,WAAW,KAAK,IAAO,MAAM;;AAEhD,QAAO,EAAO,OAAO;;AAGvB,SAAgB,EAAoB,EAClC,WACA,WACA,eAC2B;CAC3B,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAU,EACd,GACA,EAAyB,EAAgB,CAC1C,EAEK,IAAQ,EAAwB,GAAQ,EAAQ,EAChD,IAAa,EAAoB,EAAO,EACxC,IAAY,EAAwB,EAAO,KAAK;AAStD,QACE,kBAAC,OAAD;EACE,eAAY;EACZ,kBAAgB,EAAO;EACvB,MAAK;EACL,UAAU;EACV,SAAS;EACT,YAdmB,MAA+B;AACpD,IAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,SACzC,EAAM,gBAAgB,EACtB,GAAQ;;EAYR,cAAY,EAAE,EAAQ,sBAAsB,EAAE,MAAM,GAAO,CAAC;EAC5D,WAAW,EACT,6DACA,GACA,EACD;YAED,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,GAAD;IACE,OAAO;IACP,UAAU,kBAAC,GAAD,EAAQ,aAAa,MAAQ,CAAA;IACvC,CAAA,EAEF,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,UAAD;MAAQ,WAAU;gBAAlB,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,MAAD;QAAI,WAAU;QAAwC;kBACnD;QACE,CAAA,EACL,kBAAC,KAAD;QAAG,WAAU;kBAAoC;QAAc,CAAA,CAC3D;UACN,kBAAC,GAAD;OACE,QAAQ,wBAAwB,EAAO;OACvC,YAAA;OACA,WAAW,MAAa;AACtB,QAAK,KACH,GAAU;;OAGd,gBAAgB,EAAQ;OACxB,iBAAiB,EAAQ;OACzB,CAAA,CACK;;KAER,GAAS,cACR,kBAAC,KAAD;MACE,eAAa,0BAA0B,EAAO;MAC9C,WAAU;gBAET,EAAQ;MACP,CAAA,GACF;KAEH,IACC,kBAAC,KAAD;MACE,eAAa,qBAAqB,EAAO;MACzC,WAAU;MACV,OAAO;gBAEN;MACC,CAAA,GACF;KACA;MACF;;EACF,CAAA"}

package/dist/components/features/onboarding/onboarding-host.d.ts CHANGED Viewed

@@ -4,19 +4,9 @@
  * isn't set yet). Closing or completing the flow marks it done so the
  * modal won't re-appear on subsequent visits.
  *
- * Returning Cloud users are detected via the live settings query: if
- * Cloud already reports a configured LLM (api key + model, or a
- * subscription model with no key), onboarding is skipped and the
- * completion flag is persisted so the same user keeps skipping across
- * tabs and devices.
- *
- * Local backends fall through to the existing localStorage-based
- * gating — env-injected keys make the settings-based signal unreliable
- * there.
- *
- * Stale or unreachable backends fall through to the modal so the
- * existing backend-check / manage-backends recovery path still kicks
- * in for those users.
+ * Backend readiness is intentionally not treated as onboarding completion:
+ * a fresh browser/origin should see onboarding once even when it connects
+ * to an existing backend that already has an LLM configured.
  *
  * With `?previewOnboardingStep=<0-3>` the modal opens on that slide for
  * design review without persisting completion (works on any route when

package/dist/components/features/plugins/add-plugin-modal.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+interface AddPluginModalProps {
+    onClose: () => void;
+    onInstalled?: () => void;
+}
+export declare function AddPluginModal({ onClose, onInstalled }: AddPluginModalProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/plugins/build-plugins-view-model.d.ts ADDED Viewed

@@ -0,0 +1,39 @@
+import type { MarketplacePlugin, LocalPlugin } from "#/api/plugins-service";
+import type { InstalledPluginInfo } from "#/api/plugins-management-service";
+export type PluginStatusFilter = "all" | "installed" | "available" | "local";
+/**
+ * A single row in the plugins management list, reconciling the dynamic
+ * marketplace catalog with the locally-installed plugins.
+ */
+export interface PluginViewModel {
+    name: string;
+    description: string | null;
+    source: string | null;
+    ref: string | null;
+    repoPath: string | null;
+    /** Installed on the local agent-server. */
+    installed: boolean;
+    /** Enabled (only meaningful when installed); enabled plugins auto-load. */
+    enabled: boolean;
+    /** Installed version, when known. */
+    version: string | null;
+    /** Present in the marketplace catalog. */
+    inCatalog: boolean;
+    /**
+     * Discovered from a local ambient directory (e.g. `~/.agents/plugins`).
+     * Read-only: it auto-loads into conversations and is not installed/managed.
+     */
+    isLocal: boolean;
+}
+/**
+ * Merge the marketplace catalog with the installed plugins into one
+ * de-duplicated list keyed by plugin name. The installed list is the source of
+ * truth for install/enable state and coordinates; the catalog supplies
+ * description/coordinates as a fallback. Installed plugins sort first, then
+ * alphabetically.
+ */
+export declare function buildPluginsViewModel(marketplace: MarketplacePlugin[] | undefined, installed: InstalledPluginInfo[] | undefined, local?: LocalPlugin[] | undefined): PluginViewModel[];
+/** True when the plugin matches a free-text search query (empty query matches). */
+export declare function matchesPluginSearch(plugin: PluginViewModel, query: string): boolean;
+/** True when the plugin matches the install-state filter. */
+export declare function matchesPluginStatus(plugin: PluginViewModel, filter: PluginStatusFilter): boolean;

package/dist/components/features/plugins/plugin-card.d.ts ADDED Viewed

@@ -0,0 +1,13 @@
+import type { PluginViewModel } from "./build-plugins-view-model";
+interface PluginCardProps {
+    plugin: PluginViewModel;
+    /** A mutation targeting this plugin is in flight. */
+    isBusy?: boolean;
+    /** Management actions are unavailable (e.g. non-local backend). */
+    isDisabled?: boolean;
+    onOpen: () => void;
+    onInstall: () => void;
+    onToggle: (enabled: boolean) => void;
+}
+export declare function PluginCard({ plugin, isBusy, isDisabled, onOpen, onInstall, onToggle, }: PluginCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/plugins/plugin-detail-modal.d.ts ADDED Viewed

@@ -0,0 +1,13 @@
+import type { PluginViewModel } from "./build-plugins-view-model";
+interface PluginDetailModalProps {
+    plugin: PluginViewModel;
+    isBusy?: boolean;
+    isDisabled?: boolean;
+    onToggle: (enabled: boolean) => void;
+    onInstall: () => void;
+    onUninstall: () => void;
+    onRefresh: () => void;
+    onClose: () => void;
+}
+export declare function PluginDetailModal({ plugin, isBusy, isDisabled, onToggle, onInstall, onUninstall, onRefresh, onClose, }: PluginDetailModalProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/plugins/plugin-picker-card.d.ts ADDED Viewed

@@ -0,0 +1,10 @@
+import type { MarketplacePlugin } from "#/api/plugins-service";
+interface PluginPickerCardProps {
+    plugin: MarketplacePlugin;
+    isSelected: boolean;
+    isDisabled?: boolean;
+    onToggle: (selected: boolean) => void;
+}
+/** A single selectable plugin in the picker catalog (display + attach toggle). */
+export declare function PluginPickerCard({ plugin, isSelected, isDisabled, onToggle, }: PluginPickerCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/plugins/plugin-picker-modal.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import type { PluginSpec } from "#/api/conversation-service/agent-server-conversation-service.types";
+interface PluginPickerModalProps {
+    selected: PluginSpec[];
+    onChange: (next: PluginSpec[]) => void;
+    onClose: () => void;
+}
+/** Modal shell around the reusable {@link PluginPicker} for the launcher flow. */
+export declare function PluginPickerModal({ selected, onChange, onClose, }: PluginPickerModalProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/plugins/plugin-picker-trigger.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+interface PluginPickerTriggerProps {
+    /** Number of currently-attached plugins, shown as a badge when > 0. */
+    count: number;
+    onClick: () => void;
+    disabled?: boolean;
+}
+/** Pill button that opens the plugin picker; mirrors `OpenLauncherButton`. */
+export declare function PluginPickerTrigger({ count, onClick, disabled, }: PluginPickerTriggerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/plugins/plugin-picker.d.ts ADDED Viewed

@@ -0,0 +1,18 @@
+import type { PluginSpec } from "#/api/conversation-service/agent-server-conversation-service.types";
+interface PluginPickerProps {
+    /** Currently-attached plugin references (controlled). */
+    selected: PluginSpec[];
+    /** Called with the next selection whenever the user toggles a plugin. */
+    onChange: (next: PluginSpec[]) => void;
+    /** Render the toggles read-only (e.g. while a parent submit is in flight). */
+    disabled?: boolean;
+}
+/**
+ * Reusable, controlled multi-select over the dynamic plugins catalog
+ * (`usePluginsMarketplace`). Selection lives in the parent as `PluginSpec[]`;
+ * this component only reads the catalog, filters it, and reports toggles. It is
+ * surface-agnostic so the new-conversation flow and the automations UI can both
+ * embed it. No install/enable/disable — that is the plugins management page.
+ */
+export declare function PluginPicker({ selected, onChange, disabled, }: PluginPickerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/plugins/plugin-spec-identity.d.ts ADDED Viewed

@@ -0,0 +1,28 @@
+import type { MarketplacePlugin } from "#/api/plugins-service";
+import type { PluginSpec } from "#/api/conversation-service/agent-server-conversation-service.types";
+/**
+ * Stable identity for a plugin reference. Two references are "the same" when
+ * their attachable coordinates (source / ref / repo_path) match — `name`,
+ * `description`, install state, and parameters are intentionally excluded,
+ * since the start-conversation payload only carries coordinates.
+ *
+ * `null` and `undefined` collapse to "" so a catalog entry (`ref?: null`) and a
+ * stored spec (`ref: null`) compare equal.
+ */
+export declare function pluginSpecKey(plugin: Pick<PluginSpec, "source" | "ref" | "repo_path">): string;
+/**
+ * Map a marketplace catalog entry to the attachable `PluginSpec` consumed by
+ * conversation creation. `parameters` is intentionally omitted (out of scope —
+ * tracked under the plugin-parameters work) and the agent-server adapter drops
+ * it from the payload regardless.
+ */
+export declare function marketplacePluginToSpec(plugin: MarketplacePlugin): PluginSpec;
+/** Whether `plugin`'s coordinates are present in the current selection. */
+export declare function isPluginSelected(selected: PluginSpec[], plugin: Pick<PluginSpec, "source" | "ref" | "repo_path">): boolean;
+/**
+ * Immutably add or remove a catalog plugin from the selection, de-duplicated by
+ * coordinate key. Returns a new array.
+ */
+export declare function togglePluginSelection(selected: PluginSpec[], plugin: MarketplacePlugin): PluginSpec[];
+/** Case-insensitive match over a catalog entry's user-visible text. */
+export declare function matchesPluginPickerSearch(plugin: MarketplacePlugin, query: string): boolean;

package/dist/components/features/plugins/plugins-toolbar.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import type { PluginStatusFilter } from "./build-plugins-view-model";
+interface PluginsToolbarProps {
+    search: string;
+    onSearchChange: (value: string) => void;
+    statusFilter: PluginStatusFilter;
+    onStatusFilterChange: (filter: PluginStatusFilter) => void;
+}
+export declare function PluginsToolbar({ search, onSearchChange, statusFilter, onStatusFilterChange, }: PluginsToolbarProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/settings/agent-profiles/agent-profile-actions-menu.d.ts ADDED Viewed

@@ -0,0 +1,16 @@
+interface AgentProfileActionsMenuProps {
+    onEdit: () => void;
+    onSetActive: () => void;
+    onDelete: () => void;
+    isActive: boolean;
+    isActivating: boolean;
+    onClose: () => void;
+    /**
+     * Element the menu anchors against. When provided, the menu renders into a
+     * body portal with fixed positioning so it isn't clipped by scroll
+     * containers (matches the LLM-profiles menu behavior).
+     */
+    anchorRef?: React.RefObject<HTMLElement | null>;
+}
+export declare function AgentProfileActionsMenu({ onEdit, onSetActive, onDelete, isActive, isActivating, onClose, anchorRef, }: AgentProfileActionsMenuProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/features/settings/agent-profiles/agent-profile-row.d.ts ADDED Viewed

@@ -0,0 +1,13 @@
+import { type AgentProfileSummary } from "#/api/agent-profiles-service/agent-profiles-service.api";
+interface AgentProfileRowProps {
+    profile: AgentProfileSummary;
+    isActive: boolean;
+    /** When false, the row is read-only and the actions menu is hidden. */
+    canManage: boolean;
+    onActivate: (profile: AgentProfileSummary) => void;
+    onEdit: (profile: AgentProfileSummary) => void;
+    onDelete: (profile: AgentProfileSummary) => void;
+    isActivating: boolean;
+}
+export declare function AgentProfileRow({ profile, isActive, canManage, onActivate, onEdit, onDelete, isActivating, }: AgentProfileRowProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/settings/agent-profiles/agent-profiles-body.d.ts ADDED Viewed

@@ -0,0 +1,15 @@
+import { type AgentProfileSummary } from "#/api/agent-profiles-service/agent-profiles-service.api";
+interface AgentProfilesBodyProps {
+    isLoading: boolean;
+    loadError: Error | null;
+    profiles: AgentProfileSummary[];
+    activeId: string | null;
+    /** When false, rows are read-only and the actions menu is hidden. */
+    canManage: boolean;
+    onActivate: (profile: AgentProfileSummary) => void;
+    onEdit: (profile: AgentProfileSummary) => void;
+    onDelete: (profile: AgentProfileSummary) => void;
+    isActivating: boolean;
+}
+export declare function AgentProfilesBody({ isLoading, loadError, profiles, activeId, canManage, onActivate, onEdit, onDelete, isActivating, }: AgentProfilesBodyProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/settings/agent-profiles/agent-profiles-local-view.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+/**
+ * AgentProfilesLocalView mirrors {@link LlmSettingsLocalView}: a list of the
+ * user's Agent profiles, with a create/edit view that reuses the existing Agent
+ * settings form (embedded) plus a profile name and — for OpenHands profiles —
+ * an LLM-profile picker. Available on local backends only.
+ */
+export declare function AgentProfilesLocalView(): import("react/jsx-runtime").JSX.Element;

package/dist/components/features/settings/agent-profiles/agent-profiles-manager.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import { type AgentProfileSummary } from "#/api/agent-profiles-service/agent-profiles-service.api";
+interface AgentProfilesManagerProps {
+    onAddProfile?: () => void;
+    onEditProfile?: (profile: AgentProfileSummary) => void;
+}
+export declare function AgentProfilesManager({ onAddProfile, onEditProfile, }: AgentProfilesManagerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/settings/agent-profiles/delete-agent-profile-modal.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import { type AgentProfileSummary } from "#/api/agent-profiles-service/agent-profiles-service.api";
+interface DeleteAgentProfileModalProps {
+    profile: AgentProfileSummary | null;
+    onClose: () => void;
+}
+export declare function DeleteAgentProfileModal({ profile, onClose, }: DeleteAgentProfileModalProps): import("react/jsx-runtime").JSX.Element | null;
+export {};