@burdenoff/microfe-vibecontrols 2026.524.7 → 2026.525.1

package/dist/components/ai/AIProviderCredentialsCard.js

@@ -167,7 +167,7 @@ function b({ agent: s, provider: c, onAuthSatisfiedChange: l }) {
 		C(!0), D(null);
 		try {
 			let e = await Promise.all(c.fields.map(async (e) => [e.key, await n(s, e.key) ?? ""])), t = Object.fromEntries(e);
-			p(t), _(t);
+			p(Object.fromEntries(c.fields.filter((e) => !e.secret).map((e) => [e.key, t[e.key] ?? ""]))), _(t);
 		} catch (e) {
 			D(e instanceof Error ? e.message : u("ai.providerCredentials.loadFailed", "Failed to load provider credentials"));
 		} finally {
@@ -232,28 +232,33 @@ function b({ agent: s, provider: c, onAuthSatisfiedChange: l }) {
 				children: [/* @__PURE__ */ h(f, { className: "h-4 w-4 animate-spin" }), u("ai.providerCredentials.loading", "Loading…")]
 			}) : /* @__PURE__ */ h("div", {
 				className: "space-y-3",
-				children: c.fields.map((e) => /* @__PURE__ */ h(x, {
-					label: e.key,
-					secret: e.secret ?? !1,
-					value: d[e.key] ?? "",
-					onChange: (t) => p((n) => ({
-						...n,
-						[e.key]: t
-					})),
-					saving: w === e.key,
-					visible: v[e.key] ?? !1,
-					onToggleVisible: () => b((t) => ({
-						...t,
-						[e.key]: !t[e.key]
-					})),
-					onSave: () => void P(e.key, d[e.key] ?? ""),
-					onClear: () => void P(e.key, "")
-				}, e.key))
+				children: c.fields.map((e) => {
+					let t = e.secret ?? !1, n = !!(m[e.key] ?? "").trim();
+					return /* @__PURE__ */ h(x, {
+						label: e.key,
+						secret: t,
+						value: d[e.key] ?? "",
+						saved: n,
+						placeholder: n ? t ? u("ai.providerCredentials.storedSecretPlaceholder", "•••••••• stored — enter a new value to replace") : u("ai.providerCredentials.storedPlaceholder", "stored — enter a new value to replace") : "",
+						onChange: (t) => p((n) => ({
+							...n,
+							[e.key]: t
+						})),
+						saving: w === e.key,
+						visible: v[e.key] ?? !1,
+						onToggleVisible: () => b((t) => ({
+							...t,
+							[e.key]: !t[e.key]
+						})),
+						onSave: () => void P(e.key, d[e.key] ?? ""),
+						onClear: () => void P(e.key, "")
+					}, e.key);
+				})
 			})
 		]
 	});
 }
-function x({ label: e, secret: t, value: n, onChange: r, saving: i, visible: a, onToggleVisible: o, onSave: s, onClear: c }) {
+function x({ label: e, secret: t, value: n, saved: r, placeholder: i, onChange: a, saving: o, visible: s, onToggleVisible: c, onSave: d, onClear: _ }) {
 	return /* @__PURE__ */ g("div", {
 		className: "space-y-2 rounded-lg border border-border-default bg-bg-primary p-3",
 		children: [/* @__PURE__ */ h("label", {
@@ -265,30 +270,31 @@ function x({ label: e, secret: t, value: n, onChange: r, saving: i, visible: a,
 				/* @__PURE__ */ g("div", {
 					className: "relative flex-1",
 					children: [/* @__PURE__ */ h("input", {
-						type: t && !a ? "password" : "text",
+						type: t && !s ? "password" : "text",
 						value: n,
-						onChange: (e) => r(e.target.value),
+						onChange: (e) => a(e.target.value),
 						autoComplete: "off",
 						spellCheck: !1,
+						placeholder: i,
 						className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 pr-10 text-sm text-text-primary"
 					}), t ? /* @__PURE__ */ h("button", {
 						type: "button",
-						onClick: o,
+						onClick: c,
 						className: "absolute right-2 top-1/2 -translate-y-1/2 text-text-secondary hover:text-text-primary",
-						children: h(a ? u : l, { className: "h-4 w-4" })
+						children: h(s ? u : l, { className: "h-4 w-4" })
 					}) : null]
 				}),
 				/* @__PURE__ */ g("button", {
 					type: "button",
-					onClick: s,
-					disabled: i,
+					onClick: d,
+					disabled: o || !n.trim(),
 					className: "inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg-hover disabled:opacity-50",
-					children: [i ? /* @__PURE__ */ h(f, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ h(p, { className: "h-4 w-4" }), "Save"]
+					children: [o ? /* @__PURE__ */ h(f, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ h(p, { className: "h-4 w-4" }), "Save"]
 				}),
 				/* @__PURE__ */ g("button", {
 					type: "button",
-					onClick: c,
-					disabled: i || !n,
+					onClick: _,
+					disabled: o || !n && !r,
 					className: "inline-flex items-center gap-1.5 rounded-md border border-border-default px-3 py-2 text-sm font-medium text-text-secondary hover:text-text-primary hover:border-border-strong disabled:opacity-50",
 					children: [/* @__PURE__ */ h(m, { className: "h-4 w-4" }), "Clear"]
 				})

package/dist/components/ai/AIProviderCredentialsCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"AIProviderCredentialsCard.js","names":[],"sources":["../../../src/components/ai/AIProviderCredentialsCard.tsx"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport {\n  ArrowLeft,\n  ChevronRight,\n  Eye,\n  EyeOff,\n  KeyRound,\n  Loader2,\n  Save,\n  Trash2,\n} from 'lucide-react';\n\nimport { useTr } from '../../shared/hooks/useTr';\nimport {\n  deleteAgentConfigValue,\n  getAgentConfigValue,\n  setAgentConfigValue,\n  type AgentRef,\n} from '@/services/aiApi';\n\n/**\n * One provider definition — what env-var-style keys the agent stores under\n * its config bag and what to call the provider in the UI. Kept as a flat\n * static list rather than discovered from the plugin manifest because the\n * config keys are part of the upstream SDK contract (ANTHROPIC_API_KEY,\n * OPENAI_API_KEY, etc.) and don't change with each plugin release.\n */\nexport interface AIProviderCredentialDef {\n  /** Stable provider id — usually matches the plugin's pluginName. */\n  providerId: string;\n  /** Display name shown in the card heading. */\n  label: string;\n  /** Short helper text under the heading. */\n  description: string;\n  /**\n   * One row per key. The `kind` distinguishes a primary credential (for\n   * which the SDK refuses to start without ONE of the listed keys) from\n   * an optional URL/host override.\n   */\n  fields: Array<{\n    /** Agent-config key name, also rendered as the input label. */\n    key: string;\n    /**\n     * Whether the field is a secret (rendered as password with eye toggle)\n     * or a plain string (URL / host overrides — visible by default).\n     */\n    secret?: boolean;\n    /**\n     * Whether saving this field alone (or any sibling field with\n     * primary=true) is enough to authenticate the provider. The card\n     * surfaces an \"at least one set\" indicator using this — used by the\n     * SDK-auth-missing modal to enable the Continue button as soon as\n     * either ANTHROPIC_API_KEY *or* ANTHROPIC_AUTH_TOKEN is saved.\n     *\n     * Defaults to `true` for secret fields and `false` for plain-text\n     * overrides (URLs/hosts). Set explicitly when a secret field is\n     * supplementary rather than authentication-conferring.\n     */\n    primary?: boolean;\n  }>;\n}\n\n/**\n * Catalog of every AI provider whose plugin reads credentials from the\n * agent's config bag (POST /api/config). CLI-only providers (Aider, Amp,\n * Copilot, Crush, Goose, Plandex, Pi) authenticate via their own harness\n * binary (~/.claude/, ~/.config/opencode/ etc.) — Bridle handles those\n * and they don't appear here.\n */\nexport const AI_PROVIDER_CREDENTIALS: AIProviderCredentialDef[] = [\n  {\n    providerId: 'claude',\n    label: 'Anthropic Claude',\n    description:\n      'Claude SDK sessions require either ANTHROPIC_API_KEY or ANTHROPIC_AUTH_TOKEN on the agent. Save one of them to make SDK sessions work.',\n    fields: [\n      { key: 'ANTHROPIC_API_KEY', secret: true },\n      { key: 'ANTHROPIC_AUTH_TOKEN', secret: true },\n    ],\n  },\n  {\n    providerId: 'codex',\n    label: 'OpenAI Codex',\n    description:\n      'Codex SDK / CLI sessions read OPENAI_API_KEY from the agent. Set it here to enable Codex-backed sessions.',\n    fields: [{ key: 'OPENAI_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'gemini',\n    label: 'Google Gemini',\n    description:\n      'Gemini SDK reads GEMINI_API_KEY (preferred) or GOOGLE_API_KEY. Either one works — both shown so an existing GOOGLE_API_KEY in your environment keeps working.',\n    fields: [\n      { key: 'GEMINI_API_KEY', secret: true },\n      { key: 'GOOGLE_API_KEY', secret: true },\n    ],\n  },\n  {\n    providerId: 'openai-compat',\n    label: 'OpenAI-Compatible',\n    description:\n      'Generic OpenAI-compatible provider (Together, Groq, Mistral, etc.). Set the API key and the base URL the SDK should hit.',\n    fields: [{ key: 'OPENAI_COMPAT_API_KEY', secret: true }, { key: 'OPENAI_COMPAT_BASE_URL' }],\n  },\n  {\n    providerId: 'cursor',\n    label: 'Cursor',\n    description:\n      'Cursor agent (CLI + SDK) reads CURSOR_API_KEY from the agent. Set it here to enable both modes.',\n    fields: [{ key: 'CURSOR_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'openrouter',\n    label: 'OpenRouter',\n    description: 'OpenRouter aggregator (300+ models, SDK only). Set OPENROUTER_API_KEY to enable.',\n    fields: [{ key: 'OPENROUTER_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'minimax',\n    label: 'Minimax',\n    description:\n      'Minimax provider (CLI + Anthropic-compatible SDK). Set MINIMAX_API_KEY to enable.',\n    fields: [{ key: 'MINIMAX_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'ollama',\n    label: 'Ollama',\n    description:\n      'Ollama Cloud + self-hosted (CLI + SDK). OLLAMA_API_KEY for Cloud; OLLAMA_HOST optional override (defaults: https://ollama.com when key present, http://localhost:11434 otherwise).',\n    fields: [{ key: 'OLLAMA_API_KEY', secret: true }, { key: 'OLLAMA_HOST' }],\n  },\n];\n\ninterface AIProviderCredentialsCardProps {\n  agent: AgentRef;\n  /**\n   * Optional filter — when present, only render providers whose providerId\n   * appears in the list. Lets a future caller scope the card to \"only the\n   * providers I have plugins installed for\" without changing the catalog.\n   */\n  providerIds?: string[];\n  /**\n   * When provided, the staged picker preselects this provider so the\n   * caller (e.g. the SDK-auth-missing modal) can drop the user straight\n   * onto the right form without an extra click.\n   */\n  initialProviderId?: string;\n  /**\n   * Fires whenever the currently-selected provider's saved-state changes\n   * on disk. `satisfied` is true when at least one primary (auth-conferring)\n   * field has a saved non-empty value. Used by the SDK-auth-missing modal\n   * to enable a Continue affordance the moment the user persists any\n   * acceptable credential, without forcing them to also fill the others.\n   */\n  onProviderAuthSatisfiedChange?: (satisfied: boolean) => void;\n}\n\n/**\n * Staged credentials manager: shows a provider picker first, then on\n * select renders one card with that provider's config keys plus a back\n * button. Keeps the rendered DOM small (and the surrounding modal\n * viewport-friendly) regardless of how many providers are in the catalog.\n *\n * Replaces the older Claude-only ClaudeCredentialsCard.\n */\nexport function AIProviderCredentialsCard({\n  agent,\n  providerIds,\n  initialProviderId,\n  onProviderAuthSatisfiedChange,\n}: AIProviderCredentialsCardProps) {\n  const tr = useTr();\n  const providers = providerIds\n    ? AI_PROVIDER_CREDENTIALS.filter((p) => providerIds.includes(p.providerId))\n    : AI_PROVIDER_CREDENTIALS;\n\n  // Preselect when the catalog narrows to exactly one provider so the\n  // single-provider case (e.g. claude-only filter) skips the picker.\n  const [selectedId, setSelectedId] = useState<string | null>(() => {\n    if (initialProviderId && providers.some((p) => p.providerId === initialProviderId)) {\n      return initialProviderId;\n    }\n    return providers.length === 1 ? (providers[0]?.providerId ?? null) : null;\n  });\n\n  const selected = providers.find((p) => p.providerId === selectedId) ?? null;\n\n  if (!selected) {\n    return (\n      <div className=\"space-y-3\">\n        <div className=\"flex items-start gap-3\">\n          <div className=\"rounded-lg bg-bg-sunken p-2 text-text-secondary\">\n            <KeyRound className=\"h-4 w-4\" />\n          </div>\n          <div className=\"space-y-1\">\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              {tr('ai.providerCredentials.pickTitle', 'Choose a provider')}\n            </h3>\n            <p className=\"text-sm text-text-secondary\">\n              {tr(\n                'ai.providerCredentials.pickDescription',\n                'Pick the provider whose credentials you want to manage. Keys are stored on the agent and read at session start.'\n              )}\n            </p>\n          </div>\n        </div>\n        <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-2\">\n          {providers.map((p) => (\n            <button\n              key={p.providerId}\n              type=\"button\"\n              onClick={() => setSelectedId(p.providerId)}\n              className=\"flex items-center justify-between gap-2 rounded-lg border border-border-default bg-bg-surface px-3 py-2 text-left hover:border-border-strong hover:bg-bg-sunken transition-colors\"\n            >\n              <div className=\"min-w-0\">\n                <div className=\"text-sm font-medium text-text-primary truncate\">{p.label}</div>\n                <div className=\"text-xs text-text-secondary truncate\">\n                  {p.fields.map((f) => f.key).join(', ')}\n                </div>\n              </div>\n              <ChevronRight className=\"h-4 w-4 flex-shrink-0 text-text-secondary\" />\n            </button>\n          ))}\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex items-center gap-2\">\n        {providers.length > 1 ? (\n          <button\n            type=\"button\"\n            onClick={() => setSelectedId(null)}\n            className=\"inline-flex items-center gap-1 rounded-md border border-border-default px-2 py-1 text-xs text-text-secondary hover:text-text-primary hover:border-border-strong\"\n            aria-label={tr('ai.providerCredentials.back', 'Back to providers')}\n          >\n            <ArrowLeft className=\"h-3.5 w-3.5\" />\n            {tr('ai.providerCredentials.back', 'Back')}\n          </button>\n        ) : null}\n        <div className=\"rounded-lg bg-bg-sunken p-2 text-text-secondary\">\n          <KeyRound className=\"h-4 w-4\" />\n        </div>\n        <div className=\"min-w-0\">\n          <h3 className=\"text-sm font-semibold text-text-primary truncate\">{selected.label}</h3>\n          <p className=\"text-xs text-text-secondary\">\n            {tr(\n              'ai.providerCredentials.scopedDescription',\n              'Keys are stored on the agent and read at session start.'\n            )}\n          </p>\n        </div>\n      </div>\n      <ProviderCard\n        agent={agent}\n        provider={selected}\n        onAuthSatisfiedChange={onProviderAuthSatisfiedChange}\n      />\n    </div>\n  );\n}\n\nfunction isPrimaryField(f: AIProviderCredentialDef['fields'][number]): boolean {\n  // Defaults: secret fields gate auth; URL/host overrides don't.\n  return f.primary ?? f.secret ?? false;\n}\n\nfunction ProviderCard({\n  agent,\n  provider,\n  onAuthSatisfiedChange,\n}: {\n  agent: AgentRef;\n  provider: AIProviderCredentialDef;\n  onAuthSatisfiedChange?: (satisfied: boolean) => void;\n}) {\n  const tr = useTr();\n  const [values, setValues] = useState<Record<string, string>>({});\n  // savedValues tracks what's actually on the agent (last successful\n  // load/persist), not the unsaved input buffer. This is what drives the\n  // \"auth satisfied\" indicator — typing an API key in the field doesn't\n  // count until the user hits Save.\n  const [savedValues, setSavedValues] = useState<Record<string, string>>({});\n  const [visible, setVisible] = useState<Record<string, boolean>>({});\n  const [loading, setLoading] = useState(true);\n  const [saving, setSaving] = useState<string | null>(null);\n  const [error, setError] = useState<string | null>(null);\n  const [success, setSuccess] = useState<string | null>(null);\n\n  const primaryKeys = provider.fields.filter(isPrimaryField).map((f) => f.key);\n  const satisfiedPrimaryKeys = primaryKeys.filter((k) => (savedValues[k] ?? '').trim().length > 0);\n  const authSatisfied = satisfiedPrimaryKeys.length > 0;\n\n  // Notify parent whenever satisfied flips. Effect (not inline call) so\n  // children don't render-during-render of the parent.\n  useEffect(() => {\n    onAuthSatisfiedChange?.(authSatisfied);\n  }, [authSatisfied, onAuthSatisfiedChange]);\n\n  const loadValues = useCallback(async () => {\n    setLoading(true);\n    setError(null);\n    try {\n      const entries = await Promise.all(\n        provider.fields.map(async (f) => [f.key, (await getAgentConfigValue(agent, f.key)) ?? ''])\n      );\n      const next = Object.fromEntries(entries);\n      setValues(next);\n      setSavedValues(next);\n    } catch (err) {\n      setError(\n        err instanceof Error\n          ? err.message\n          : tr('ai.providerCredentials.loadFailed', 'Failed to load provider credentials')\n      );\n    } finally {\n      setLoading(false);\n    }\n  }, [agent, provider.fields, tr]);\n\n  useEffect(() => {\n    void loadValues();\n  }, [loadValues]);\n\n  const persistValue = useCallback(\n    async (key: string, value: string) => {\n      setSaving(key);\n      setError(null);\n      setSuccess(null);\n      const trimmed = value.trim();\n      try {\n        if (trimmed) {\n          await setAgentConfigValue(agent, key, trimmed);\n        } else {\n          await deleteAgentConfigValue(agent, key);\n        }\n        // Mirror the persisted result into savedValues so the auth-\n        // satisfied banner / Continue button update immediately.\n        setSavedValues((cur) => ({ ...cur, [key]: trimmed }));\n        setSuccess(\n          trimmed\n            ? tr('ai.providerCredentials.saved', `${key} saved`)\n            : tr('ai.providerCredentials.cleared', `${key} cleared`)\n        );\n      } catch (err) {\n        setError(\n          err instanceof Error\n            ? err.message\n            : tr('ai.providerCredentials.saveFailed', 'Failed to save credential')\n        );\n      } finally {\n        setSaving(null);\n      }\n    },\n    [agent, tr]\n  );\n\n  return (\n    <div className=\"rounded-xl border border-border-default bg-bg-surface p-4 space-y-3\">\n      <div className=\"space-y-1\">\n        <h4 className=\"text-sm font-semibold text-text-primary\">{provider.label}</h4>\n        <p className=\"text-xs text-text-secondary\">{provider.description}</p>\n        {primaryKeys.length > 1 ? (\n          <p className=\"text-xs text-text-tertiary\">\n            {tr(\n              'ai.providerCredentials.eitherOr',\n              `Save any one of: ${primaryKeys.join(' · ')}. You don't need to fill all of them.`\n            )}\n          </p>\n        ) : null}\n      </div>\n\n      {/* Auth-satisfied banner — surfaces the moment any primary credential\n          is persisted on the agent. The SDK-auth-missing modal pairs this\n          with a Continue button so the user knows they can proceed. */}\n      {authSatisfied ? (\n        <div className=\"rounded-lg border border-status-success-border bg-status-success-bg px-3 py-2 text-xs text-status-success-text\">\n          {tr(\n            'ai.providerCredentials.authSatisfied',\n            `${provider.label} is ready. The agent will use ${satisfiedPrimaryKeys.join(' / ')} on the next SDK session.`\n          )}\n        </div>\n      ) : null}\n\n      {error ? (\n        <div className=\"rounded-lg border border-status-error-border bg-status-error-bg px-3 py-2 text-sm text-status-error-text\">\n          {error}\n        </div>\n      ) : null}\n      {success ? (\n        <div className=\"rounded-lg border border-status-success-border bg-status-success-bg px-3 py-2 text-sm text-status-success-text\">\n          {success}\n        </div>\n      ) : null}\n\n      {loading ? (\n        <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n          <Loader2 className=\"h-4 w-4 animate-spin\" />\n          {tr('ai.providerCredentials.loading', 'Loading…')}\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {provider.fields.map((f) => (\n            <CredentialField\n              key={f.key}\n              label={f.key}\n              secret={f.secret ?? false}\n              value={values[f.key] ?? ''}\n              onChange={(v) => setValues((cur) => ({ ...cur, [f.key]: v }))}\n              saving={saving === f.key}\n              visible={visible[f.key] ?? false}\n              onToggleVisible={() => setVisible((cur) => ({ ...cur, [f.key]: !cur[f.key] }))}\n              onSave={() => void persistValue(f.key, values[f.key] ?? '')}\n              onClear={() => void persistValue(f.key, '')}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\ninterface CredentialFieldProps {\n  label: string;\n  secret: boolean;\n  value: string;\n  onChange: (value: string) => void;\n  saving: boolean;\n  visible: boolean;\n  onToggleVisible: () => void;\n  onSave: () => void;\n  onClear: () => void;\n}\n\nfunction CredentialField({\n  label,\n  secret,\n  value,\n  onChange,\n  saving,\n  visible,\n  onToggleVisible,\n  onSave,\n  onClear,\n}: CredentialFieldProps) {\n  const showAsPassword = secret && !visible;\n  return (\n    <div className=\"space-y-2 rounded-lg border border-border-default bg-bg-primary p-3\">\n      <label className=\"block text-xs font-medium text-text-secondary\">{label}</label>\n      <div className=\"flex gap-2\">\n        <div className=\"relative flex-1\">\n          <input\n            type={showAsPassword ? 'password' : 'text'}\n            value={value}\n            onChange={(event) => onChange(event.target.value)}\n            autoComplete=\"off\"\n            spellCheck={false}\n            className=\"w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 pr-10 text-sm text-text-primary\"\n          />\n          {secret ? (\n            <button\n              type=\"button\"\n              onClick={onToggleVisible}\n              className=\"absolute right-2 top-1/2 -translate-y-1/2 text-text-secondary hover:text-text-primary\"\n            >\n              {visible ? <EyeOff className=\"h-4 w-4\" /> : <Eye className=\"h-4 w-4\" />}\n            </button>\n          ) : null}\n        </div>\n        <button\n          type=\"button\"\n          onClick={onSave}\n          disabled={saving}\n          className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg-hover disabled:opacity-50\"\n        >\n          {saving ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <Save className=\"h-4 w-4\" />}\n          Save\n        </button>\n        <button\n          type=\"button\"\n          onClick={onClear}\n          disabled={saving || !value}\n          className=\"inline-flex items-center gap-1.5 rounded-md border border-border-default px-3 py-2 text-sm font-medium text-text-secondary hover:text-text-primary hover:border-border-strong disabled:opacity-50\"\n        >\n          <Trash2 className=\"h-4 w-4\" />\n          Clear\n        </button>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"AIProviderCredentialsCard.js","names":[],"sources":["../../../src/components/ai/AIProviderCredentialsCard.tsx"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport {\n  ArrowLeft,\n  ChevronRight,\n  Eye,\n  EyeOff,\n  KeyRound,\n  Loader2,\n  Save,\n  Trash2,\n} from 'lucide-react';\n\nimport { useTr } from '../../shared/hooks/useTr';\nimport {\n  deleteAgentConfigValue,\n  getAgentConfigValue,\n  setAgentConfigValue,\n  type AgentRef,\n} from '@/services/aiApi';\n\n/**\n * One provider definition — what env-var-style keys the agent stores under\n * its config bag and what to call the provider in the UI. Kept as a flat\n * static list rather than discovered from the plugin manifest because the\n * config keys are part of the upstream SDK contract (ANTHROPIC_API_KEY,\n * OPENAI_API_KEY, etc.) and don't change with each plugin release.\n */\nexport interface AIProviderCredentialDef {\n  /** Stable provider id — usually matches the plugin's pluginName. */\n  providerId: string;\n  /** Display name shown in the card heading. */\n  label: string;\n  /** Short helper text under the heading. */\n  description: string;\n  /**\n   * One row per key. The `kind` distinguishes a primary credential (for\n   * which the SDK refuses to start without ONE of the listed keys) from\n   * an optional URL/host override.\n   */\n  fields: Array<{\n    /** Agent-config key name, also rendered as the input label. */\n    key: string;\n    /**\n     * Whether the field is a secret (rendered as password with eye toggle)\n     * or a plain string (URL / host overrides — visible by default).\n     */\n    secret?: boolean;\n    /**\n     * Whether saving this field alone (or any sibling field with\n     * primary=true) is enough to authenticate the provider. The card\n     * surfaces an \"at least one set\" indicator using this — used by the\n     * SDK-auth-missing modal to enable the Continue button as soon as\n     * either ANTHROPIC_API_KEY *or* ANTHROPIC_AUTH_TOKEN is saved.\n     *\n     * Defaults to `true` for secret fields and `false` for plain-text\n     * overrides (URLs/hosts). Set explicitly when a secret field is\n     * supplementary rather than authentication-conferring.\n     */\n    primary?: boolean;\n  }>;\n}\n\n/**\n * Catalog of every AI provider whose plugin reads credentials from the\n * agent's config bag (POST /api/config). CLI-only providers (Aider, Amp,\n * Copilot, Crush, Goose, Plandex, Pi) authenticate via their own harness\n * binary (~/.claude/, ~/.config/opencode/ etc.) — Bridle handles those\n * and they don't appear here.\n */\nexport const AI_PROVIDER_CREDENTIALS: AIProviderCredentialDef[] = [\n  {\n    providerId: 'claude',\n    label: 'Anthropic Claude',\n    description:\n      'Claude SDK sessions require either ANTHROPIC_API_KEY or ANTHROPIC_AUTH_TOKEN on the agent. Save one of them to make SDK sessions work.',\n    fields: [\n      { key: 'ANTHROPIC_API_KEY', secret: true },\n      { key: 'ANTHROPIC_AUTH_TOKEN', secret: true },\n    ],\n  },\n  {\n    providerId: 'codex',\n    label: 'OpenAI Codex',\n    description:\n      'Codex SDK / CLI sessions read OPENAI_API_KEY from the agent. Set it here to enable Codex-backed sessions.',\n    fields: [{ key: 'OPENAI_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'gemini',\n    label: 'Google Gemini',\n    description:\n      'Gemini SDK reads GEMINI_API_KEY (preferred) or GOOGLE_API_KEY. Either one works — both shown so an existing GOOGLE_API_KEY in your environment keeps working.',\n    fields: [\n      { key: 'GEMINI_API_KEY', secret: true },\n      { key: 'GOOGLE_API_KEY', secret: true },\n    ],\n  },\n  {\n    providerId: 'openai-compat',\n    label: 'OpenAI-Compatible',\n    description:\n      'Generic OpenAI-compatible provider (Together, Groq, Mistral, etc.). Set the API key and the base URL the SDK should hit.',\n    fields: [{ key: 'OPENAI_COMPAT_API_KEY', secret: true }, { key: 'OPENAI_COMPAT_BASE_URL' }],\n  },\n  {\n    providerId: 'cursor',\n    label: 'Cursor',\n    description:\n      'Cursor agent (CLI + SDK) reads CURSOR_API_KEY from the agent. Set it here to enable both modes.',\n    fields: [{ key: 'CURSOR_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'openrouter',\n    label: 'OpenRouter',\n    description: 'OpenRouter aggregator (300+ models, SDK only). Set OPENROUTER_API_KEY to enable.',\n    fields: [{ key: 'OPENROUTER_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'minimax',\n    label: 'Minimax',\n    description:\n      'Minimax provider (CLI + Anthropic-compatible SDK). Set MINIMAX_API_KEY to enable.',\n    fields: [{ key: 'MINIMAX_API_KEY', secret: true }],\n  },\n  {\n    providerId: 'ollama',\n    label: 'Ollama',\n    description:\n      'Ollama Cloud + self-hosted (CLI + SDK). OLLAMA_API_KEY for Cloud; OLLAMA_HOST optional override (defaults: https://ollama.com when key present, http://localhost:11434 otherwise).',\n    fields: [{ key: 'OLLAMA_API_KEY', secret: true }, { key: 'OLLAMA_HOST' }],\n  },\n];\n\ninterface AIProviderCredentialsCardProps {\n  agent: AgentRef;\n  /**\n   * Optional filter — when present, only render providers whose providerId\n   * appears in the list. Lets a future caller scope the card to \"only the\n   * providers I have plugins installed for\" without changing the catalog.\n   */\n  providerIds?: string[];\n  /**\n   * When provided, the staged picker preselects this provider so the\n   * caller (e.g. the SDK-auth-missing modal) can drop the user straight\n   * onto the right form without an extra click.\n   */\n  initialProviderId?: string;\n  /**\n   * Fires whenever the currently-selected provider's saved-state changes\n   * on disk. `satisfied` is true when at least one primary (auth-conferring)\n   * field has a saved non-empty value. Used by the SDK-auth-missing modal\n   * to enable a Continue affordance the moment the user persists any\n   * acceptable credential, without forcing them to also fill the others.\n   */\n  onProviderAuthSatisfiedChange?: (satisfied: boolean) => void;\n}\n\n/**\n * Staged credentials manager: shows a provider picker first, then on\n * select renders one card with that provider's config keys plus a back\n * button. Keeps the rendered DOM small (and the surrounding modal\n * viewport-friendly) regardless of how many providers are in the catalog.\n *\n * Replaces the older Claude-only ClaudeCredentialsCard.\n */\nexport function AIProviderCredentialsCard({\n  agent,\n  providerIds,\n  initialProviderId,\n  onProviderAuthSatisfiedChange,\n}: AIProviderCredentialsCardProps) {\n  const tr = useTr();\n  const providers = providerIds\n    ? AI_PROVIDER_CREDENTIALS.filter((p) => providerIds.includes(p.providerId))\n    : AI_PROVIDER_CREDENTIALS;\n\n  // Preselect when the catalog narrows to exactly one provider so the\n  // single-provider case (e.g. claude-only filter) skips the picker.\n  const [selectedId, setSelectedId] = useState<string | null>(() => {\n    if (initialProviderId && providers.some((p) => p.providerId === initialProviderId)) {\n      return initialProviderId;\n    }\n    return providers.length === 1 ? (providers[0]?.providerId ?? null) : null;\n  });\n\n  const selected = providers.find((p) => p.providerId === selectedId) ?? null;\n\n  if (!selected) {\n    return (\n      <div className=\"space-y-3\">\n        <div className=\"flex items-start gap-3\">\n          <div className=\"rounded-lg bg-bg-sunken p-2 text-text-secondary\">\n            <KeyRound className=\"h-4 w-4\" />\n          </div>\n          <div className=\"space-y-1\">\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              {tr('ai.providerCredentials.pickTitle', 'Choose a provider')}\n            </h3>\n            <p className=\"text-sm text-text-secondary\">\n              {tr(\n                'ai.providerCredentials.pickDescription',\n                'Pick the provider whose credentials you want to manage. Keys are stored on the agent and read at session start.'\n              )}\n            </p>\n          </div>\n        </div>\n        <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-2\">\n          {providers.map((p) => (\n            <button\n              key={p.providerId}\n              type=\"button\"\n              onClick={() => setSelectedId(p.providerId)}\n              className=\"flex items-center justify-between gap-2 rounded-lg border border-border-default bg-bg-surface px-3 py-2 text-left hover:border-border-strong hover:bg-bg-sunken transition-colors\"\n            >\n              <div className=\"min-w-0\">\n                <div className=\"text-sm font-medium text-text-primary truncate\">{p.label}</div>\n                <div className=\"text-xs text-text-secondary truncate\">\n                  {p.fields.map((f) => f.key).join(', ')}\n                </div>\n              </div>\n              <ChevronRight className=\"h-4 w-4 flex-shrink-0 text-text-secondary\" />\n            </button>\n          ))}\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex items-center gap-2\">\n        {providers.length > 1 ? (\n          <button\n            type=\"button\"\n            onClick={() => setSelectedId(null)}\n            className=\"inline-flex items-center gap-1 rounded-md border border-border-default px-2 py-1 text-xs text-text-secondary hover:text-text-primary hover:border-border-strong\"\n            aria-label={tr('ai.providerCredentials.back', 'Back to providers')}\n          >\n            <ArrowLeft className=\"h-3.5 w-3.5\" />\n            {tr('ai.providerCredentials.back', 'Back')}\n          </button>\n        ) : null}\n        <div className=\"rounded-lg bg-bg-sunken p-2 text-text-secondary\">\n          <KeyRound className=\"h-4 w-4\" />\n        </div>\n        <div className=\"min-w-0\">\n          <h3 className=\"text-sm font-semibold text-text-primary truncate\">{selected.label}</h3>\n          <p className=\"text-xs text-text-secondary\">\n            {tr(\n              'ai.providerCredentials.scopedDescription',\n              'Keys are stored on the agent and read at session start.'\n            )}\n          </p>\n        </div>\n      </div>\n      <ProviderCard\n        agent={agent}\n        provider={selected}\n        onAuthSatisfiedChange={onProviderAuthSatisfiedChange}\n      />\n    </div>\n  );\n}\n\nfunction isPrimaryField(f: AIProviderCredentialDef['fields'][number]): boolean {\n  // Defaults: secret fields gate auth; URL/host overrides don't.\n  return f.primary ?? f.secret ?? false;\n}\n\nfunction ProviderCard({\n  agent,\n  provider,\n  onAuthSatisfiedChange,\n}: {\n  agent: AgentRef;\n  provider: AIProviderCredentialDef;\n  onAuthSatisfiedChange?: (satisfied: boolean) => void;\n}) {\n  const tr = useTr();\n  const [values, setValues] = useState<Record<string, string>>({});\n  // savedValues tracks what's actually on the agent (last successful\n  // load/persist), not the unsaved input buffer. This is what drives the\n  // \"auth satisfied\" indicator — typing an API key in the field doesn't\n  // count until the user hits Save.\n  const [savedValues, setSavedValues] = useState<Record<string, string>>({});\n  const [visible, setVisible] = useState<Record<string, boolean>>({});\n  const [loading, setLoading] = useState(true);\n  const [saving, setSaving] = useState<string | null>(null);\n  const [error, setError] = useState<string | null>(null);\n  const [success, setSuccess] = useState<string | null>(null);\n\n  const primaryKeys = provider.fields.filter(isPrimaryField).map((f) => f.key);\n  const satisfiedPrimaryKeys = primaryKeys.filter((k) => (savedValues[k] ?? '').trim().length > 0);\n  const authSatisfied = satisfiedPrimaryKeys.length > 0;\n\n  // Notify parent whenever satisfied flips. Effect (not inline call) so\n  // children don't render-during-render of the parent.\n  useEffect(() => {\n    onAuthSatisfiedChange?.(authSatisfied);\n  }, [authSatisfied, onAuthSatisfiedChange]);\n\n  const loadValues = useCallback(async () => {\n    setLoading(true);\n    setError(null);\n    try {\n      const entries = await Promise.all(\n        provider.fields.map(async (f) => [f.key, (await getAgentConfigValue(agent, f.key)) ?? ''])\n      );\n      const next = Object.fromEntries(entries);\n      // Don't seed inputs with masked secrets (\"[redacted]\") — Save would re-persist the mask. Non-secret fields (URLs/hosts) return real values, so keep those editable.\n      setValues(\n        Object.fromEntries(\n          provider.fields.filter((f) => !f.secret).map((f) => [f.key, next[f.key] ?? ''])\n        )\n      );\n      setSavedValues(next);\n    } catch (err) {\n      setError(\n        err instanceof Error\n          ? err.message\n          : tr('ai.providerCredentials.loadFailed', 'Failed to load provider credentials')\n      );\n    } finally {\n      setLoading(false);\n    }\n  }, [agent, provider.fields, tr]);\n\n  useEffect(() => {\n    void loadValues();\n  }, [loadValues]);\n\n  const persistValue = useCallback(\n    async (key: string, value: string) => {\n      setSaving(key);\n      setError(null);\n      setSuccess(null);\n      const trimmed = value.trim();\n      try {\n        if (trimmed) {\n          await setAgentConfigValue(agent, key, trimmed);\n        } else {\n          await deleteAgentConfigValue(agent, key);\n        }\n        // Mirror the persisted result into savedValues so the auth-\n        // satisfied banner / Continue button update immediately.\n        setSavedValues((cur) => ({ ...cur, [key]: trimmed }));\n        setSuccess(\n          trimmed\n            ? tr('ai.providerCredentials.saved', `${key} saved`)\n            : tr('ai.providerCredentials.cleared', `${key} cleared`)\n        );\n      } catch (err) {\n        setError(\n          err instanceof Error\n            ? err.message\n            : tr('ai.providerCredentials.saveFailed', 'Failed to save credential')\n        );\n      } finally {\n        setSaving(null);\n      }\n    },\n    [agent, tr]\n  );\n\n  return (\n    <div className=\"rounded-xl border border-border-default bg-bg-surface p-4 space-y-3\">\n      <div className=\"space-y-1\">\n        <h4 className=\"text-sm font-semibold text-text-primary\">{provider.label}</h4>\n        <p className=\"text-xs text-text-secondary\">{provider.description}</p>\n        {primaryKeys.length > 1 ? (\n          <p className=\"text-xs text-text-tertiary\">\n            {tr(\n              'ai.providerCredentials.eitherOr',\n              `Save any one of: ${primaryKeys.join(' · ')}. You don't need to fill all of them.`\n            )}\n          </p>\n        ) : null}\n      </div>\n\n      {/* Auth-satisfied banner — surfaces the moment any primary credential\n          is persisted on the agent. The SDK-auth-missing modal pairs this\n          with a Continue button so the user knows they can proceed. */}\n      {authSatisfied ? (\n        <div className=\"rounded-lg border border-status-success-border bg-status-success-bg px-3 py-2 text-xs text-status-success-text\">\n          {tr(\n            'ai.providerCredentials.authSatisfied',\n            `${provider.label} is ready. The agent will use ${satisfiedPrimaryKeys.join(' / ')} on the next SDK session.`\n          )}\n        </div>\n      ) : null}\n\n      {error ? (\n        <div className=\"rounded-lg border border-status-error-border bg-status-error-bg px-3 py-2 text-sm text-status-error-text\">\n          {error}\n        </div>\n      ) : null}\n      {success ? (\n        <div className=\"rounded-lg border border-status-success-border bg-status-success-bg px-3 py-2 text-sm text-status-success-text\">\n          {success}\n        </div>\n      ) : null}\n\n      {loading ? (\n        <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n          <Loader2 className=\"h-4 w-4 animate-spin\" />\n          {tr('ai.providerCredentials.loading', 'Loading…')}\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {provider.fields.map((f) => {\n            const isSecret = f.secret ?? false;\n            const isSaved = Boolean((savedValues[f.key] ?? '').trim());\n            return (\n              <CredentialField\n                key={f.key}\n                label={f.key}\n                secret={isSecret}\n                value={values[f.key] ?? ''}\n                saved={isSaved}\n                placeholder={\n                  isSaved\n                    ? isSecret\n                      ? tr(\n                          'ai.providerCredentials.storedSecretPlaceholder',\n                          '•••••••• stored — enter a new value to replace'\n                        )\n                      : tr(\n                          'ai.providerCredentials.storedPlaceholder',\n                          'stored — enter a new value to replace'\n                        )\n                    : ''\n                }\n                onChange={(v) => setValues((cur) => ({ ...cur, [f.key]: v }))}\n                saving={saving === f.key}\n                visible={visible[f.key] ?? false}\n                onToggleVisible={() => setVisible((cur) => ({ ...cur, [f.key]: !cur[f.key] }))}\n                onSave={() => void persistValue(f.key, values[f.key] ?? '')}\n                onClear={() => void persistValue(f.key, '')}\n              />\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n}\n\ninterface CredentialFieldProps {\n  label: string;\n  secret: boolean;\n  value: string;\n  /** True when a value is already stored on the agent (read back masked). */\n  saved: boolean;\n  /** Resolved (i18n) placeholder shown when the input is empty but a value is stored. */\n  placeholder: string;\n  onChange: (value: string) => void;\n  saving: boolean;\n  visible: boolean;\n  onToggleVisible: () => void;\n  onSave: () => void;\n  onClear: () => void;\n}\n\nfunction CredentialField({\n  label,\n  secret,\n  value,\n  saved,\n  placeholder,\n  onChange,\n  saving,\n  visible,\n  onToggleVisible,\n  onSave,\n  onClear,\n}: CredentialFieldProps) {\n  const showAsPassword = secret && !visible;\n  return (\n    <div className=\"space-y-2 rounded-lg border border-border-default bg-bg-primary p-3\">\n      <label className=\"block text-xs font-medium text-text-secondary\">{label}</label>\n      <div className=\"flex gap-2\">\n        <div className=\"relative flex-1\">\n          <input\n            type={showAsPassword ? 'password' : 'text'}\n            value={value}\n            onChange={(event) => onChange(event.target.value)}\n            autoComplete=\"off\"\n            spellCheck={false}\n            placeholder={placeholder}\n            className=\"w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 pr-10 text-sm text-text-primary\"\n          />\n          {secret ? (\n            <button\n              type=\"button\"\n              onClick={onToggleVisible}\n              className=\"absolute right-2 top-1/2 -translate-y-1/2 text-text-secondary hover:text-text-primary\"\n            >\n              {visible ? <EyeOff className=\"h-4 w-4\" /> : <Eye className=\"h-4 w-4\" />}\n            </button>\n          ) : null}\n        </div>\n        <button\n          type=\"button\"\n          onClick={onSave}\n          disabled={saving || !value.trim()}\n          className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg-hover disabled:opacity-50\"\n        >\n          {saving ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <Save className=\"h-4 w-4\" />}\n          Save\n        </button>\n        <button\n          type=\"button\"\n          onClick={onClear}\n          disabled={saving || (!value && !saved)}\n          className=\"inline-flex items-center gap-1.5 rounded-md border border-border-default px-3 py-2 text-sm font-medium text-text-secondary hover:text-text-primary hover:border-border-strong disabled:opacity-50\"\n        >\n          <Trash2 className=\"h-4 w-4\" />\n          Clear\n        </button>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}