@openhands/agent-canvas 1.1.0 → 1.2.1

package/dist/components/features/analytics/telemetry-consent-banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"telemetry-consent-banner.js","names":[],"sources":["../../../../src/components/features/analytics/telemetry-consent-banner.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useTelemetry } from \"#/hooks/use-telemetry\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ModalBackdrop } from \"#/components/shared/modals/modal-backdrop\";\nimport { ModalBody } from \"#/components/shared/modals/modal-body\";\nimport {\n  BaseModalTitle,\n  BaseModalDescription,\n} from \"#/components/shared/modals/confirmation-modals/base-modal\";\nimport { BrandButton } from \"#/components/features/settings/brand-button\";\n\ninterface TelemetryConsentBannerProps {\n  /** Called after user makes a choice */\n  onChoice?: (granted: boolean) => void;\n}\n\n/**\n * A consent modal for telemetry/analytics that appears on first use.\n *\n * This component:\n * - Shows as a full-screen modal overlay when consent is pending\n * - Waits for translations to load before displaying (prevents key flashing)\n * - Allows users to accept or decline tracking via checkbox\n * - Respects DO_NOT_TRACK environment variable\n * - Persists choice in localStorage\n * - Styled to match the OpenHands analytics consent modal\n *\n * @example\n * ```tsx\n * function App() {\n *   return (\n *     <>\n *       <TelemetryConsentBanner />\n *       <MainContent />\n *     </>\n *   );\n * }\n * ```\n */\nexport function TelemetryConsentBanner({\n  onChoice,\n}: TelemetryConsentBannerProps) {\n  const { t, ready } = useTranslation(\"openhands\");\n  const { showConsentPrompt, grantConsent, denyConsent } = useTelemetry();\n\n  // Delay showing the modal slightly to ensure smooth rendering\n  // This prevents the modal from flashing during initial hydration\n  const [isReady, setIsReady] = useState(false);\n  useEffect(() => {\n    if (ready && showConsentPrompt) {\n      // Small delay to ensure DOM is fully hydrated and translations loaded\n      const timer = setTimeout(() => setIsReady(true), 50);\n      return () => clearTimeout(timer);\n    }\n    setIsReady(false);\n    return undefined;\n  }, [ready, showConsentPrompt]);\n\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    const formData = new FormData(e.currentTarget);\n    const analytics = formData.get(\"analytics\") === \"on\";\n\n    if (analytics) {\n      grantConsent();\n    } else {\n      denyConsent();\n    }\n    onChoice?.(analytics);\n  };\n\n  // Don't render until translations are ready and component has stabilized\n  if (!isReady) {\n    return null;\n  }\n\n  return (\n    <ModalBackdrop aria-label={t(I18nKey.TELEMETRY$CONSENT_TITLE)}>\n      <form\n        data-testid=\"telemetry-consent-form\"\n        onSubmit={handleSubmit}\n        className=\"flex flex-col gap-2\"\n      >\n        <ModalBody className=\"border border-[var(--oh-border)]\">\n          <BaseModalTitle title={t(I18nKey.TELEMETRY$CONSENT_TITLE)} />\n          <BaseModalDescription>\n            {t(I18nKey.TELEMETRY$CONSENT_DESCRIPTION)}\n          </BaseModalDescription>\n\n          <label className=\"flex gap-2 items-center self-start text-sm cursor-pointer\">\n            <input\n              name=\"analytics\"\n              type=\"checkbox\"\n              defaultChecked\n              className=\"w-4 h-4 cursor-pointer\"\n            />\n            {t(I18nKey.TELEMETRY$SEND_ANONYMOUS_DATA)}\n          </label>\n\n          <BrandButton\n            testId=\"confirm-telemetry-preferences\"\n            type=\"submit\"\n            variant=\"primary\"\n            className=\"w-full\"\n          >\n            {t(I18nKey.TELEMETRY$CONFIRM_PREFERENCES)}\n          </BrandButton>\n        </ModalBody>\n      </form>\n    </ModalBackdrop>\n  );\n}\n"],"mappings":";;;;;;;;;;AAwCA,SAAgB,EAAuB,EACrC,eAC8B;CAC9B,IAAM,EAAE,MAAG,aAAU,EAAe,YAAY,EAC1C,EAAE,sBAAmB,iBAAc,mBAAgB,GAAc,EAIjE,CAAC,GAAS,KAAc,EAAS,GAAM;AA6B7C,QA5BA,QAAgB;AACd,MAAI,KAAS,GAAmB;GAE9B,IAAM,IAAQ,iBAAiB,EAAW,GAAK,EAAE,GAAG;AACpD,gBAAa,aAAa,EAAM;;AAElC,IAAW,GAAM;IAEhB,CAAC,GAAO,EAAkB,CAAC,EAgBzB,IAKH,kBAAC,GAAD;EAAe,cAAY,EAAE,EAAQ,wBAAwB;YAC3D,kBAAC,QAAD;GACE,eAAY;GACZ,WAtBgB,MAAwC;AAC5D,MAAE,gBAAgB;IAElB,IAAM,IAAY,IADG,SAAS,EAAE,cACd,CAAS,IAAI,YAAY,KAAK;AAOhD,IALI,IACF,GAAc,GAEd,GAAa,EAEf,IAAW,EAAU;;GAajB,WAAU;aAEV,kBAAC,GAAD;IAAW,WAAU;cAArB;KACE,kBAAC,GAAD,EAAgB,OAAO,EAAE,EAAQ,wBAAwB,EAAI,CAAA;KAC7D,kBAAC,GAAD,EAAA,UACG,EAAE,EAAQ,8BAA8B,EACpB,CAAA;KAEvB,kBAAC,SAAD;MAAO,WAAU;gBAAjB,CACE,kBAAC,SAAD;OACE,MAAK;OACL,MAAK;OACL,gBAAA;OACA,WAAU;OACV,CAAA,EACD,EAAE,EAAQ,8BAA8B,CACnC;;KAER,kBAAC,GAAD;MACE,QAAO;MACP,MAAK;MACL,SAAQ;MACR,WAAU;gBAET,EAAE,EAAQ,8BAA8B;MAC7B,CAAA;KACJ;;GACP,CAAA;EACO,CAAA,GApCT"}
+{"version":3,"file":"telemetry-consent-banner.js","names":[],"sources":["../../../../src/components/features/analytics/telemetry-consent-banner.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useTelemetry } from \"#/hooks/use-telemetry\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ModalBackdrop } from \"#/components/shared/modals/modal-backdrop\";\nimport { ModalBody } from \"#/components/shared/modals/modal-body\";\nimport {\n  BaseModalTitle,\n  BaseModalDescription,\n} from \"#/components/shared/modals/confirmation-modals/base-modal\";\nimport { BrandButton } from \"#/components/features/settings/brand-button\";\n\ninterface TelemetryConsentBannerProps {\n  /** Called after user makes a choice */\n  onChoice?: (granted: boolean) => void;\n}\n\n/**\n * A consent modal for telemetry/analytics that appears on first use.\n *\n * This component:\n * - Shows as a full-screen modal overlay when consent is pending\n * - Waits for translations to load before displaying (prevents key flashing)\n * - Allows users to accept or decline tracking via checkbox\n * - Respects DO_NOT_TRACK environment variable\n * - Persists choice in localStorage\n * - Styled to match the OpenHands analytics consent modal\n *\n * @example\n * ```tsx\n * function App() {\n *   return (\n *     <>\n *       <TelemetryConsentBanner />\n *       <MainContent />\n *     </>\n *   );\n * }\n * ```\n */\nexport function TelemetryConsentBanner({\n  onChoice,\n}: TelemetryConsentBannerProps) {\n  const { t, ready } = useTranslation(\"openhands\");\n  const { showConsentPrompt, grantConsent, denyConsent } = useTelemetry();\n\n  // Delay showing the modal slightly to ensure smooth rendering\n  // This prevents the modal from flashing during initial hydration\n  const [isReady, setIsReady] = useState(false);\n  useEffect(() => {\n    if (ready && showConsentPrompt) {\n      // Small delay to ensure DOM is fully hydrated and translations loaded\n      const timer = setTimeout(() => setIsReady(true), 50);\n      return () => clearTimeout(timer);\n    }\n    setIsReady(false);\n    return undefined;\n  }, [ready, showConsentPrompt]);\n\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    const formData = new FormData(e.currentTarget);\n    const analytics = formData.get(\"analytics\") === \"on\";\n\n    if (analytics) {\n      grantConsent();\n    } else {\n      denyConsent();\n    }\n    onChoice?.(analytics);\n  };\n\n  // Don't render until translations are ready and component has stabilized\n  if (!isReady) {\n    return null;\n  }\n\n  return (\n    <ModalBackdrop elevated aria-label={t(I18nKey.TELEMETRY$CONSENT_TITLE)}>\n      <form\n        data-testid=\"telemetry-consent-form\"\n        onSubmit={handleSubmit}\n        className=\"flex flex-col gap-2\"\n      >\n        <ModalBody className=\"border border-[var(--oh-border)]\">\n          <BaseModalTitle title={t(I18nKey.TELEMETRY$CONSENT_TITLE)} />\n          <BaseModalDescription>\n            {t(I18nKey.TELEMETRY$CONSENT_DESCRIPTION)}\n          </BaseModalDescription>\n\n          <label className=\"flex gap-2 items-center self-start text-sm cursor-pointer\">\n            <input\n              name=\"analytics\"\n              type=\"checkbox\"\n              defaultChecked\n              className=\"w-4 h-4 cursor-pointer\"\n            />\n            {t(I18nKey.TELEMETRY$SEND_ANONYMOUS_DATA)}\n          </label>\n\n          <BrandButton\n            testId=\"confirm-telemetry-preferences\"\n            type=\"submit\"\n            variant=\"primary\"\n            className=\"w-full\"\n          >\n            {t(I18nKey.TELEMETRY$CONFIRM_PREFERENCES)}\n          </BrandButton>\n        </ModalBody>\n      </form>\n    </ModalBackdrop>\n  );\n}\n"],"mappings":";;;;;;;;;;AAwCA,SAAgB,EAAuB,EACrC,eAC8B;CAC9B,IAAM,EAAE,MAAG,aAAU,EAAe,YAAY,EAC1C,EAAE,sBAAmB,iBAAc,mBAAgB,GAAc,EAIjE,CAAC,GAAS,KAAc,EAAS,GAAM;AA6B7C,QA5BA,QAAgB;AACd,MAAI,KAAS,GAAmB;GAE9B,IAAM,IAAQ,iBAAiB,EAAW,GAAK,EAAE,GAAG;AACpD,gBAAa,aAAa,EAAM;;AAElC,IAAW,GAAM;IAEhB,CAAC,GAAO,EAAkB,CAAC,EAgBzB,IAKH,kBAAC,GAAD;EAAe,UAAA;EAAS,cAAY,EAAE,EAAQ,wBAAwB;YACpE,kBAAC,QAAD;GACE,eAAY;GACZ,WAtBgB,MAAwC;AAC5D,MAAE,gBAAgB;IAElB,IAAM,IAAY,IADG,SAAS,EAAE,cACd,CAAS,IAAI,YAAY,KAAK;AAOhD,IALI,IACF,GAAc,GAEd,GAAa,EAEf,IAAW,EAAU;;GAajB,WAAU;aAEV,kBAAC,GAAD;IAAW,WAAU;cAArB;KACE,kBAAC,GAAD,EAAgB,OAAO,EAAE,EAAQ,wBAAwB,EAAI,CAAA;KAC7D,kBAAC,GAAD,EAAA,UACG,EAAE,EAAQ,8BAA8B,EACpB,CAAA;KAEvB,kBAAC,SAAD;MAAO,WAAU;gBAAjB,CACE,kBAAC,SAAD;OACE,MAAK;OACL,MAAK;OACL,gBAAA;OACA,WAAU;OACV,CAAA,EACD,EAAE,EAAQ,8BAA8B,CACnC;;KAER,kBAAC,GAAD;MACE,QAAO;MACP,MAAK;MACL,SAAQ;MACR,WAAU;gBAET,EAAE,EAAQ,8BAA8B;MAC7B,CAAA;KACJ;;GACP,CAAA;EACO,CAAA,GApCT"}

package/dist/components/features/automations/detail/activity-log-item.d.ts

@@ -1,6 +1,7 @@
-import { type AutomationRun } from "#/types/automation";
+import { type Automation, type AutomationRun } from "#/types/automation";
 interface ActivityLogItemProps {
     run: AutomationRun;
+    automation?: Automation;
 }
-export declare function ActivityLogItem({ run }: ActivityLogItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function ActivityLogItem({ run, automation }: ActivityLogItemProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/features/automations/detail/activity-log-section.d.ts

@@ -1,5 +1,6 @@
+import type { Automation } from "#/types/automation";
 interface ActivityLogSectionProps {
-    automationId: string;
+    automation: Automation;
 }
-export declare function ActivityLogSection({ automationId }: ActivityLogSectionProps): import("react/jsx-runtime").JSX.Element;
+export declare function ActivityLogSection({ automation }: ActivityLogSectionProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/features/automations/detail/debug-automation-button.d.ts

@@ -0,0 +1,17 @@
+import type { Automation, AutomationRun } from "#/types/automation";
+interface DebugAutomationButtonProps {
+    /** The failed run being debugged. */
+    run: AutomationRun;
+    /** The parent automation, used to add context to the debug prompt. */
+    automation?: Automation;
+    /** The run's stderr, already computed by the enclosing logs modal. */
+    stderr: string;
+}
+/**
+ * Starts a new OpenHands conversation seeded with the failed run's error
+ * details so the agent begins debugging immediately. Kept as its own component
+ * (rather than inlined into the logs modal) so `useCreateConversation` — which
+ * requires a QueryClientProvider — only mounts for failed runs.
+ */
+export declare function DebugAutomationButton({ run, automation, stderr, }: DebugAutomationButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/automations/detail/run-logs-modal.d.ts

@@ -1,3 +1,4 @@
+import { type Automation, type AutomationRun } from "#/types/automation";
 interface RunLogsModalProps {
     /** Conversation that owns the bash command. */
     conversationId: string | null;
@@ -5,6 +6,10 @@ interface RunLogsModalProps {
     bashCommandId: string | null;
     isOpen: boolean;
     onClose: () => void;
+    /** The run these logs belong to; enables the debug action for failed runs. */
+    run?: AutomationRun;
+    /** The parent automation, used to add context to the debug prompt. */
+    automation?: Automation;
 }
-export declare function RunLogsModal({ conversationId, bashCommandId, isOpen, onClose, }: RunLogsModalProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function RunLogsModal({ conversationId, bashCommandId, isOpen, onClose, run, automation, }: RunLogsModalProps): import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/features/backends/backend-form-modal.cjs

@@ -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(`../../../utils/utils.cjs`),i=require(`../../../context/navigation-context.cjs`),a=require(`../../../node_modules/@openhands/typescript-client/dist/client/server-client.cjs`),o=require(`../../../api/agent-server-config.cjs`),s=require(`../../../api/agent-server-client-options.cjs`),c=require(`../../../api/agent-server-compatibility.cjs`),l=require(`../../../utils/user-facing-error.cjs`),u=require(`../../../node_modules/@tanstack/react-query/build/modern/useQuery.cjs`),d=require(`../../../contexts/active-backend-context.cjs`),f=require(`../../shared/modals/modal-backdrop.cjs`),p=require(`../../shared/modals/modal-body.cjs`),m=require(`../../../utils/modal-classes.cjs`),h=require(`../../shared/modals/modal-close-button.cjs`),g=require(`../settings/brand-button.cjs`),_=require(`../settings/settings-input.cjs`),v=require(`../../../hooks/query/use-backends-health.cjs`),y=require(`../../../assets/branding/openhands-logo-white.cjs`),b=require(`../../../icons/chevron-down-small.cjs`),x=require(`./backend-status-label.cjs`),S=require(`./backend-status-dot.cjs`),C=require(`./device-flow-auth.cjs`);let w=require(`react`);w=e.__toESM(w,1);let T=require(`react/jsx-runtime`);function E(e){let t=e.trim().toLowerCase();return t.includes(`all-hands.dev`)||t.includes(`openhands.dev`)?`cloud`:`local`}function D(e){let t=e.toLowerCase().replace(/^\[|\]$/g,``);return!!(t===`localhost`||t===`::1`||t===`::`||t===`0.0.0.0`||/^127\./.test(t)||/^::ffff:127\./i.test(t)||/^10\./.test(t)||/^192\.168\./.test(t)||/^172\.(1[6-9]|2\d|3[01])\./.test(t)||/^fe[89ab][0-9a-f]:/i.test(t)||/^f[cd][0-9a-f]{2}:/i.test(t)||t.endsWith(`.local`)||!t.includes(`.`)&&!t.includes(`:`))}function O(e){let t=e.trim().replace(/\/+$/,``);if(!t)return``;if(/^https?:\/\//i.test(t))return t;let n=t.match(/^\[([^\]]+)\]/);return`${D(n?n[1]:(t.match(/:/g)??[]).length>1?t:t.split(`:`)[0])?`http`:`https`}://${t}`}function k(e){let t=e.trim();if(!t||/\s/.test(t))return!1;let n=O(t);if(!n)return!1;try{let e=new URL(n);return(e.protocol===`http:`||e.protocol===`https:`)&&e.hostname.length>0}catch{return!1}}var A=`https://app.all-hands.dev`;function j(e,t){return e(n.I18nKey.BACKEND$CONNECTION_TEST_FAILED,{host:t,interpolation:{escapeValue:!1}})}function M(e){return l.getUserFacingConnectionErrorMessage(e)}function N(e,t){let n=M(t);return n?`${e}\n${n}`:e}async function P(e){e.kind===`local`&&c.assertAgentServerVersionIsSupported(await new a.ServerClient(s.getAgentServerClientOptions({host:e.host,sessionApiKey:e.apiKey||null,timeout:5e3})).getServerInfo())}function F({backend:e,testIdRoot:r}){let{t:i}=t.useTranslation(`openhands`),o=v.useBackendsHealth([e])[e.id],l=o?.isConnected??null,d=o?.disabled===!0,f=o?.consecutiveFailures??0,p=o?.lastError??null,{data:m}=u.useQuery({queryKey:[`backend-version`,e.host,e.apiKey],queryFn:async()=>c.getDisplayAgentServerVersion(await new a.ServerClient(s.getAgentServerClientOptions({host:e.host,sessionApiKey:e.apiKey||null,timeout:5e3})).getServerInfo()),retry:!1,staleTime:6e4,enabled:e.kind===`local`&&!d}),h=x.getBackendStatusLabel(i,e,o),g=e.kind===`cloud`?i(n.I18nKey.BACKEND$KIND_CLOUD):i(n.I18nKey.BACKEND$KIND_LOCAL);return(0,T.jsxs)(`div`,{className:`flex flex-col gap-2`,children:[(0,T.jsxs)(`div`,{"data-testid":`${r}-status`,className:`flex items-center gap-3 text-sm`,children:[(0,T.jsx)(S.BackendStatusDot,{isConnected:l}),(0,T.jsx)(`span`,{className:`text-white`,"data-testid":`${r}-status-label`,children:h}),(0,T.jsx)(`span`,{className:`text-tertiary-alt`,children:`·`}),(0,T.jsx)(`span`,{className:`text-[var(--oh-text-tertiary)]`,children:g}),m?(0,T.jsx)(`span`,{className:`text-xs text-[var(--oh-muted)]`,"data-testid":`${r}-version`,children:i(n.I18nKey.BACKEND$VERSION_LABEL,{version:m})}):null]}),d?(0,T.jsxs)(`div`,{"data-testid":`${r}-status-error`,className:`flex flex-col gap-1 rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm`,children:[(0,T.jsx)(`span`,{className:`font-semibold text-red-300`,children:i(n.I18nKey.BACKEND$HEALTH_FAILED_TITLE)}),(0,T.jsx)(`span`,{className:`text-xs text-[var(--oh-text-tertiary)]`,children:i(n.I18nKey.BACKEND$HEALTH_FAILED_DETAIL,{count:f})}),p?(0,T.jsx)(`span`,{"data-testid":`${r}-status-error-message`,className:`text-xs text-red-300 whitespace-pre-wrap break-words`,children:p}):null]}):null]})}function I({initialName:e=``,initialHost:n=``,initialApiKey:r=``,onTestConnection:i,onSuccess:a,requireApiKey:o=!1,onSubmitOverride:s}){let{t:c}=t.useTranslation(`openhands`),[l,u]=w.default.useState(e),[d,f]=w.default.useState(n),[p,m]=w.default.useState(r),[h,g]=w.default.useState(null),[_,v]=w.default.useState(!1),y=E(d),b=o||y!==`local`,x=l.trim().length>0&&k(d)&&(!b||p.trim().length>0);return{name:l,setName:u,host:d,setHost:f,apiKey:p,setApiKey:m,connectionError:h,setConnectionError:g,isSubmitting:_,kind:y,canSubmit:x,handleSubmit:w.default.useCallback(async e=>{if(e.preventDefault(),!x||_)return;let t={name:l.trim(),host:O(d),apiKey:p.trim(),kind:y};g(null),v(!0);try{s?await s(t):(await i(t),a())}catch(e){g(N(j(c,t.host),e))}finally{v(!1)}},[x,_,l,d,p,y,i,a,o,s,c])}}function L({mode:e,backend:i,onSubmitted:a,renderActions:o,testIdRoot:s,hostReadOnly:c,requireApiKey:l,hideConfigurationFields:u=!1,onSubmitOverride:f}){let{t:p}=t.useTranslation(`openhands`),{addBackend:m,updateBackend:h}=d.useActiveBackendContext(),v=e===`edit`&&i?i.kind:null,{name:y,setName:b,host:x,setHost:S,apiKey:C,setApiKey:E,connectionError:D,setConnectionError:j,isSubmitting:M,kind:N,handleSubmit:L}=I({initialName:i?.name??``,initialHost:i?.host??``,initialApiKey:i?.apiKey??``,onTestConnection:P,onSuccess:async()=>{let t={name:y.trim(),host:O(x),apiKey:C.trim(),kind:v??N};e===`edit`&&i?h(i.id,t):m(t),a()},requireApiKey:l,onSubmitOverride:f}),[R,z]=w.default.useState(!1),[B,V]=w.default.useState(!1),H=v??N,U=s??(e===`edit`?`edit-backend`:`add-backend`),W=l||H!==`local`,G=y.trim().length>0&&k(x)&&(!W||C.trim().length>0),K=R&&!y.trim()?p(n.I18nKey.BACKEND$NAME_REQUIRED):void 0,q=B?x.trim()?k(x)?void 0:p(n.I18nKey.BACKEND$HOST_INVALID):p(n.I18nKey.BACKEND$HOST_REQUIRED):void 0;return(0,T.jsxs)(`form`,{"data-testid":`${U}-form`,onSubmit:async e=>{if(!G){z(!0),V(!0);return}await L(e)},className:`flex flex-col gap-4`,children:[(0,T.jsxs)(`div`,{"data-testid":`${U}-configuration-fields`,className:r.cn(`flex flex-col gap-4`,u&&`hidden`),children:[(0,T.jsx)(_.SettingsInput,{testId:`${U}-name`,name:`${U}-name`,type:`text`,label:p(n.I18nKey.BACKEND$NAME_LABEL),value:y,onChange:e=>{b(e),j(null)},onBlur:()=>z(!0),placeholder:`Production`,className:`w-full`,showRequiredTag:!0,error:K}),(0,T.jsx)(_.SettingsInput,{testId:`${U}-host`,name:`${U}-host`,type:`text`,label:p(n.I18nKey.BACKEND$HOST_LABEL),value:x,onChange:c?void 0:e=>{S(e),j(null)},onBlur:()=>V(!0),placeholder:A,className:`w-full`,showRequiredTag:!0,error:q,isDisabled:c}),(0,T.jsx)(_.SettingsInput,{testId:`${U}-api-key`,name:`${U}-api-key`,type:`password`,label:p(n.I18nKey.BACKEND$KEY_LABEL),value:C,onChange:e=>{E(e),j(null)},placeholder:``,className:`w-full`}),D?(0,T.jsx)(`div`,{role:`alert`,"data-testid":`${U}-error`,className:`rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words`,children:D}):null,e===`edit`&&i&&(0,T.jsx)(F,{backend:i,testIdRoot:U})]}),o?o({canSubmit:G&&!M,isSubmitting:M,testIdRoot:U}):(0,T.jsxs)(`div`,{className:`flex justify-end gap-2 mt-2 w-full`,children:[(0,T.jsx)(g.BrandButton,{type:`button`,variant:`secondary`,onClick:a,testId:`${U}-cancel`,children:p(n.I18nKey.BUTTON$CANCEL)}),(0,T.jsx)(g.BrandButton,{type:`submit`,variant:`primary`,isDisabled:!G||M,testId:`${U}-submit`,children:p(n.I18nKey.BACKEND$SAVE)})]})]})}function R(){let{currentPath:e,navigate:t}=i.useNavigation();return w.default.useCallback(()=>{/^\/automations\/[^/]+/.test(e)?t(`/automations`):/^\/conversations\/[^/]+/.test(e)&&t(`/conversations`)},[e,t])}function z({onConnected:e,testIdRoot:r=`add-backend`,initialManualBackend:i,requireManualApiKey:a=!1,manualSubmitLabel:s,manualSubmittingLabel:c,manualSubmitTestId:l}){let{t:u}=t.useTranslation(`openhands`),d=o.getLockedCloudHost();return d?(0,T.jsx)(`div`,{"data-testid":`${r}-connection-options`,className:`flex justify-center`,children:(0,T.jsx)(`div`,{className:`w-full`,children:(0,T.jsx)(V,{onConnected:e,testIdRoot:r,lockedHost:d})})}):(0,T.jsxs)(`div`,{"data-testid":`${r}-connection-options`,className:`flex flex-col gap-6 md:flex-row`,children:[(0,T.jsx)(`div`,{className:`flex-1 min-w-0`,children:(0,T.jsx)(B,{onConnected:e,testIdRoot:r,initialBackend:i,requireApiKey:a,submitLabel:s??u(n.I18nKey.BACKEND$CONNECT),submittingLabel:c??u(n.I18nKey.ONBOARDING$BACKEND_STATUS_CHECKING),submitTestId:l})}),(0,T.jsx)(`div`,{className:`flex-1 min-w-0`,children:(0,T.jsx)(V,{onConnected:e,testIdRoot:r})})]})}function B({onConnected:e,testIdRoot:r,initialBackend:i,requireApiKey:a,submitLabel:o,submittingLabel:s,submitTestId:c}){let{t:l}=t.useTranslation(`openhands`),{name:u,setName:d,host:f,setHost:p,apiKey:m,setApiKey:h,connectionError:v,setConnectionError:y,isSubmitting:b,kind:x,canSubmit:S,handleSubmit:C}=I({initialName:i?.name??``,initialHost:i?.host??``,initialApiKey:i?.apiKey??``,onTestConnection:P,onSuccess:()=>{e({name:u.trim(),host:O(f),apiKey:m.trim(),kind:x})},requireApiKey:a});return(0,T.jsxs)(`form`,{"data-testid":`${r}-form`,onSubmit:C,className:`flex flex-col gap-4 flex-1 min-w-0`,children:[(0,T.jsxs)(`div`,{className:`flex flex-col gap-1`,children:[(0,T.jsx)(_.SettingsInput,{testId:`${r}-name`,name:`${r}-name`,type:`text`,label:l(n.I18nKey.BACKEND$NAME_LABEL),value:u,onChange:e=>{d(e),y(null)},placeholder:`e.g. My Server`,className:`w-full`}),(0,T.jsx)(`p`,{className:`text-xs text-[var(--oh-muted)]`,children:l(n.I18nKey.BACKEND$NAME_HELPER)})]}),(0,T.jsxs)(`div`,{className:`flex flex-col gap-1`,children:[(0,T.jsx)(_.SettingsInput,{testId:`${r}-host`,name:`${r}-host`,type:`text`,label:l(n.I18nKey.BACKEND$HOST_LABEL),value:f,onChange:e=>{p(e),y(null)},placeholder:`http://localhost:8000`,className:`w-full`}),(0,T.jsx)(`p`,{className:`text-xs text-[var(--oh-muted)]`,"data-testid":`${r}-host-helper`,children:l(n.I18nKey.BACKEND$HOST_HELPER)})]}),(0,T.jsx)(_.SettingsInput,{testId:`${r}-api-key`,name:`${r}-api-key`,type:`password`,label:l(n.I18nKey.BACKEND$KEY_LABEL),value:m,onChange:e=>{h(e),y(null)},placeholder:`sk-••••••••••`,className:`w-full`}),v?(0,T.jsx)(`div`,{role:`alert`,"data-testid":`${r}-error`,className:`rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words`,children:v}):null,(0,T.jsx)(g.BrandButton,{type:`submit`,variant:`secondary`,isDisabled:!S||b,testId:c??`${r}-submit`,className:`w-full text-center`,children:b?s:o})]})}function V({onConnected:e,testIdRoot:i,lockedHost:a}){let{t:o}=t.useTranslation(`openhands`),[s,c]=w.default.useState(!1),[l,u]=w.default.useState(``),d=a??(l.trim()||A);return(0,T.jsxs)(`div`,{className:`flex flex-1 min-w-0 flex-col items-center gap-3`,children:[(0,T.jsxs)(`div`,{className:`flex flex-col items-center gap-1`,children:[(0,T.jsx)(y.default,{width:56,height:56,"aria-hidden":!0}),(0,T.jsx)(`h4`,{className:m.modalTitleLgMediumClassName,"data-testid":`${i}-cloud-title`,children:o(n.I18nKey.BACKEND$CLOUD_TITLE)})]}),(0,T.jsx)(`p`,{className:`text-center text-sm leading-relaxed text-[var(--oh-muted)]`,children:o(n.I18nKey.BACKEND$CLOUD_DESCRIPTION)}),(0,T.jsx)(C.DeviceFlowAuth,{host:d,onSuccess:t=>{e({name:`OpenHands Cloud`,host:O(d),apiKey:t,kind:`cloud`})},testIdRoot:i}),a?null:(0,T.jsxs)(`div`,{className:`w-full`,children:[(0,T.jsxs)(`button`,{type:`button`,onClick:()=>c(e=>!e),"aria-expanded":s,"data-testid":`${i}-advanced-toggle`,className:`flex w-full cursor-pointer items-center justify-center gap-1 text-center text-xs text-[var(--oh-muted)] transition-colors hover:text-content-2`,children:[(0,T.jsx)(`span`,{children:o(n.I18nKey.BACKEND$ADVANCED)}),(0,T.jsx)(b.default,{className:r.cn(`h-4 w-4 shrink-0 text-muted transition-transform`,s&&`rotate-180`),"aria-hidden":!0})]}),(0,T.jsxs)(`div`,{className:r.cn(`pt-2`,!s&&`pointer-events-none invisible`),"aria-hidden":!s,children:[(0,T.jsx)(_.SettingsInput,{testId:`${i}-cloud-host`,name:`${i}-cloud-host`,type:`text`,label:o(n.I18nKey.BACKEND$HOST_LABEL),value:l,onChange:u,placeholder:A,className:`w-full`}),(0,T.jsx)(`p`,{className:`mt-1 text-xs text-[var(--oh-muted)]`,children:o(n.I18nKey.BACKEND$LOGIN_CLOUD_HINT)})]})]})]})}function H({onClose:e}){let{addBackend:t}=d.useActiveBackendContext(),n=R();return(0,T.jsx)(z,{onConnected:w.default.useCallback(r=>{t(r),n(),e()},[t,n,e])})}function U({mode:e,backend:i,onClose:a}){let{t:o}=t.useTranslation(`openhands`);if(e===`add`)return(0,T.jsx)(f.ModalBackdrop,{onClose:a,closeOnEscape:!1,"aria-label":o(n.I18nKey.BACKEND$ADD_TITLE),children:(0,T.jsxs)(`div`,{"data-testid":`add-backend-modal`,className:r.cn(`relative rounded-xl border border-[var(--oh-border)] bg-base-secondary`,p.modalWidthClassName(`xl`),p.MODAL_MAX_WIDTH_VIEWPORT),children:[(0,T.jsx)(h.ModalCloseButton,{onClose:a,testId:`add-backend-close`}),(0,T.jsx)(`div`,{className:`px-6 pt-6 pb-2 pr-12`,children:(0,T.jsx)(`h2`,{className:m.modalTitleLgClassName,children:o(n.I18nKey.BACKEND$ADD_TITLE)})}),(0,T.jsx)(`div`,{className:`px-6 pb-6 pt-2`,children:(0,T.jsx)(H,{onClose:a})})]})});let s=`edit-backend`;return(0,T.jsx)(f.ModalBackdrop,{onClose:a,closeOnEscape:!1,"aria-label":o(n.I18nKey.BACKEND$EDIT_TITLE),children:(0,T.jsxs)(`div`,{"data-testid":`${s}-modal`,className:r.cn(`relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)]`,p.modalWidthClassName(`md`)),children:[(0,T.jsx)(h.ModalCloseButton,{onClose:a,testId:`${s}-close`}),(0,T.jsx)(`h2`,{className:r.cn(`pr-6`,m.modalTitleLgClassName),children:o(n.I18nKey.BACKEND$EDIT_TITLE)}),(0,T.jsx)(L,{mode:`edit`,backend:i,onSubmitted:a,testIdRoot:s})]})})}exports.BackendFormModal=U;
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../utils/utils.cjs`),i=require(`../../../context/navigation-context.cjs`),a=require(`../../../node_modules/@openhands/typescript-client/dist/client/server-client.cjs`);require(`../../../node_modules/@openhands/typescript-client/dist/clients.cjs`);const o=require(`../../../api/agent-server-config.cjs`),s=require(`../../../api/agent-server-client-options.cjs`),c=require(`../../../api/agent-server-compatibility.cjs`),l=require(`../../../utils/user-facing-error.cjs`),u=require(`../../../node_modules/@tanstack/react-query/build/modern/useQuery.cjs`),d=require(`../../../contexts/active-backend-context.cjs`),f=require(`../../../hooks/use-tracking.cjs`),p=require(`../../shared/modals/modal-backdrop.cjs`),m=require(`../../shared/modals/modal-body.cjs`),h=require(`../../../utils/modal-classes.cjs`),g=require(`../../shared/modals/modal-close-button.cjs`),_=require(`../settings/brand-button.cjs`),v=require(`../settings/settings-input.cjs`),y=require(`../../../hooks/query/use-backends-health.cjs`),b=require(`../../../assets/branding/openhands-logo-white.cjs`),x=require(`../files-tab/segmented-toggle.cjs`),S=require(`../../../api/device-flow-client.cjs`),C=require(`../../../icons/chevron-down-small.cjs`),w=require(`./backend-status-label.cjs`),T=require(`./backend-status-dot.cjs`),E=require(`./device-flow-auth.cjs`);let D=require(`react`);D=e.__toESM(D,1);let O=require(`react/jsx-runtime`);function k(e){return S.isOpenHandsCloudHost(e)?`cloud`:`local`}function A(e){let t=e.toLowerCase().replace(/^\[|\]$/g,``);return!!(t===`localhost`||t===`::1`||t===`::`||t===`0.0.0.0`||/^127\./.test(t)||/^::ffff:127\./i.test(t)||/^10\./.test(t)||/^192\.168\./.test(t)||/^172\.(1[6-9]|2\d|3[01])\./.test(t)||/^fe[89ab][0-9a-f]:/i.test(t)||/^f[cd][0-9a-f]{2}:/i.test(t)||t.endsWith(`.local`)||!t.includes(`.`)&&!t.includes(`:`))}function j(e){let t=e.trim().replace(/\/+$/,``);if(!t)return``;if(/^https?:\/\//i.test(t))return t;let n=t.match(/^\[([^\]]+)\]/);return`${A(n?n[1]:(t.match(/:/g)??[]).length>1?t:t.split(`:`)[0])?`http`:`https`}://${t}`}function M(e){let t=e.trim();if(!t||/\s/.test(t))return!1;let n=j(t);if(!n)return!1;try{let e=new URL(n);return(e.protocol===`http:`||e.protocol===`https:`)&&e.hostname.length>0}catch{return!1}}var N=`https://app.all-hands.dev`;function P(e,t){return e(n.I18nKey.BACKEND$CONNECTION_TEST_FAILED,{host:t,interpolation:{escapeValue:!1}})}function F(e){return l.getUserFacingConnectionErrorMessage(e)}function I(e,t){let n=F(t);return n?`${e}\n${n}`:e}async function L(e){e.kind===`local`&&c.assertAgentServerVersionIsSupported(await new a.ServerClient(s.getAgentServerClientOptions({host:e.host,sessionApiKey:e.apiKey||null,timeout:5e3})).getServerInfo())}function R({backend:e,testIdRoot:r}){let{t:i}=t.useTranslation(`openhands`),o=y.useBackendsHealth([e])[e.id],l=o?.isConnected??null,d=o?.disabled===!0,f=o?.consecutiveFailures??0,p=o?.lastError??null,{data:m}=u.useQuery({queryKey:[`backend-version`,e.host,e.apiKey],queryFn:async()=>c.getDisplayAgentServerVersion(await new a.ServerClient(s.getAgentServerClientOptions({host:e.host,sessionApiKey:e.apiKey||null,timeout:5e3})).getServerInfo()),retry:!1,staleTime:6e4,enabled:e.kind===`local`&&!d}),h=w.getBackendStatusLabel(i,e,o),g=e.kind===`cloud`?i(n.I18nKey.BACKEND$KIND_CLOUD):i(n.I18nKey.BACKEND$KIND_LOCAL);return(0,O.jsxs)(`div`,{className:`flex flex-col gap-2`,children:[(0,O.jsxs)(`div`,{"data-testid":`${r}-status`,className:`flex items-center gap-3 text-sm`,children:[(0,O.jsx)(T.BackendStatusDot,{isConnected:l}),(0,O.jsx)(`span`,{className:`text-white`,"data-testid":`${r}-status-label`,children:h}),(0,O.jsx)(`span`,{className:`text-tertiary-alt`,children:`·`}),(0,O.jsx)(`span`,{className:`text-[var(--oh-text-tertiary)]`,children:g}),m?(0,O.jsx)(`span`,{className:`text-xs text-[var(--oh-muted)]`,"data-testid":`${r}-version`,children:i(n.I18nKey.BACKEND$VERSION_LABEL,{version:m})}):null]}),d?(0,O.jsxs)(`div`,{"data-testid":`${r}-status-error`,className:`flex flex-col gap-1 rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm`,children:[(0,O.jsx)(`span`,{className:`font-semibold text-red-300`,children:i(n.I18nKey.BACKEND$HEALTH_FAILED_TITLE)}),(0,O.jsx)(`span`,{className:`text-xs text-[var(--oh-text-tertiary)]`,children:i(n.I18nKey.BACKEND$HEALTH_FAILED_DETAIL,{count:f})}),p?(0,O.jsx)(`span`,{"data-testid":`${r}-status-error-message`,className:`text-xs text-red-300 whitespace-pre-wrap break-words`,children:p}):null]}):null]})}function z({initialName:e=``,initialHost:n=``,initialApiKey:r=``,onTestConnection:i,onSuccess:a,requireApiKey:o=!1,onSubmitOverride:s}){let{t:c}=t.useTranslation(`openhands`),[l,u]=D.default.useState(e),[d,f]=D.default.useState(n),[p,m]=D.default.useState(r),[h,g]=D.default.useState(null),[_,v]=D.default.useState(!1),[y,b]=D.default.useState(null),x=y??k(d),S=o||x!==`local`,C=l.trim().length>0&&M(d)&&(!S||p.trim().length>0);return{name:l,setName:u,host:d,setHost:f,apiKey:p,setApiKey:m,connectionError:h,setConnectionError:g,isSubmitting:_,kind:x,setKind:b,canSubmit:C,handleSubmit:D.default.useCallback(async e=>{if(e.preventDefault(),!C||_)return;let t={name:l.trim(),host:j(d),apiKey:p.trim(),kind:x};g(null),v(!0);try{s?await s(t):(await i(t),a())}catch(e){g(I(P(c,t.host),e))}finally{v(!1)}},[C,_,l,d,p,x,i,a,o,s,c])}}function B({mode:e,backend:i,onSubmitted:a,renderActions:o,testIdRoot:s,hostReadOnly:c,requireApiKey:l,hideConfigurationFields:u=!1,onSubmitOverride:f}){let{t:p}=t.useTranslation(`openhands`),{addBackend:m,updateBackend:h}=d.useActiveBackendContext(),g=e===`edit`&&i?i.kind:null,{name:y,setName:b,host:x,setHost:S,apiKey:C,setApiKey:w,connectionError:T,setConnectionError:E,isSubmitting:k,kind:A,handleSubmit:P}=z({initialName:i?.name??``,initialHost:i?.host??``,initialApiKey:i?.apiKey??``,onTestConnection:L,onSuccess:async()=>{let t={name:y.trim(),host:j(x),apiKey:C.trim(),kind:g??A};e===`edit`&&i?h(i.id,t):m(t),a()},requireApiKey:l,onSubmitOverride:f}),[F,I]=D.default.useState(!1),[B,V]=D.default.useState(!1),H=g??A,U=s??(e===`edit`?`edit-backend`:`add-backend`),W=l||H!==`local`,G=y.trim().length>0&&M(x)&&(!W||C.trim().length>0),K=F&&!y.trim()?p(n.I18nKey.BACKEND$NAME_REQUIRED):void 0,q=B?x.trim()?M(x)?void 0:p(n.I18nKey.BACKEND$HOST_INVALID):p(n.I18nKey.BACKEND$HOST_REQUIRED):void 0;return(0,O.jsxs)(`form`,{"data-testid":`${U}-form`,onSubmit:async e=>{if(!G){I(!0),V(!0);return}await P(e)},className:`flex flex-col gap-4`,children:[(0,O.jsxs)(`div`,{"data-testid":`${U}-configuration-fields`,className:r.cn(`flex flex-col gap-4`,u&&`hidden`),children:[(0,O.jsx)(v.SettingsInput,{testId:`${U}-name`,name:`${U}-name`,type:`text`,label:p(n.I18nKey.BACKEND$NAME_LABEL),value:y,onChange:e=>{b(e),E(null)},onBlur:()=>I(!0),placeholder:`Production`,className:`w-full`,showRequiredTag:!0,error:K}),(0,O.jsx)(v.SettingsInput,{testId:`${U}-host`,name:`${U}-host`,type:`text`,label:p(n.I18nKey.BACKEND$HOST_LABEL),value:x,onChange:c?void 0:e=>{S(e),E(null)},onBlur:()=>V(!0),placeholder:N,className:`w-full`,showRequiredTag:!0,error:q,isDisabled:c}),(0,O.jsx)(v.SettingsInput,{testId:`${U}-api-key`,name:`${U}-api-key`,type:`password`,label:p(n.I18nKey.BACKEND$KEY_LABEL),value:C,onChange:e=>{w(e),E(null)},placeholder:``,className:`w-full`}),T?(0,O.jsx)(`div`,{role:`alert`,"data-testid":`${U}-error`,className:`rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words`,children:T}):null,e===`edit`&&i&&(0,O.jsx)(R,{backend:i,testIdRoot:U})]}),o?o({canSubmit:G&&!k,isSubmitting:k,testIdRoot:U}):(0,O.jsxs)(`div`,{className:`flex justify-end gap-2 mt-2 w-full`,children:[(0,O.jsx)(_.BrandButton,{type:`button`,variant:`secondary`,onClick:a,testId:`${U}-cancel`,children:p(n.I18nKey.BUTTON$CANCEL)}),(0,O.jsx)(_.BrandButton,{type:`submit`,variant:`primary`,isDisabled:!G||k,testId:`${U}-submit`,children:p(n.I18nKey.BACKEND$SAVE)})]})]})}function V(){let{currentPath:e,navigate:t}=i.useNavigation();return D.default.useCallback(()=>{/^\/automations\/[^/]+/.test(e)?t(`/automations`):/^\/conversations\/[^/]+/.test(e)&&t(`/conversations`)},[e,t])}function H({onConnected:e,testIdRoot:r=`add-backend`,initialManualBackend:i,requireManualApiKey:a=!1,manualSubmitLabel:s,manualSubmittingLabel:c,manualSubmitTestId:l}){let{t:u}=t.useTranslation(`openhands`),d=o.getLockedCloudHost();return d?(0,O.jsx)(`div`,{"data-testid":`${r}-connection-options`,className:`flex justify-center`,children:(0,O.jsx)(`div`,{className:`w-full`,children:(0,O.jsx)(W,{onConnected:e,testIdRoot:r,lockedHost:d})})}):(0,O.jsxs)(`div`,{"data-testid":`${r}-connection-options`,className:`flex flex-col gap-6 md:flex-row`,children:[(0,O.jsx)(`div`,{className:`flex-1 min-w-0`,children:(0,O.jsx)(U,{onConnected:e,testIdRoot:r,initialBackend:i,requireApiKey:a,submitLabel:s??u(n.I18nKey.BACKEND$CONNECT),submittingLabel:c??u(n.I18nKey.ONBOARDING$BACKEND_STATUS_CHECKING),submitTestId:l})}),(0,O.jsx)(`div`,{className:`flex-1 min-w-0`,children:(0,O.jsx)(W,{onConnected:e,testIdRoot:r})})]})}function U({onConnected:e,testIdRoot:r,initialBackend:i,requireApiKey:a,submitLabel:o,submittingLabel:s,submitTestId:c}){let{t:l}=t.useTranslation(`openhands`),{name:u,setName:d,host:f,setHost:p,apiKey:m,setApiKey:h,connectionError:g,setConnectionError:y,isSubmitting:b,kind:S,setKind:C,canSubmit:w,handleSubmit:T}=z({initialName:i?.name??``,initialHost:i?.host??``,initialApiKey:i?.apiKey??``,onTestConnection:L,onSuccess:()=>{e({name:u.trim(),host:j(f),apiKey:m.trim(),kind:S},`manual`)},requireApiKey:a});return(0,O.jsxs)(`form`,{"data-testid":`${r}-form`,onSubmit:T,className:`flex flex-col gap-4 flex-1 min-w-0`,children:[(0,O.jsxs)(`div`,{className:`flex flex-col gap-1`,children:[(0,O.jsx)(v.SettingsInput,{testId:`${r}-name`,name:`${r}-name`,type:`text`,label:l(n.I18nKey.BACKEND$NAME_LABEL),value:u,onChange:e=>{d(e),y(null)},placeholder:`e.g. My Server`,className:`w-full`}),(0,O.jsx)(`p`,{className:`text-xs text-[var(--oh-muted)]`,children:l(n.I18nKey.BACKEND$NAME_HELPER)})]}),(0,O.jsxs)(`div`,{className:`flex flex-col gap-1`,children:[(0,O.jsx)(v.SettingsInput,{testId:`${r}-host`,name:`${r}-host`,type:`text`,label:l(n.I18nKey.BACKEND$HOST_LABEL),value:f,onChange:e=>{p(e),y(null)},placeholder:`http://localhost:8000`,className:`w-full`}),(0,O.jsx)(`p`,{className:`text-xs text-[var(--oh-muted)]`,"data-testid":`${r}-host-helper`,children:l(n.I18nKey.BACKEND$HOST_HELPER)})]}),(0,O.jsxs)(`div`,{className:`flex flex-col items-start gap-2.5`,children:[(0,O.jsx)(`span`,{className:`text-sm`,children:l(n.I18nKey.BACKEND$KIND_LABEL)}),(0,O.jsx)(x.SegmentedToggle,{value:S,options:[{value:`local`,label:l(n.I18nKey.BACKEND$KIND_LOCAL)},{value:`cloud`,label:l(n.I18nKey.BACKEND$KIND_CLOUD)}],onChange:e=>C(e),ariaLabel:l(n.I18nKey.BACKEND$KIND_LABEL),testId:`${r}-kind`})]}),(0,O.jsx)(v.SettingsInput,{testId:`${r}-api-key`,name:`${r}-api-key`,type:`password`,label:l(n.I18nKey.BACKEND$KEY_LABEL),value:m,onChange:e=>{h(e),y(null)},placeholder:`sk-••••••••••`,className:`w-full`}),g?(0,O.jsx)(`div`,{role:`alert`,"data-testid":`${r}-error`,className:`rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words`,children:g}):null,(0,O.jsx)(_.BrandButton,{type:`submit`,variant:`secondary`,isDisabled:!w||b,testId:c??`${r}-submit`,className:`w-full text-center`,children:b?s:o})]})}function W({onConnected:e,testIdRoot:i,lockedHost:a}){let{t:o}=t.useTranslation(`openhands`),[s,c]=D.default.useState(!1),[l,u]=D.default.useState(``),d=a??(l.trim()||N);return(0,O.jsxs)(`div`,{className:`flex flex-1 min-w-0 flex-col items-center gap-3 pb-7`,children:[(0,O.jsxs)(`div`,{className:`flex flex-col items-center gap-1`,children:[(0,O.jsx)(b.default,{width:56,height:56,"aria-hidden":!0}),(0,O.jsx)(`h4`,{className:h.modalTitleLgMediumClassName,"data-testid":`${i}-cloud-title`,children:o(n.I18nKey.BACKEND$CLOUD_TITLE)})]}),(0,O.jsx)(`p`,{className:`text-center text-sm leading-relaxed text-[var(--oh-muted)]`,children:o(n.I18nKey.BACKEND$CLOUD_DESCRIPTION)}),(0,O.jsx)(E.DeviceFlowAuth,{host:d,onSuccess:t=>{e({name:`OpenHands Cloud`,host:j(d),apiKey:t,kind:`cloud`},`cloud_login`)},testIdRoot:i}),a?null:(0,O.jsxs)(`div`,{className:`w-full`,children:[(0,O.jsxs)(`button`,{type:`button`,onClick:()=>c(e=>!e),"aria-expanded":s,"data-testid":`${i}-advanced-toggle`,className:`flex w-full cursor-pointer items-center justify-center gap-1 text-center text-xs text-[var(--oh-muted)] transition-colors hover:text-content-2`,children:[(0,O.jsx)(`span`,{children:o(n.I18nKey.BACKEND$ADVANCED)}),(0,O.jsx)(C.default,{className:r.cn(`h-4 w-4 shrink-0 text-muted transition-transform`,s&&`rotate-180`),"aria-hidden":!0})]}),(0,O.jsxs)(`div`,{className:r.cn(`pt-2`,!s&&`pointer-events-none invisible`),"aria-hidden":!s,children:[(0,O.jsx)(v.SettingsInput,{testId:`${i}-cloud-host`,name:`${i}-cloud-host`,type:`text`,label:o(n.I18nKey.BACKEND$HOST_LABEL),value:l,onChange:u,placeholder:N,className:`w-full`}),(0,O.jsx)(`p`,{className:`mt-1 text-xs text-[var(--oh-muted)]`,children:o(n.I18nKey.BACKEND$LOGIN_CLOUD_HINT)})]})]})]})}function G({onClose:e,source:t}){let{addBackend:n}=d.useActiveBackendContext(),r=V(),{trackBackendAdded:i}=f.useTracking();return(0,O.jsx)(H,{onConnected:D.default.useCallback((a,o)=>{n(a);let s=a.host===N;i({backendKind:a.kind,connectionMethod:o,isOpenhandsCloud:s,isCustomHost:!s,hasApiKey:!!a.apiKey,source:t}),r(),e()},[n,r,e,i,t])})}function K({mode:e,backend:i,onClose:a,source:o=`add_backend_modal`}){let{t:s}=t.useTranslation(`openhands`);if(e===`add`)return(0,O.jsx)(p.ModalBackdrop,{onClose:a,closeOnEscape:!1,"aria-label":s(n.I18nKey.BACKEND$ADD_TITLE),children:(0,O.jsxs)(`div`,{"data-testid":`add-backend-modal`,className:r.cn(`relative rounded-xl border border-[var(--oh-border)] bg-base-secondary`,m.modalWidthClassName(`xl`),m.MODAL_MAX_WIDTH_VIEWPORT),children:[(0,O.jsx)(g.ModalCloseButton,{onClose:a,testId:`add-backend-close`}),(0,O.jsx)(`div`,{className:`px-6 pt-6 pb-2 pr-12`,children:(0,O.jsx)(`h2`,{className:h.modalTitleLgClassName,children:s(n.I18nKey.BACKEND$ADD_TITLE)})}),(0,O.jsx)(`div`,{className:`px-6 pb-6 pt-2`,children:(0,O.jsx)(G,{onClose:a,source:o})})]})});let c=`edit-backend`;return(0,O.jsx)(p.ModalBackdrop,{onClose:a,closeOnEscape:!1,"aria-label":s(n.I18nKey.BACKEND$EDIT_TITLE),children:(0,O.jsxs)(`div`,{"data-testid":`${c}-modal`,className:r.cn(`relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)]`,m.modalWidthClassName(`md`)),children:[(0,O.jsx)(g.ModalCloseButton,{onClose:a,testId:`${c}-close`}),(0,O.jsx)(`h2`,{className:r.cn(`pr-6`,h.modalTitleLgClassName),children:s(n.I18nKey.BACKEND$EDIT_TITLE)}),(0,O.jsx)(B,{mode:`edit`,backend:i,onSubmitted:a,testIdRoot:c})]})})}exports.BackendFormModal=K;
 //# sourceMappingURL=backend-form-modal.cjs.map

package/dist/components/features/backends/backend-form-modal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"backend-form-modal.cjs","names":[],"sources":["../../../../src/components/features/backends/backend-form-modal.tsx"],"sourcesContent":["import React from \"react\";\nimport { useQuery } from \"@tanstack/react-query\";\nimport { useTranslation } from \"react-i18next\";\nimport { ServerClient } from \"@openhands/typescript-client/clients\";\nimport OpenHandsLogoWhite from \"#/assets/branding/openhands-logo-white.svg?react\";\nimport { ModalBackdrop } from \"#/components/shared/modals/modal-backdrop\";\nimport {\n  MODAL_MAX_WIDTH_VIEWPORT,\n  modalWidthClassName,\n} from \"#/components/shared/modals/modal-body\";\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 { useActiveBackendContext } from \"#/contexts/active-backend-context\";\nimport { useNavigation } from \"#/context/navigation-context\";\nimport { useBackendsHealth } from \"#/hooks/query/use-backends-health\";\nimport { getAgentServerClientOptions } from \"#/api/agent-server-client-options\";\nimport { getLockedCloudHost } from \"#/api/agent-server-config\";\nimport {\n  assertAgentServerVersionIsSupported,\n  getDisplayAgentServerVersion,\n} from \"#/api/agent-server-compatibility\";\nimport ChevronDownSmallIcon from \"#/icons/chevron-down-small.svg?react\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport type { Backend, BackendKind } from \"#/api/backend-registry/types\";\nimport { getUserFacingConnectionErrorMessage } from \"#/utils/user-facing-error\";\nimport { cn } from \"#/utils/utils\";\nimport {\n  modalTitleLgClassName,\n  modalTitleLgMediumClassName,\n} from \"#/utils/modal-classes\";\nimport { getBackendStatusLabel } from \"./backend-status-label\";\nimport { BackendStatusDot } from \"./backend-status-dot\";\nimport { DeviceFlowAuth } from \"./device-flow-auth\";\n\nexport type BackendFormMode = \"add\" | \"edit\";\n\ninterface BackendFormModalProps {\n  mode: BackendFormMode;\n  /** Required when `mode === \"edit\"`. */\n  backend?: Backend;\n  onClose: () => void;\n}\n\nfunction inferKindFromHost(host: string): BackendKind {\n  const trimmed = host.trim().toLowerCase();\n  if (trimmed.includes(\"all-hands.dev\") || trimmed.includes(\"openhands.dev\")) {\n    return \"cloud\";\n  }\n  return \"local\";\n}\n\n/**\n * Returns true for hostnames that represent a local / private-network address.\n * Used by normalizeHost to choose http:// instead of https://.\n */\nfunction isLocalAddress(hostname: string): boolean {\n  // Strip IPv6 bracket notation: [::1] → ::1\n  const h = hostname.toLowerCase().replace(/^\\[|\\]$/g, \"\");\n  // IPv6 loopback, any-address, and named loopback\n  if (h === \"localhost\" || h === \"::1\" || h === \"::\" || h === \"0.0.0.0\")\n    return true;\n  // 127.x.x.x loopback range + IPv4-mapped loopback (::ffff:127.x.x.x)\n  if (/^127\\./.test(h) || /^::ffff:127\\./i.test(h)) return true;\n  // RFC 1918 private ranges\n  if (/^10\\./.test(h)) return true;\n  if (/^192\\.168\\./.test(h)) return true;\n  if (/^172\\.(1[6-9]|2\\d|3[01])\\./.test(h)) return true;\n  // IPv6 link-local (fe80::/10) and unique local (fc00::/7)\n  if (/^fe[89ab][0-9a-f]:/i.test(h)) return true;\n  if (/^f[cd][0-9a-f]{2}:/i.test(h)) return true;\n  // mDNS / Bonjour (.local)\n  if (h.endsWith(\".local\")) return true;\n  // Single-label hostnames (no dots, no colons) are local network names.\n  // Colons are excluded so bare IPv6 addresses don't accidentally match.\n  if (!h.includes(\".\") && !h.includes(\":\")) return true;\n  return false;\n}\n\nfunction normalizeHost(host: string): string {\n  const trimmed = host.trim().replace(/\\/+$/, \"\");\n  if (!trimmed) return \"\";\n  // Already has an explicit scheme — respect it.\n  if (/^https?:\\/\\//i.test(trimmed)) return trimmed;\n  // Extract the pure hostname for scheme selection, handling three cases:\n  //   [::1]:8080  → bracket IPv6 notation → extract ::1\n  //   ::1         → bare IPv6 (multiple colons, no bracket) → whole string\n  //   host:port   → regular host:port → part before the colon\n  const bracketMatch = trimmed.match(/^\\[([^\\]]+)\\]/);\n  const hostname = bracketMatch\n    ? bracketMatch[1]\n    : (trimmed.match(/:/g) ?? []).length > 1\n      ? trimmed\n      : trimmed.split(\":\")[0];\n  const scheme = isLocalAddress(hostname) ? \"http\" : \"https\";\n  return `${scheme}://${trimmed}`;\n}\n\n/**\n * Returns true when `host` represents a reachable backend URL.\n *\n * Rules (applied in order):\n *   1. Must be non-empty after trimming.\n *   2. Must contain no whitespace — spaces can never appear in a host/port.\n *   3. After normalisation (bare hosts get `https://` prepended), must parse\n *      as a valid http or https URL with a non-empty hostname.\n */\nfunction isValidHostUrl(host: string): boolean {\n  const trimmed = host.trim();\n  if (!trimmed) return false;\n  // Spaces anywhere in the input are an immediate rejection.\n  if (/\\s/.test(trimmed)) return false;\n  const normalized = normalizeHost(trimmed);\n  if (!normalized) return false;\n  try {\n    const url = new URL(normalized);\n    return (\n      (url.protocol === \"http:\" || url.protocol === \"https:\") &&\n      url.hostname.length > 0\n    );\n  } catch {\n    return false;\n  }\n}\n\nconst DEFAULT_OPENHANDS_CLOUD_HOST = \"https://app.all-hands.dev\";\n\nfunction getConnectionTestFailedTitle(\n  t: ReturnType<typeof useTranslation>[\"t\"],\n  host: string,\n): string {\n  return t(I18nKey.BACKEND$CONNECTION_TEST_FAILED, {\n    host,\n    interpolation: { escapeValue: false },\n  });\n}\n\nfunction getConnectionErrorDetail(error: unknown): string | null {\n  return getUserFacingConnectionErrorMessage(error);\n}\n\nfunction getConnectionTestFailedMessage(title: string, error: unknown): string {\n  const detail = getConnectionErrorDetail(error);\n  return detail ? `${title}\\n${detail}` : title;\n}\n\nasync function testBackendConnection(\n  backend: Pick<Backend, \"host\" | \"apiKey\" | \"kind\">,\n): Promise<void> {\n  // Cloud backends authenticate via OAuth; preflight GET is not applicable.\n  if (backend.kind !== \"local\") return;\n\n  const serverInfo = await new ServerClient(\n    getAgentServerClientOptions({\n      host: backend.host,\n      sessionApiKey: backend.apiKey || null,\n      timeout: 5000,\n    }),\n  ).getServerInfo();\n  assertAgentServerVersionIsSupported(serverInfo);\n}\n\n/**\n * Live status row for the edit form: shows a connection dot, a\n * \"Local\"/\"Cloud\" label, and the agent server's reported version when\n * available. Replaces the legacy local/cloud radio fieldset (kind is\n * now inferred from the host).\n */\nfunction BackendStatusBadge({\n  backend,\n  testIdRoot,\n}: {\n  backend: Backend;\n  testIdRoot: string;\n}) {\n  const { t } = useTranslation(\"openhands\");\n  const healthByBackendId = useBackendsHealth([backend]);\n  const health = healthByBackendId[backend.id];\n  const isConnected = health?.isConnected ?? null;\n  const disabled = health?.disabled === true;\n  const consecutiveFailures = health?.consecutiveFailures ?? 0;\n  const lastError = health?.lastError ?? null;\n\n  const { data: version } = useQuery({\n    queryKey: [\"backend-version\", backend.host, backend.apiKey],\n    queryFn: async () => {\n      const info = await new ServerClient(\n        getAgentServerClientOptions({\n          host: backend.host,\n          sessionApiKey: backend.apiKey || null,\n          timeout: 5000,\n        }),\n      ).getServerInfo();\n      return getDisplayAgentServerVersion(info);\n    },\n    retry: false,\n    staleTime: 60_000,\n    enabled: backend.kind === \"local\" && !disabled,\n  });\n\n  const statusLabel = getBackendStatusLabel(t, backend, health);\n\n  const kindLabel =\n    backend.kind === \"cloud\"\n      ? t(I18nKey.BACKEND$KIND_CLOUD)\n      : t(I18nKey.BACKEND$KIND_LOCAL);\n\n  return (\n    <div className=\"flex flex-col gap-2\">\n      <div\n        data-testid={`${testIdRoot}-status`}\n        className=\"flex items-center gap-3 text-sm\"\n      >\n        <BackendStatusDot isConnected={isConnected} />\n        <span className=\"text-white\" data-testid={`${testIdRoot}-status-label`}>\n          {statusLabel}\n        </span>\n        <span className=\"text-tertiary-alt\">·</span>\n        <span className=\"text-[var(--oh-text-tertiary)]\">{kindLabel}</span>\n        {version ? (\n          <span\n            className=\"text-xs text-[var(--oh-muted)]\"\n            data-testid={`${testIdRoot}-version`}\n          >\n            {t(I18nKey.BACKEND$VERSION_LABEL, { version })}\n          </span>\n        ) : null}\n      </div>\n\n      {disabled ? (\n        <div\n          data-testid={`${testIdRoot}-status-error`}\n          className=\"flex flex-col gap-1 rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm\"\n        >\n          <span className=\"font-semibold text-red-300\">\n            {t(I18nKey.BACKEND$HEALTH_FAILED_TITLE)}\n          </span>\n          <span className=\"text-xs text-[var(--oh-text-tertiary)]\">\n            {t(I18nKey.BACKEND$HEALTH_FAILED_DETAIL, {\n              count: consecutiveFailures,\n            })}\n          </span>\n          {lastError ? (\n            <span\n              data-testid={`${testIdRoot}-status-error-message`}\n              className=\"text-xs text-red-300 whitespace-pre-wrap break-words\"\n            >\n              {lastError}\n            </span>\n          ) : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nexport interface BackendFormSubmitPayload {\n  name: string;\n  host: string;\n  apiKey: string;\n  kind: BackendKind;\n}\n\ninterface UseBackendFormOptions {\n  initialName?: string;\n  initialHost?: string;\n  initialApiKey?: string;\n  /**\n   * Called to test the connection. The hook does NOT call\n   * `testBackendConnection` directly so callers can inject a\n   * wrapped version (e.g. with extra logging or different timeout).\n   * Should throw on failure.\n   */\n  onTestConnection: (payload: BackendFormSubmitPayload) => Promise<void>;\n  /** Called after a successful connection test and persistence. */\n  onSuccess: () => void;\n  /** Require a non-empty API key even when the host looks local. */\n  requireApiKey?: boolean;\n  /**\n   * When provided, completely replaces the default submit flow\n   * (onTestConnection + onSuccess). The hook still manages form state\n   * and canSubmit validation, but the caller owns error handling and\n   * success side effects. Should throw on failure.\n   */\n  onSubmitOverride?: (payload: BackendFormSubmitPayload) => Promise<void>;\n}\n\n/**\n * Shared hook for the backend-form state used by both `BackendForm`\n * (edit/add mode) and `ManualConnectionColumn` (add-mode-only column).\n * Encapsulates name / host / apiKey fields, `connectionError`,\n * `isSubmitting`, and the shared `handleSubmit` flow.\n */\nfunction useBackendForm({\n  initialName = \"\",\n  initialHost = \"\",\n  initialApiKey = \"\",\n  onTestConnection,\n  onSuccess,\n  requireApiKey = false,\n  onSubmitOverride,\n}: UseBackendFormOptions) {\n  const { t } = useTranslation(\"openhands\");\n\n  const [name, setName] = React.useState(initialName);\n  const [host, setHost] = React.useState(initialHost);\n  const [apiKey, setApiKey] = React.useState(initialApiKey);\n  const [connectionError, setConnectionError] = React.useState<string | null>(\n    null,\n  );\n  const [isSubmitting, setIsSubmitting] = React.useState(false);\n\n  const kind = inferKindFromHost(host);\n  const needsApiKey = requireApiKey || kind !== \"local\";\n  const canSubmit =\n    name.trim().length > 0 &&\n    isValidHostUrl(host) &&\n    (!needsApiKey || apiKey.trim().length > 0);\n\n  const handleSubmit = React.useCallback(\n    async (e: React.FormEvent<HTMLFormElement>) => {\n      e.preventDefault();\n      if (!canSubmit || isSubmitting) return;\n\n      const payload: BackendFormSubmitPayload = {\n        name: name.trim(),\n        host: normalizeHost(host),\n        apiKey: apiKey.trim(),\n        kind,\n      };\n\n      setConnectionError(null);\n      setIsSubmitting(true);\n\n      try {\n        // When onSubmitOverride is provided, it completely replaces the\n        // default flow (onTestConnection + onSuccess).\n        if (onSubmitOverride) {\n          await onSubmitOverride(payload);\n        } else {\n          await onTestConnection(payload);\n          onSuccess();\n        }\n      } catch (error) {\n        setConnectionError(\n          getConnectionTestFailedMessage(\n            getConnectionTestFailedTitle(t, payload.host),\n            error,\n          ),\n        );\n      } finally {\n        setIsSubmitting(false);\n      }\n    },\n    [\n      canSubmit,\n      isSubmitting,\n      name,\n      host,\n      apiKey,\n      kind,\n      onTestConnection,\n      onSuccess,\n      requireApiKey,\n      onSubmitOverride,\n      t,\n    ],\n  );\n\n  return {\n    name,\n    setName,\n    host,\n    setHost,\n    apiKey,\n    setApiKey,\n    connectionError,\n    setConnectionError,\n    isSubmitting,\n    kind,\n    canSubmit,\n    handleSubmit,\n  };\n}\n\nexport interface BackendFormProps {\n  mode: BackendFormMode;\n  /** Required when `mode === \"edit\"`. */\n  backend?: Backend;\n  /**\n   * Called after the form is submitted and the backend has been\n   * persisted. Use this to dismiss a containing modal, advance an\n   * onboarding step, etc.\n   */\n  onSubmitted: () => void;\n  /**\n   * Optional render slot rendered in place of the default\n   * Save / Cancel button row, so callers (e.g. the onboarding flow)\n   * can re-skin the action area while still owning submission via the\n   * standard `<form onSubmit>` flow. Receives the form's submit-ready\n   * state.\n   */\n  renderActions?: (state: {\n    canSubmit: boolean;\n    isSubmitting: boolean;\n    testIdRoot: string;\n  }) => React.ReactNode;\n  /** Used to disambiguate test ids across the same screen. */\n  testIdRoot?: string;\n  /** When true, the host field is pre-filled and disabled. */\n  hostReadOnly?: boolean;\n  /**\n   * When true, a non-empty API key is required for submission regardless\n   * of the inferred backend kind.  The standard add form allows empty\n   * keys for local backends; the auth-gate screen needs to enforce one.\n   */\n  requireApiKey?: boolean;\n  /**\n   * When true, hides the name/host/API-key inputs (and related inline\n   * errors) while keeping the action row visible — used by onboarding\n   * after a successful connection probe.\n   */\n  hideConfigurationFields?: boolean;\n  /**\n   * Replace the default synchronous add/update-and-close submit with a\n   * custom async handler.  The form builds the payload, validates\n   * client-side, then hands it to this callback. If the callback throws,\n   * the form remains open so the caller can surface errors.\n   */\n  onSubmitOverride?: (payload: BackendFormSubmitPayload) => Promise<void>;\n}\n\n/**\n * Reusable form body for adding / editing a backend. Renders the\n * common name / host / API-key inputs plus the kind selector\n * (radio buttons in `add` mode, status badge in `edit` mode).\n *\n * Rendered as a `<form>`, so consumers should put any extra controls\n * either inside `renderActions` or as siblings inside a wrapping\n * element — but submission flows through the standard form submit so\n * Enter-to-submit still works.\n */\nexport function BackendForm({\n  mode,\n  backend,\n  onSubmitted,\n  renderActions,\n  testIdRoot: explicitTestIdRoot,\n  hostReadOnly,\n  requireApiKey,\n  hideConfigurationFields = false,\n  onSubmitOverride,\n}: BackendFormProps) {\n  const { t } = useTranslation(\"openhands\");\n  const { addBackend, updateBackend } = useActiveBackendContext();\n\n  // In edit mode preserve the existing backend's kind so that renaming or\n  // rotating the API key on a cloud backend (e.g. an OHE/enterprise instance\n  // on a custom domain) does not silently downgrade it to \"local\" and switch\n  // the auth header from `Authorization: Bearer` to `X-Session-API-Key`.\n  // Only infer from the host when adding a new backend.\n  const fixedKind: BackendKind | null =\n    mode === \"edit\" && backend ? backend.kind : null;\n\n  const {\n    name,\n    setName,\n    host,\n    setHost,\n    apiKey,\n    setApiKey,\n    connectionError,\n    setConnectionError,\n    isSubmitting,\n    kind: inferredKind,\n    handleSubmit: runSubmit,\n  } = useBackendForm({\n    initialName: backend?.name ?? \"\",\n    initialHost: backend?.host ?? \"\",\n    initialApiKey: backend?.apiKey ?? \"\",\n    onTestConnection: testBackendConnection,\n    onSuccess: async () => {\n      const payload: BackendFormSubmitPayload = {\n        name: name.trim(),\n        host: normalizeHost(host),\n        apiKey: apiKey.trim(),\n        kind: fixedKind ?? inferredKind,\n      };\n      if (mode === \"edit\" && backend) {\n        updateBackend(backend.id, payload);\n      } else {\n        addBackend(payload);\n      }\n      onSubmitted();\n    },\n    requireApiKey,\n    onSubmitOverride,\n  });\n\n  // Inline validation: only show errors after the user has left a field.\n  const [nameTouched, setNameTouched] = React.useState(false);\n  const [hostTouched, setHostTouched] = React.useState(false);\n\n  const kind = fixedKind ?? inferredKind;\n  const testIdRoot =\n    explicitTestIdRoot ?? (mode === \"edit\" ? \"edit-backend\" : \"add-backend\");\n\n  const needsApiKey = requireApiKey || kind !== \"local\";\n  const canSubmit =\n    name.trim().length > 0 &&\n    isValidHostUrl(host) &&\n    (!needsApiKey || apiKey.trim().length > 0);\n\n  // Error messages — only surfaced after the user has blurred the field.\n  const nameError =\n    nameTouched && !name.trim() ? t(I18nKey.BACKEND$NAME_REQUIRED) : undefined;\n  const hostError = hostTouched\n    ? !host.trim()\n      ? t(I18nKey.BACKEND$HOST_REQUIRED)\n      : !isValidHostUrl(host)\n        ? t(I18nKey.BACKEND$HOST_INVALID)\n        : undefined\n    : undefined;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    if (!canSubmit) {\n      // Mark all validated fields as touched so inline errors become visible\n      // (e.g. user pressed Enter before filling required fields).\n      setNameTouched(true);\n      setHostTouched(true);\n      return;\n    }\n    await runSubmit(event);\n  };\n\n  return (\n    <form\n      data-testid={`${testIdRoot}-form`}\n      onSubmit={handleSubmit}\n      className=\"flex flex-col gap-4\"\n    >\n      <div\n        data-testid={`${testIdRoot}-configuration-fields`}\n        className={cn(\n          \"flex flex-col gap-4\",\n          hideConfigurationFields && \"hidden\",\n        )}\n      >\n        <SettingsInput\n          testId={`${testIdRoot}-name`}\n          name={`${testIdRoot}-name`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$NAME_LABEL)}\n          value={name}\n          onChange={(value) => {\n            setName(value);\n            setConnectionError(null);\n          }}\n          onBlur={() => setNameTouched(true)}\n          // eslint-disable-next-line i18next/no-literal-string -- example placeholder, not user-facing copy\n          placeholder=\"Production\"\n          className=\"w-full\"\n          showRequiredTag\n          error={nameError}\n        />\n\n        <SettingsInput\n          testId={`${testIdRoot}-host`}\n          name={`${testIdRoot}-host`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$HOST_LABEL)}\n          value={host}\n          onChange={\n            hostReadOnly\n              ? undefined\n              : (value) => {\n                  setHost(value);\n                  setConnectionError(null);\n                }\n          }\n          onBlur={() => setHostTouched(true)}\n          placeholder={DEFAULT_OPENHANDS_CLOUD_HOST}\n          className=\"w-full\"\n          showRequiredTag\n          error={hostError}\n          isDisabled={hostReadOnly}\n        />\n\n        <SettingsInput\n          testId={`${testIdRoot}-api-key`}\n          name={`${testIdRoot}-api-key`}\n          type=\"password\"\n          label={t(I18nKey.BACKEND$KEY_LABEL)}\n          value={apiKey}\n          onChange={(value) => {\n            setApiKey(value);\n            setConnectionError(null);\n          }}\n          placeholder=\"\"\n          className=\"w-full\"\n        />\n\n        {connectionError ? (\n          <div\n            role=\"alert\"\n            data-testid={`${testIdRoot}-error`}\n            className=\"rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words\"\n          >\n            {connectionError}\n          </div>\n        ) : null}\n\n        {mode === \"edit\" && backend && (\n          <BackendStatusBadge backend={backend} testIdRoot={testIdRoot} />\n        )}\n      </div>\n\n      {renderActions ? (\n        renderActions({\n          canSubmit: canSubmit && !isSubmitting,\n          isSubmitting,\n          testIdRoot,\n        })\n      ) : (\n        <div className=\"flex justify-end gap-2 mt-2 w-full\">\n          <BrandButton\n            type=\"button\"\n            variant=\"secondary\"\n            onClick={onSubmitted}\n            testId={`${testIdRoot}-cancel`}\n          >\n            {t(I18nKey.BUTTON$CANCEL)}\n          </BrandButton>\n          <BrandButton\n            type=\"submit\"\n            variant=\"primary\"\n            isDisabled={!canSubmit || isSubmitting}\n            testId={`${testIdRoot}-submit`}\n          >\n            {t(I18nKey.BACKEND$SAVE)}\n          </BrandButton>\n        </div>\n      )}\n    </form>\n  );\n}\n\n// ── Add-mode two-column layout ──────────────────────────────────────\n\n/**\n * @spec BM-002 — Adding a backend auto-switches the active selection to it\n * (BM-001), so a backend-scoped detail page the user is viewing now belongs\n * to the previous backend. Redirect to that section's list so they never see\n * stale data, mirroring the switch-backend redirect in BackendSelector.\n */\nfunction useRedirectAfterAddBackend() {\n  const { currentPath, navigate } = useNavigation();\n  return React.useCallback(() => {\n    if (/^\\/automations\\/[^/]+/.test(currentPath)) navigate(\"/automations\");\n    else if (/^\\/conversations\\/[^/]+/.test(currentPath))\n      navigate(\"/conversations\");\n  }, [currentPath, navigate]);\n}\n\ninterface BackendConnectionOptionsProps {\n  onConnected: (payload: BackendFormSubmitPayload) => void;\n  testIdRoot?: string;\n  initialManualBackend?: Partial<\n    Pick<BackendFormSubmitPayload, \"name\" | \"host\" | \"apiKey\">\n  >;\n  requireManualApiKey?: boolean;\n  manualSubmitLabel?: React.ReactNode;\n  manualSubmittingLabel?: React.ReactNode;\n  manualSubmitTestId?: string;\n}\n\n/**\n * Manual agent-server connection plus OpenHands Cloud OAuth login.\n * Used by both the Add Backend modal and the onboarding backend step so\n * supported backend choices stay consistent across first-run and settings UI.\n */\nexport function BackendConnectionOptions({\n  onConnected,\n  testIdRoot = \"add-backend\",\n  initialManualBackend,\n  requireManualApiKey = false,\n  manualSubmitLabel,\n  manualSubmittingLabel,\n  manualSubmitTestId,\n}: BackendConnectionOptionsProps) {\n  const { t } = useTranslation(\"openhands\");\n  const lockedCloudHost = getLockedCloudHost();\n\n  if (lockedCloudHost) {\n    return (\n      <div\n        data-testid={`${testIdRoot}-connection-options`}\n        className=\"flex justify-center\"\n      >\n        <div className=\"w-full\">\n          <CloudLoginColumn\n            onConnected={onConnected}\n            testIdRoot={testIdRoot}\n            lockedHost={lockedCloudHost}\n          />\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div\n      data-testid={`${testIdRoot}-connection-options`}\n      className=\"flex flex-col gap-6 md:flex-row\"\n    >\n      <div className=\"flex-1 min-w-0\">\n        <ManualConnectionColumn\n          onConnected={onConnected}\n          testIdRoot={testIdRoot}\n          initialBackend={initialManualBackend}\n          requireApiKey={requireManualApiKey}\n          submitLabel={manualSubmitLabel ?? t(I18nKey.BACKEND$CONNECT)}\n          submittingLabel={\n            manualSubmittingLabel ??\n            t(I18nKey.ONBOARDING$BACKEND_STATUS_CHECKING)\n          }\n          submitTestId={manualSubmitTestId}\n        />\n      </div>\n\n      <div className=\"flex-1 min-w-0\">\n        <CloudLoginColumn onConnected={onConnected} testIdRoot={testIdRoot} />\n      </div>\n    </div>\n  );\n}\n\ninterface ManualConnectionColumnProps {\n  onConnected: (payload: BackendFormSubmitPayload) => void;\n  testIdRoot: string;\n  initialBackend?: Partial<\n    Pick<BackendFormSubmitPayload, \"name\" | \"host\" | \"apiKey\">\n  >;\n  requireApiKey: boolean;\n  submitLabel: React.ReactNode;\n  submittingLabel: React.ReactNode;\n  submitTestId?: string;\n}\n\n/**\n * Manual connection via Host + API Key. Designed for self-hosted agent servers\n * and self-hosted OpenHands Cloud with API key auth.\n */\nfunction ManualConnectionColumn({\n  onConnected,\n  testIdRoot,\n  initialBackend,\n  requireApiKey,\n  submitLabel,\n  submittingLabel,\n  submitTestId,\n}: ManualConnectionColumnProps) {\n  const { t } = useTranslation(\"openhands\");\n\n  const {\n    name,\n    setName,\n    host,\n    setHost,\n    apiKey,\n    setApiKey,\n    connectionError,\n    setConnectionError,\n    isSubmitting,\n    kind,\n    canSubmit,\n    handleSubmit,\n  } = useBackendForm({\n    initialName: initialBackend?.name ?? \"\",\n    initialHost: initialBackend?.host ?? \"\",\n    initialApiKey: initialBackend?.apiKey ?? \"\",\n    onTestConnection: testBackendConnection,\n    onSuccess: () => {\n      onConnected({\n        name: name.trim(),\n        host: normalizeHost(host),\n        apiKey: apiKey.trim(),\n        kind,\n      });\n    },\n    requireApiKey,\n  });\n\n  return (\n    <form\n      data-testid={`${testIdRoot}-form`}\n      onSubmit={handleSubmit}\n      className=\"flex flex-col gap-4 flex-1 min-w-0\"\n    >\n      <div className=\"flex flex-col gap-1\">\n        <SettingsInput\n          testId={`${testIdRoot}-name`}\n          name={`${testIdRoot}-name`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$NAME_LABEL)}\n          value={name}\n          onChange={(value) => {\n            setName(value);\n            setConnectionError(null);\n          }}\n          // eslint-disable-next-line i18next/no-literal-string -- example placeholder, not user-facing copy\n          placeholder=\"e.g. My Server\"\n          className=\"w-full\"\n        />\n        <p className=\"text-xs text-[var(--oh-muted)]\">\n          {t(I18nKey.BACKEND$NAME_HELPER)}\n        </p>\n      </div>\n\n      <div className=\"flex flex-col gap-1\">\n        <SettingsInput\n          testId={`${testIdRoot}-host`}\n          name={`${testIdRoot}-host`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$HOST_LABEL)}\n          value={host}\n          onChange={(value) => {\n            setHost(value);\n            setConnectionError(null);\n          }}\n          // eslint-disable-next-line i18next/no-literal-string -- example value, not translatable\n          placeholder=\"http://localhost:8000\"\n          className=\"w-full\"\n        />\n        <p\n          className=\"text-xs text-[var(--oh-muted)]\"\n          data-testid={`${testIdRoot}-host-helper`}\n        >\n          {t(I18nKey.BACKEND$HOST_HELPER)}\n        </p>\n      </div>\n\n      <SettingsInput\n        testId={`${testIdRoot}-api-key`}\n        name={`${testIdRoot}-api-key`}\n        type=\"password\"\n        label={t(I18nKey.BACKEND$KEY_LABEL)}\n        value={apiKey}\n        onChange={(value) => {\n          setApiKey(value);\n          setConnectionError(null);\n        }}\n        // eslint-disable-next-line i18next/no-literal-string -- example value, not translatable\n        placeholder=\"sk-••••••••••\"\n        className=\"w-full\"\n      />\n\n      {connectionError ? (\n        <div\n          role=\"alert\"\n          data-testid={`${testIdRoot}-error`}\n          className=\"rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words\"\n        >\n          {connectionError}\n        </div>\n      ) : null}\n\n      <BrandButton\n        type=\"submit\"\n        variant=\"secondary\"\n        isDisabled={!canSubmit || isSubmitting}\n        testId={submitTestId ?? `${testIdRoot}-submit`}\n        className=\"w-full text-center\"\n      >\n        {isSubmitting ? submittingLabel : submitLabel}\n      </BrandButton>\n    </form>\n  );\n}\n\ninterface CloudLoginColumnProps {\n  onConnected: (payload: BackendFormSubmitPayload) => void;\n  testIdRoot: string;\n  lockedHost?: string;\n}\n\n/**\n * One-click OAuth login with OpenHands Cloud. Includes an \"Advanced\"\n * disclosure for users who self-host OpenHands Cloud and need to override the\n * host.\n */\nfunction CloudLoginColumn({\n  onConnected,\n  testIdRoot,\n  lockedHost,\n}: CloudLoginColumnProps) {\n  const { t } = useTranslation(\"openhands\");\n\n  const [advancedOpen, setAdvancedOpen] = React.useState(false);\n  const [customHost, setCustomHost] = React.useState(\"\");\n\n  const effectiveHost =\n    lockedHost ?? (customHost.trim() || DEFAULT_OPENHANDS_CLOUD_HOST);\n\n  const handleLoginSuccess = (apiKey: string) => {\n    onConnected({\n      name: \"OpenHands Cloud\",\n      host: normalizeHost(effectiveHost),\n      apiKey,\n      kind: \"cloud\",\n    });\n  };\n\n  return (\n    <div className=\"flex flex-1 min-w-0 flex-col items-center gap-3\">\n      <div className=\"flex flex-col items-center gap-1\">\n        <OpenHandsLogoWhite width={56} height={56} aria-hidden />\n\n        <h4\n          className={modalTitleLgMediumClassName}\n          data-testid={`${testIdRoot}-cloud-title`}\n        >\n          {t(I18nKey.BACKEND$CLOUD_TITLE)}\n        </h4>\n      </div>\n\n      <p className=\"text-center text-sm leading-relaxed text-[var(--oh-muted)]\">\n        {t(I18nKey.BACKEND$CLOUD_DESCRIPTION)}\n      </p>\n\n      <DeviceFlowAuth\n        host={effectiveHost}\n        onSuccess={handleLoginSuccess}\n        testIdRoot={testIdRoot}\n      />\n\n      {lockedHost ? null : (\n        <div className=\"w-full\">\n          <button\n            type=\"button\"\n            onClick={() => setAdvancedOpen((open) => !open)}\n            aria-expanded={advancedOpen}\n            data-testid={`${testIdRoot}-advanced-toggle`}\n            className=\"flex w-full cursor-pointer items-center justify-center gap-1 text-center text-xs text-[var(--oh-muted)] transition-colors hover:text-content-2\"\n          >\n            <span>{t(I18nKey.BACKEND$ADVANCED)}</span>\n            <ChevronDownSmallIcon\n              className={cn(\n                \"h-4 w-4 shrink-0 text-muted transition-transform\",\n                advancedOpen && \"rotate-180\",\n              )}\n              aria-hidden\n            />\n          </button>\n          <div\n            className={cn(\n              \"pt-2\",\n              !advancedOpen && \"pointer-events-none invisible\",\n            )}\n            aria-hidden={!advancedOpen}\n          >\n            <SettingsInput\n              testId={`${testIdRoot}-cloud-host`}\n              name={`${testIdRoot}-cloud-host`}\n              type=\"text\"\n              label={t(I18nKey.BACKEND$HOST_LABEL)}\n              value={customHost}\n              onChange={setCustomHost}\n              placeholder={DEFAULT_OPENHANDS_CLOUD_HOST}\n              className=\"w-full\"\n            />\n            <p className=\"mt-1 text-xs text-[var(--oh-muted)]\">\n              {t(I18nKey.BACKEND$LOGIN_CLOUD_HINT)}\n            </p>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction AddBackendConnectionOptions({ onClose }: { onClose: () => void }) {\n  const { addBackend } = useActiveBackendContext();\n  const redirectAfterAdd = useRedirectAfterAddBackend();\n\n  const handleConnected = React.useCallback(\n    (payload: BackendFormSubmitPayload) => {\n      addBackend(payload);\n      redirectAfterAdd();\n      onClose();\n    },\n    [addBackend, redirectAfterAdd, onClose],\n  );\n\n  return <BackendConnectionOptions onConnected={handleConnected} />;\n}\n\n// ── Modal wrappers ──────────────────────────────────────────────────\n\n/**\n * Modal wrapper. In **add** mode it renders a two-column layout\n * (manual connection | OR | Cloud login). In **edit** mode it wraps\n * the standard `BackendForm`.\n */\nexport function BackendFormModal({\n  mode,\n  backend,\n  onClose,\n}: BackendFormModalProps) {\n  const { t } = useTranslation(\"openhands\");\n\n  if (mode === \"add\") {\n    return (\n      <ModalBackdrop\n        onClose={onClose}\n        closeOnEscape={false}\n        aria-label={t(I18nKey.BACKEND$ADD_TITLE)}\n      >\n        <div\n          data-testid=\"add-backend-modal\"\n          className={cn(\n            \"relative rounded-xl border border-[var(--oh-border)] bg-base-secondary\",\n            modalWidthClassName(\"xl\"),\n            MODAL_MAX_WIDTH_VIEWPORT,\n          )}\n        >\n          <ModalCloseButton onClose={onClose} testId=\"add-backend-close\" />\n          {/* Header */}\n          <div className=\"px-6 pt-6 pb-2 pr-12\">\n            <h2 className={modalTitleLgClassName}>\n              {t(I18nKey.BACKEND$ADD_TITLE)}\n            </h2>\n          </div>\n\n          <div className=\"px-6 pb-6 pt-2\">\n            <AddBackendConnectionOptions onClose={onClose} />\n          </div>\n        </div>\n      </ModalBackdrop>\n    );\n  }\n\n  // Edit mode — single-column form (unchanged)\n  const testIdRoot = \"edit-backend\";\n  return (\n    <ModalBackdrop\n      onClose={onClose}\n      closeOnEscape={false}\n      aria-label={t(I18nKey.BACKEND$EDIT_TITLE)}\n    >\n      <div\n        data-testid={`${testIdRoot}-modal`}\n        className={cn(\n          \"relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)]\",\n          modalWidthClassName(\"md\"),\n        )}\n      >\n        <ModalCloseButton onClose={onClose} testId={`${testIdRoot}-close`} />\n        <h2 className={cn(\"pr-6\", modalTitleLgClassName)}>\n          {t(I18nKey.BACKEND$EDIT_TITLE)}\n        </h2>\n        <BackendForm\n          mode=\"edit\"\n          backend={backend}\n          onSubmitted={onClose}\n          testIdRoot={testIdRoot}\n        />\n      </div>\n    </ModalBackdrop>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"backend-form-modal.cjs","names":[],"sources":["../../../../src/components/features/backends/backend-form-modal.tsx"],"sourcesContent":["import React from \"react\";\nimport { useQuery } from \"@tanstack/react-query\";\nimport { useTranslation } from \"react-i18next\";\nimport { ServerClient } from \"@openhands/typescript-client/clients\";\nimport OpenHandsLogoWhite from \"#/assets/branding/openhands-logo-white.svg?react\";\nimport { ModalBackdrop } from \"#/components/shared/modals/modal-backdrop\";\nimport {\n  MODAL_MAX_WIDTH_VIEWPORT,\n  modalWidthClassName,\n} from \"#/components/shared/modals/modal-body\";\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 { SegmentedToggle } from \"#/components/features/files-tab/segmented-toggle\";\nimport { useActiveBackendContext } from \"#/contexts/active-backend-context\";\nimport { useNavigation } from \"#/context/navigation-context\";\nimport { useBackendsHealth } from \"#/hooks/query/use-backends-health\";\nimport { useTracking } from \"#/hooks/use-tracking\";\nimport { getAgentServerClientOptions } from \"#/api/agent-server-client-options\";\nimport { getLockedCloudHost } from \"#/api/agent-server-config\";\nimport { isOpenHandsCloudHost } from \"#/api/device-flow-client\";\nimport {\n  assertAgentServerVersionIsSupported,\n  getDisplayAgentServerVersion,\n} from \"#/api/agent-server-compatibility\";\nimport ChevronDownSmallIcon from \"#/icons/chevron-down-small.svg?react\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport type { Backend, BackendKind } from \"#/api/backend-registry/types\";\nimport { getUserFacingConnectionErrorMessage } from \"#/utils/user-facing-error\";\nimport { cn } from \"#/utils/utils\";\nimport {\n  modalTitleLgClassName,\n  modalTitleLgMediumClassName,\n} from \"#/utils/modal-classes\";\nimport { getBackendStatusLabel } from \"./backend-status-label\";\nimport { BackendStatusDot } from \"./backend-status-dot\";\nimport { DeviceFlowAuth } from \"./device-flow-auth\";\n\nexport type BackendFormMode = \"add\" | \"edit\";\n\ninterface BackendFormModalProps {\n  mode: BackendFormMode;\n  /** Required when `mode === \"edit\"`. */\n  backend?: Backend;\n  onClose: () => void;\n  /** Analytics surface for the `backend_added` event (add mode only). */\n  source?: BackendAddedSource;\n}\n\n/**\n * Seed the default backend kind from the host. Uses proper hostname-suffix\n * matching (via {@link isOpenHandsCloudHost}) rather than a substring test, so\n * a look-alike host such as `all-hands-testing.dev` isn't misread as cloud.\n *\n * This is only a *default*: a self-hosted OpenHands Cloud/Enterprise instance\n * on a truly custom domain is indistinguishable from a local agent-server by\n * host alone, so the manual add form lets the user override the kind\n * explicitly (see the Type selector in ManualConnectionColumn).\n */\nfunction inferKindFromHost(host: string): BackendKind {\n  return isOpenHandsCloudHost(host) ? \"cloud\" : \"local\";\n}\n\n/**\n * Returns true for hostnames that represent a local / private-network address.\n * Used by normalizeHost to choose http:// instead of https://.\n */\nfunction isLocalAddress(hostname: string): boolean {\n  // Strip IPv6 bracket notation: [::1] → ::1\n  const h = hostname.toLowerCase().replace(/^\\[|\\]$/g, \"\");\n  // IPv6 loopback, any-address, and named loopback\n  if (h === \"localhost\" || h === \"::1\" || h === \"::\" || h === \"0.0.0.0\")\n    return true;\n  // 127.x.x.x loopback range + IPv4-mapped loopback (::ffff:127.x.x.x)\n  if (/^127\\./.test(h) || /^::ffff:127\\./i.test(h)) return true;\n  // RFC 1918 private ranges\n  if (/^10\\./.test(h)) return true;\n  if (/^192\\.168\\./.test(h)) return true;\n  if (/^172\\.(1[6-9]|2\\d|3[01])\\./.test(h)) return true;\n  // IPv6 link-local (fe80::/10) and unique local (fc00::/7)\n  if (/^fe[89ab][0-9a-f]:/i.test(h)) return true;\n  if (/^f[cd][0-9a-f]{2}:/i.test(h)) return true;\n  // mDNS / Bonjour (.local)\n  if (h.endsWith(\".local\")) return true;\n  // Single-label hostnames (no dots, no colons) are local network names.\n  // Colons are excluded so bare IPv6 addresses don't accidentally match.\n  if (!h.includes(\".\") && !h.includes(\":\")) return true;\n  return false;\n}\n\nfunction normalizeHost(host: string): string {\n  const trimmed = host.trim().replace(/\\/+$/, \"\");\n  if (!trimmed) return \"\";\n  // Already has an explicit scheme — respect it.\n  if (/^https?:\\/\\//i.test(trimmed)) return trimmed;\n  // Extract the pure hostname for scheme selection, handling three cases:\n  //   [::1]:8080  → bracket IPv6 notation → extract ::1\n  //   ::1         → bare IPv6 (multiple colons, no bracket) → whole string\n  //   host:port   → regular host:port → part before the colon\n  const bracketMatch = trimmed.match(/^\\[([^\\]]+)\\]/);\n  const hostname = bracketMatch\n    ? bracketMatch[1]\n    : (trimmed.match(/:/g) ?? []).length > 1\n      ? trimmed\n      : trimmed.split(\":\")[0];\n  const scheme = isLocalAddress(hostname) ? \"http\" : \"https\";\n  return `${scheme}://${trimmed}`;\n}\n\n/**\n * Returns true when `host` represents a reachable backend URL.\n *\n * Rules (applied in order):\n *   1. Must be non-empty after trimming.\n *   2. Must contain no whitespace — spaces can never appear in a host/port.\n *   3. After normalisation (bare hosts get `https://` prepended), must parse\n *      as a valid http or https URL with a non-empty hostname.\n */\nfunction isValidHostUrl(host: string): boolean {\n  const trimmed = host.trim();\n  if (!trimmed) return false;\n  // Spaces anywhere in the input are an immediate rejection.\n  if (/\\s/.test(trimmed)) return false;\n  const normalized = normalizeHost(trimmed);\n  if (!normalized) return false;\n  try {\n    const url = new URL(normalized);\n    return (\n      (url.protocol === \"http:\" || url.protocol === \"https:\") &&\n      url.hostname.length > 0\n    );\n  } catch {\n    return false;\n  }\n}\n\nconst DEFAULT_OPENHANDS_CLOUD_HOST = \"https://app.all-hands.dev\";\n\nexport type BackendConnectionMethod = \"manual\" | \"cloud_login\";\n\nexport type BackendAddedSource = \"add_backend_modal\" | \"manage_backends_modal\";\n\nfunction getConnectionTestFailedTitle(\n  t: ReturnType<typeof useTranslation>[\"t\"],\n  host: string,\n): string {\n  return t(I18nKey.BACKEND$CONNECTION_TEST_FAILED, {\n    host,\n    interpolation: { escapeValue: false },\n  });\n}\n\nfunction getConnectionErrorDetail(error: unknown): string | null {\n  return getUserFacingConnectionErrorMessage(error);\n}\n\nfunction getConnectionTestFailedMessage(title: string, error: unknown): string {\n  const detail = getConnectionErrorDetail(error);\n  return detail ? `${title}\\n${detail}` : title;\n}\n\nasync function testBackendConnection(\n  backend: Pick<Backend, \"host\" | \"apiKey\" | \"kind\">,\n): Promise<void> {\n  // Cloud backends authenticate via OAuth; preflight GET is not applicable.\n  if (backend.kind !== \"local\") return;\n\n  const serverInfo = await new ServerClient(\n    getAgentServerClientOptions({\n      host: backend.host,\n      sessionApiKey: backend.apiKey || null,\n      timeout: 5000,\n    }),\n  ).getServerInfo();\n  assertAgentServerVersionIsSupported(serverInfo);\n}\n\n/**\n * Live status row for the edit form: shows a connection dot, a\n * \"Local\"/\"Cloud\" label, and the agent server's reported version when\n * available. Replaces the legacy local/cloud radio fieldset (kind is\n * now inferred from the host).\n */\nfunction BackendStatusBadge({\n  backend,\n  testIdRoot,\n}: {\n  backend: Backend;\n  testIdRoot: string;\n}) {\n  const { t } = useTranslation(\"openhands\");\n  const healthByBackendId = useBackendsHealth([backend]);\n  const health = healthByBackendId[backend.id];\n  const isConnected = health?.isConnected ?? null;\n  const disabled = health?.disabled === true;\n  const consecutiveFailures = health?.consecutiveFailures ?? 0;\n  const lastError = health?.lastError ?? null;\n\n  const { data: version } = useQuery({\n    queryKey: [\"backend-version\", backend.host, backend.apiKey],\n    queryFn: async () => {\n      const info = await new ServerClient(\n        getAgentServerClientOptions({\n          host: backend.host,\n          sessionApiKey: backend.apiKey || null,\n          timeout: 5000,\n        }),\n      ).getServerInfo();\n      return getDisplayAgentServerVersion(info);\n    },\n    retry: false,\n    staleTime: 60_000,\n    enabled: backend.kind === \"local\" && !disabled,\n  });\n\n  const statusLabel = getBackendStatusLabel(t, backend, health);\n\n  const kindLabel =\n    backend.kind === \"cloud\"\n      ? t(I18nKey.BACKEND$KIND_CLOUD)\n      : t(I18nKey.BACKEND$KIND_LOCAL);\n\n  return (\n    <div className=\"flex flex-col gap-2\">\n      <div\n        data-testid={`${testIdRoot}-status`}\n        className=\"flex items-center gap-3 text-sm\"\n      >\n        <BackendStatusDot isConnected={isConnected} />\n        <span className=\"text-white\" data-testid={`${testIdRoot}-status-label`}>\n          {statusLabel}\n        </span>\n        <span className=\"text-tertiary-alt\">·</span>\n        <span className=\"text-[var(--oh-text-tertiary)]\">{kindLabel}</span>\n        {version ? (\n          <span\n            className=\"text-xs text-[var(--oh-muted)]\"\n            data-testid={`${testIdRoot}-version`}\n          >\n            {t(I18nKey.BACKEND$VERSION_LABEL, { version })}\n          </span>\n        ) : null}\n      </div>\n\n      {disabled ? (\n        <div\n          data-testid={`${testIdRoot}-status-error`}\n          className=\"flex flex-col gap-1 rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm\"\n        >\n          <span className=\"font-semibold text-red-300\">\n            {t(I18nKey.BACKEND$HEALTH_FAILED_TITLE)}\n          </span>\n          <span className=\"text-xs text-[var(--oh-text-tertiary)]\">\n            {t(I18nKey.BACKEND$HEALTH_FAILED_DETAIL, {\n              count: consecutiveFailures,\n            })}\n          </span>\n          {lastError ? (\n            <span\n              data-testid={`${testIdRoot}-status-error-message`}\n              className=\"text-xs text-red-300 whitespace-pre-wrap break-words\"\n            >\n              {lastError}\n            </span>\n          ) : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nexport interface BackendFormSubmitPayload {\n  name: string;\n  host: string;\n  apiKey: string;\n  kind: BackendKind;\n}\n\ninterface UseBackendFormOptions {\n  initialName?: string;\n  initialHost?: string;\n  initialApiKey?: string;\n  /**\n   * Called to test the connection. The hook does NOT call\n   * `testBackendConnection` directly so callers can inject a\n   * wrapped version (e.g. with extra logging or different timeout).\n   * Should throw on failure.\n   */\n  onTestConnection: (payload: BackendFormSubmitPayload) => Promise<void>;\n  /** Called after a successful connection test and persistence. */\n  onSuccess: () => void;\n  /** Require a non-empty API key even when the host looks local. */\n  requireApiKey?: boolean;\n  /**\n   * When provided, completely replaces the default submit flow\n   * (onTestConnection + onSuccess). The hook still manages form state\n   * and canSubmit validation, but the caller owns error handling and\n   * success side effects. Should throw on failure.\n   */\n  onSubmitOverride?: (payload: BackendFormSubmitPayload) => Promise<void>;\n}\n\n/**\n * Shared hook for the backend-form state used by both `BackendForm`\n * (edit/add mode) and `ManualConnectionColumn` (add-mode-only column).\n * Encapsulates name / host / apiKey fields, `connectionError`,\n * `isSubmitting`, and the shared `handleSubmit` flow.\n */\nfunction useBackendForm({\n  initialName = \"\",\n  initialHost = \"\",\n  initialApiKey = \"\",\n  onTestConnection,\n  onSuccess,\n  requireApiKey = false,\n  onSubmitOverride,\n}: UseBackendFormOptions) {\n  const { t } = useTranslation(\"openhands\");\n\n  const [name, setName] = React.useState(initialName);\n  const [host, setHost] = React.useState(initialHost);\n  const [apiKey, setApiKey] = React.useState(initialApiKey);\n  const [connectionError, setConnectionError] = React.useState<string | null>(\n    null,\n  );\n  const [isSubmitting, setIsSubmitting] = React.useState(false);\n  const [kindOverride, setKindOverride] = React.useState<BackendKind | null>(\n    null,\n  );\n\n  // Kind follows host inference until the user explicitly picks a type, then\n  // respects that choice. A custom-domain OHE can't be distinguished from a\n  // custom-domain local agent-server by host alone, so ManualConnectionColumn\n  // exposes `setKind` (a Type selector) to let the user declare it.\n  const kind = kindOverride ?? inferKindFromHost(host);\n  const needsApiKey = requireApiKey || kind !== \"local\";\n  const canSubmit =\n    name.trim().length > 0 &&\n    isValidHostUrl(host) &&\n    (!needsApiKey || apiKey.trim().length > 0);\n\n  const handleSubmit = React.useCallback(\n    async (e: React.FormEvent<HTMLFormElement>) => {\n      e.preventDefault();\n      if (!canSubmit || isSubmitting) return;\n\n      const payload: BackendFormSubmitPayload = {\n        name: name.trim(),\n        host: normalizeHost(host),\n        apiKey: apiKey.trim(),\n        kind,\n      };\n\n      setConnectionError(null);\n      setIsSubmitting(true);\n\n      try {\n        // When onSubmitOverride is provided, it completely replaces the\n        // default flow (onTestConnection + onSuccess).\n        if (onSubmitOverride) {\n          await onSubmitOverride(payload);\n        } else {\n          await onTestConnection(payload);\n          onSuccess();\n        }\n      } catch (error) {\n        setConnectionError(\n          getConnectionTestFailedMessage(\n            getConnectionTestFailedTitle(t, payload.host),\n            error,\n          ),\n        );\n      } finally {\n        setIsSubmitting(false);\n      }\n    },\n    [\n      canSubmit,\n      isSubmitting,\n      name,\n      host,\n      apiKey,\n      kind,\n      onTestConnection,\n      onSuccess,\n      requireApiKey,\n      onSubmitOverride,\n      t,\n    ],\n  );\n\n  return {\n    name,\n    setName,\n    host,\n    setHost,\n    apiKey,\n    setApiKey,\n    connectionError,\n    setConnectionError,\n    isSubmitting,\n    kind,\n    setKind: setKindOverride,\n    canSubmit,\n    handleSubmit,\n  };\n}\n\nexport interface BackendFormProps {\n  mode: BackendFormMode;\n  /** Required when `mode === \"edit\"`. */\n  backend?: Backend;\n  /**\n   * Called after the form is submitted and the backend has been\n   * persisted. Use this to dismiss a containing modal, advance an\n   * onboarding step, etc.\n   */\n  onSubmitted: () => void;\n  /**\n   * Optional render slot rendered in place of the default\n   * Save / Cancel button row, so callers (e.g. the onboarding flow)\n   * can re-skin the action area while still owning submission via the\n   * standard `<form onSubmit>` flow. Receives the form's submit-ready\n   * state.\n   */\n  renderActions?: (state: {\n    canSubmit: boolean;\n    isSubmitting: boolean;\n    testIdRoot: string;\n  }) => React.ReactNode;\n  /** Used to disambiguate test ids across the same screen. */\n  testIdRoot?: string;\n  /** When true, the host field is pre-filled and disabled. */\n  hostReadOnly?: boolean;\n  /**\n   * When true, a non-empty API key is required for submission regardless\n   * of the inferred backend kind.  The standard add form allows empty\n   * keys for local backends; the auth-gate screen needs to enforce one.\n   */\n  requireApiKey?: boolean;\n  /**\n   * When true, hides the name/host/API-key inputs (and related inline\n   * errors) while keeping the action row visible — used by onboarding\n   * after a successful connection probe.\n   */\n  hideConfigurationFields?: boolean;\n  /**\n   * Replace the default synchronous add/update-and-close submit with a\n   * custom async handler.  The form builds the payload, validates\n   * client-side, then hands it to this callback. If the callback throws,\n   * the form remains open so the caller can surface errors.\n   */\n  onSubmitOverride?: (payload: BackendFormSubmitPayload) => Promise<void>;\n}\n\n/**\n * Reusable form body for adding / editing a backend. Renders the\n * common name / host / API-key inputs plus the kind selector\n * (radio buttons in `add` mode, status badge in `edit` mode).\n *\n * Rendered as a `<form>`, so consumers should put any extra controls\n * either inside `renderActions` or as siblings inside a wrapping\n * element — but submission flows through the standard form submit so\n * Enter-to-submit still works.\n */\nexport function BackendForm({\n  mode,\n  backend,\n  onSubmitted,\n  renderActions,\n  testIdRoot: explicitTestIdRoot,\n  hostReadOnly,\n  requireApiKey,\n  hideConfigurationFields = false,\n  onSubmitOverride,\n}: BackendFormProps) {\n  const { t } = useTranslation(\"openhands\");\n  const { addBackend, updateBackend } = useActiveBackendContext();\n\n  // In edit mode preserve the existing backend's kind so that renaming or\n  // rotating the API key on a cloud backend (e.g. an OHE/enterprise instance\n  // on a custom domain) does not silently downgrade it to \"local\" and switch\n  // the auth header from `Authorization: Bearer` to `X-Session-API-Key`.\n  // Only infer from the host when adding a new backend.\n  const fixedKind: BackendKind | null =\n    mode === \"edit\" && backend ? backend.kind : null;\n\n  const {\n    name,\n    setName,\n    host,\n    setHost,\n    apiKey,\n    setApiKey,\n    connectionError,\n    setConnectionError,\n    isSubmitting,\n    kind: inferredKind,\n    handleSubmit: runSubmit,\n  } = useBackendForm({\n    initialName: backend?.name ?? \"\",\n    initialHost: backend?.host ?? \"\",\n    initialApiKey: backend?.apiKey ?? \"\",\n    onTestConnection: testBackendConnection,\n    onSuccess: async () => {\n      const payload: BackendFormSubmitPayload = {\n        name: name.trim(),\n        host: normalizeHost(host),\n        apiKey: apiKey.trim(),\n        kind: fixedKind ?? inferredKind,\n      };\n      if (mode === \"edit\" && backend) {\n        updateBackend(backend.id, payload);\n      } else {\n        addBackend(payload);\n      }\n      onSubmitted();\n    },\n    requireApiKey,\n    onSubmitOverride,\n  });\n\n  // Inline validation: only show errors after the user has left a field.\n  const [nameTouched, setNameTouched] = React.useState(false);\n  const [hostTouched, setHostTouched] = React.useState(false);\n\n  const kind = fixedKind ?? inferredKind;\n  const testIdRoot =\n    explicitTestIdRoot ?? (mode === \"edit\" ? \"edit-backend\" : \"add-backend\");\n\n  const needsApiKey = requireApiKey || kind !== \"local\";\n  const canSubmit =\n    name.trim().length > 0 &&\n    isValidHostUrl(host) &&\n    (!needsApiKey || apiKey.trim().length > 0);\n\n  // Error messages — only surfaced after the user has blurred the field.\n  const nameError =\n    nameTouched && !name.trim() ? t(I18nKey.BACKEND$NAME_REQUIRED) : undefined;\n  const hostError = hostTouched\n    ? !host.trim()\n      ? t(I18nKey.BACKEND$HOST_REQUIRED)\n      : !isValidHostUrl(host)\n        ? t(I18nKey.BACKEND$HOST_INVALID)\n        : undefined\n    : undefined;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    if (!canSubmit) {\n      // Mark all validated fields as touched so inline errors become visible\n      // (e.g. user pressed Enter before filling required fields).\n      setNameTouched(true);\n      setHostTouched(true);\n      return;\n    }\n    await runSubmit(event);\n  };\n\n  return (\n    <form\n      data-testid={`${testIdRoot}-form`}\n      onSubmit={handleSubmit}\n      className=\"flex flex-col gap-4\"\n    >\n      <div\n        data-testid={`${testIdRoot}-configuration-fields`}\n        className={cn(\n          \"flex flex-col gap-4\",\n          hideConfigurationFields && \"hidden\",\n        )}\n      >\n        <SettingsInput\n          testId={`${testIdRoot}-name`}\n          name={`${testIdRoot}-name`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$NAME_LABEL)}\n          value={name}\n          onChange={(value) => {\n            setName(value);\n            setConnectionError(null);\n          }}\n          onBlur={() => setNameTouched(true)}\n          // eslint-disable-next-line i18next/no-literal-string -- example placeholder, not user-facing copy\n          placeholder=\"Production\"\n          className=\"w-full\"\n          showRequiredTag\n          error={nameError}\n        />\n\n        <SettingsInput\n          testId={`${testIdRoot}-host`}\n          name={`${testIdRoot}-host`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$HOST_LABEL)}\n          value={host}\n          onChange={\n            hostReadOnly\n              ? undefined\n              : (value) => {\n                  setHost(value);\n                  setConnectionError(null);\n                }\n          }\n          onBlur={() => setHostTouched(true)}\n          placeholder={DEFAULT_OPENHANDS_CLOUD_HOST}\n          className=\"w-full\"\n          showRequiredTag\n          error={hostError}\n          isDisabled={hostReadOnly}\n        />\n\n        <SettingsInput\n          testId={`${testIdRoot}-api-key`}\n          name={`${testIdRoot}-api-key`}\n          type=\"password\"\n          label={t(I18nKey.BACKEND$KEY_LABEL)}\n          value={apiKey}\n          onChange={(value) => {\n            setApiKey(value);\n            setConnectionError(null);\n          }}\n          placeholder=\"\"\n          className=\"w-full\"\n        />\n\n        {connectionError ? (\n          <div\n            role=\"alert\"\n            data-testid={`${testIdRoot}-error`}\n            className=\"rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words\"\n          >\n            {connectionError}\n          </div>\n        ) : null}\n\n        {mode === \"edit\" && backend && (\n          <BackendStatusBadge backend={backend} testIdRoot={testIdRoot} />\n        )}\n      </div>\n\n      {renderActions ? (\n        renderActions({\n          canSubmit: canSubmit && !isSubmitting,\n          isSubmitting,\n          testIdRoot,\n        })\n      ) : (\n        <div className=\"flex justify-end gap-2 mt-2 w-full\">\n          <BrandButton\n            type=\"button\"\n            variant=\"secondary\"\n            onClick={onSubmitted}\n            testId={`${testIdRoot}-cancel`}\n          >\n            {t(I18nKey.BUTTON$CANCEL)}\n          </BrandButton>\n          <BrandButton\n            type=\"submit\"\n            variant=\"primary\"\n            isDisabled={!canSubmit || isSubmitting}\n            testId={`${testIdRoot}-submit`}\n          >\n            {t(I18nKey.BACKEND$SAVE)}\n          </BrandButton>\n        </div>\n      )}\n    </form>\n  );\n}\n\n// ── Add-mode two-column layout ──────────────────────────────────────\n\n/**\n * @spec BM-002 — Adding a backend auto-switches the active selection to it\n * (BM-001), so a backend-scoped detail page the user is viewing now belongs\n * to the previous backend. Redirect to that section's list so they never see\n * stale data, mirroring the switch-backend redirect in BackendSelector.\n */\nfunction useRedirectAfterAddBackend() {\n  const { currentPath, navigate } = useNavigation();\n  return React.useCallback(() => {\n    if (/^\\/automations\\/[^/]+/.test(currentPath)) navigate(\"/automations\");\n    else if (/^\\/conversations\\/[^/]+/.test(currentPath))\n      navigate(\"/conversations\");\n  }, [currentPath, navigate]);\n}\n\ninterface BackendConnectionOptionsProps {\n  onConnected: (\n    payload: BackendFormSubmitPayload,\n    connectionMethod: BackendConnectionMethod,\n  ) => void;\n  testIdRoot?: string;\n  initialManualBackend?: Partial<\n    Pick<BackendFormSubmitPayload, \"name\" | \"host\" | \"apiKey\">\n  >;\n  requireManualApiKey?: boolean;\n  manualSubmitLabel?: React.ReactNode;\n  manualSubmittingLabel?: React.ReactNode;\n  manualSubmitTestId?: string;\n}\n\n/**\n * Manual agent-server connection plus OpenHands Cloud OAuth login.\n * Used by both the Add Backend modal and the onboarding backend step so\n * supported backend choices stay consistent across first-run and settings UI.\n */\nexport function BackendConnectionOptions({\n  onConnected,\n  testIdRoot = \"add-backend\",\n  initialManualBackend,\n  requireManualApiKey = false,\n  manualSubmitLabel,\n  manualSubmittingLabel,\n  manualSubmitTestId,\n}: BackendConnectionOptionsProps) {\n  const { t } = useTranslation(\"openhands\");\n  const lockedCloudHost = getLockedCloudHost();\n\n  if (lockedCloudHost) {\n    return (\n      <div\n        data-testid={`${testIdRoot}-connection-options`}\n        className=\"flex justify-center\"\n      >\n        <div className=\"w-full\">\n          <CloudLoginColumn\n            onConnected={onConnected}\n            testIdRoot={testIdRoot}\n            lockedHost={lockedCloudHost}\n          />\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div\n      data-testid={`${testIdRoot}-connection-options`}\n      className=\"flex flex-col gap-6 md:flex-row\"\n    >\n      <div className=\"flex-1 min-w-0\">\n        <ManualConnectionColumn\n          onConnected={onConnected}\n          testIdRoot={testIdRoot}\n          initialBackend={initialManualBackend}\n          requireApiKey={requireManualApiKey}\n          submitLabel={manualSubmitLabel ?? t(I18nKey.BACKEND$CONNECT)}\n          submittingLabel={\n            manualSubmittingLabel ??\n            t(I18nKey.ONBOARDING$BACKEND_STATUS_CHECKING)\n          }\n          submitTestId={manualSubmitTestId}\n        />\n      </div>\n\n      <div className=\"flex-1 min-w-0\">\n        <CloudLoginColumn onConnected={onConnected} testIdRoot={testIdRoot} />\n      </div>\n    </div>\n  );\n}\n\ninterface ManualConnectionColumnProps {\n  onConnected: (\n    payload: BackendFormSubmitPayload,\n    connectionMethod: BackendConnectionMethod,\n  ) => void;\n  testIdRoot: string;\n  initialBackend?: Partial<\n    Pick<BackendFormSubmitPayload, \"name\" | \"host\" | \"apiKey\">\n  >;\n  requireApiKey: boolean;\n  submitLabel: React.ReactNode;\n  submittingLabel: React.ReactNode;\n  submitTestId?: string;\n}\n\n/**\n * Manual connection via Host + API Key. Designed for self-hosted agent servers\n * and self-hosted OpenHands Cloud with API key auth.\n */\nfunction ManualConnectionColumn({\n  onConnected,\n  testIdRoot,\n  initialBackend,\n  requireApiKey,\n  submitLabel,\n  submittingLabel,\n  submitTestId,\n}: ManualConnectionColumnProps) {\n  const { t } = useTranslation(\"openhands\");\n\n  const {\n    name,\n    setName,\n    host,\n    setHost,\n    apiKey,\n    setApiKey,\n    connectionError,\n    setConnectionError,\n    isSubmitting,\n    kind,\n    setKind,\n    canSubmit,\n    handleSubmit,\n  } = useBackendForm({\n    initialName: initialBackend?.name ?? \"\",\n    initialHost: initialBackend?.host ?? \"\",\n    initialApiKey: initialBackend?.apiKey ?? \"\",\n    onTestConnection: testBackendConnection,\n    onSuccess: () => {\n      onConnected(\n        {\n          name: name.trim(),\n          host: normalizeHost(host),\n          apiKey: apiKey.trim(),\n          kind,\n        },\n        \"manual\",\n      );\n    },\n    requireApiKey,\n  });\n\n  return (\n    <form\n      data-testid={`${testIdRoot}-form`}\n      onSubmit={handleSubmit}\n      className=\"flex flex-col gap-4 flex-1 min-w-0\"\n    >\n      <div className=\"flex flex-col gap-1\">\n        <SettingsInput\n          testId={`${testIdRoot}-name`}\n          name={`${testIdRoot}-name`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$NAME_LABEL)}\n          value={name}\n          onChange={(value) => {\n            setName(value);\n            setConnectionError(null);\n          }}\n          // eslint-disable-next-line i18next/no-literal-string -- example placeholder, not user-facing copy\n          placeholder=\"e.g. My Server\"\n          className=\"w-full\"\n        />\n        <p className=\"text-xs text-[var(--oh-muted)]\">\n          {t(I18nKey.BACKEND$NAME_HELPER)}\n        </p>\n      </div>\n\n      <div className=\"flex flex-col gap-1\">\n        <SettingsInput\n          testId={`${testIdRoot}-host`}\n          name={`${testIdRoot}-host`}\n          type=\"text\"\n          label={t(I18nKey.BACKEND$HOST_LABEL)}\n          value={host}\n          onChange={(value) => {\n            setHost(value);\n            setConnectionError(null);\n          }}\n          // eslint-disable-next-line i18next/no-literal-string -- example value, not translatable\n          placeholder=\"http://localhost:8000\"\n          className=\"w-full\"\n        />\n        <p\n          className=\"text-xs text-[var(--oh-muted)]\"\n          data-testid={`${testIdRoot}-host-helper`}\n        >\n          {t(I18nKey.BACKEND$HOST_HELPER)}\n        </p>\n      </div>\n\n      <div className=\"flex flex-col items-start gap-2.5\">\n        <span className=\"text-sm\">{t(I18nKey.BACKEND$KIND_LABEL)}</span>\n        <SegmentedToggle<BackendKind>\n          value={kind}\n          options={[\n            { value: \"local\", label: t(I18nKey.BACKEND$KIND_LOCAL) },\n            { value: \"cloud\", label: t(I18nKey.BACKEND$KIND_CLOUD) },\n          ]}\n          onChange={(value) => setKind(value)}\n          ariaLabel={t(I18nKey.BACKEND$KIND_LABEL)}\n          testId={`${testIdRoot}-kind`}\n        />\n      </div>\n\n      <SettingsInput\n        testId={`${testIdRoot}-api-key`}\n        name={`${testIdRoot}-api-key`}\n        type=\"password\"\n        label={t(I18nKey.BACKEND$KEY_LABEL)}\n        value={apiKey}\n        onChange={(value) => {\n          setApiKey(value);\n          setConnectionError(null);\n        }}\n        // eslint-disable-next-line i18next/no-literal-string -- example value, not translatable\n        placeholder=\"sk-••••••••••\"\n        className=\"w-full\"\n      />\n\n      {connectionError ? (\n        <div\n          role=\"alert\"\n          data-testid={`${testIdRoot}-error`}\n          className=\"rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm text-red-300 whitespace-pre-wrap break-words\"\n        >\n          {connectionError}\n        </div>\n      ) : null}\n\n      <BrandButton\n        type=\"submit\"\n        variant=\"secondary\"\n        isDisabled={!canSubmit || isSubmitting}\n        testId={submitTestId ?? `${testIdRoot}-submit`}\n        className=\"w-full text-center\"\n      >\n        {isSubmitting ? submittingLabel : submitLabel}\n      </BrandButton>\n    </form>\n  );\n}\n\ninterface CloudLoginColumnProps {\n  onConnected: (\n    payload: BackendFormSubmitPayload,\n    connectionMethod: BackendConnectionMethod,\n  ) => void;\n  testIdRoot: string;\n  lockedHost?: string;\n}\n\n/**\n * One-click OAuth login with OpenHands Cloud. Includes an \"Advanced\"\n * disclosure for users who self-host OpenHands Cloud and need to override the\n * host.\n */\nfunction CloudLoginColumn({\n  onConnected,\n  testIdRoot,\n  lockedHost,\n}: CloudLoginColumnProps) {\n  const { t } = useTranslation(\"openhands\");\n\n  const [advancedOpen, setAdvancedOpen] = React.useState(false);\n  const [customHost, setCustomHost] = React.useState(\"\");\n\n  const effectiveHost =\n    lockedHost ?? (customHost.trim() || DEFAULT_OPENHANDS_CLOUD_HOST);\n\n  const handleLoginSuccess = (apiKey: string) => {\n    onConnected(\n      {\n        name: \"OpenHands Cloud\",\n        host: normalizeHost(effectiveHost),\n        apiKey,\n        kind: \"cloud\",\n      },\n      \"cloud_login\",\n    );\n  };\n\n  return (\n    <div className=\"flex flex-1 min-w-0 flex-col items-center gap-3 pb-7\">\n      <div className=\"flex flex-col items-center gap-1\">\n        <OpenHandsLogoWhite width={56} height={56} aria-hidden />\n\n        <h4\n          className={modalTitleLgMediumClassName}\n          data-testid={`${testIdRoot}-cloud-title`}\n        >\n          {t(I18nKey.BACKEND$CLOUD_TITLE)}\n        </h4>\n      </div>\n\n      <p className=\"text-center text-sm leading-relaxed text-[var(--oh-muted)]\">\n        {t(I18nKey.BACKEND$CLOUD_DESCRIPTION)}\n      </p>\n\n      <DeviceFlowAuth\n        host={effectiveHost}\n        onSuccess={handleLoginSuccess}\n        testIdRoot={testIdRoot}\n      />\n\n      {lockedHost ? null : (\n        <div className=\"w-full\">\n          <button\n            type=\"button\"\n            onClick={() => setAdvancedOpen((open) => !open)}\n            aria-expanded={advancedOpen}\n            data-testid={`${testIdRoot}-advanced-toggle`}\n            className=\"flex w-full cursor-pointer items-center justify-center gap-1 text-center text-xs text-[var(--oh-muted)] transition-colors hover:text-content-2\"\n          >\n            <span>{t(I18nKey.BACKEND$ADVANCED)}</span>\n            <ChevronDownSmallIcon\n              className={cn(\n                \"h-4 w-4 shrink-0 text-muted transition-transform\",\n                advancedOpen && \"rotate-180\",\n              )}\n              aria-hidden\n            />\n          </button>\n          <div\n            className={cn(\n              \"pt-2\",\n              !advancedOpen && \"pointer-events-none invisible\",\n            )}\n            aria-hidden={!advancedOpen}\n          >\n            <SettingsInput\n              testId={`${testIdRoot}-cloud-host`}\n              name={`${testIdRoot}-cloud-host`}\n              type=\"text\"\n              label={t(I18nKey.BACKEND$HOST_LABEL)}\n              value={customHost}\n              onChange={setCustomHost}\n              placeholder={DEFAULT_OPENHANDS_CLOUD_HOST}\n              className=\"w-full\"\n            />\n            <p className=\"mt-1 text-xs text-[var(--oh-muted)]\">\n              {t(I18nKey.BACKEND$LOGIN_CLOUD_HINT)}\n            </p>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction AddBackendConnectionOptions({\n  onClose,\n  source,\n}: {\n  onClose: () => void;\n  source: BackendAddedSource;\n}) {\n  const { addBackend } = useActiveBackendContext();\n  const redirectAfterAdd = useRedirectAfterAddBackend();\n  const { trackBackendAdded } = useTracking();\n\n  const handleConnected = React.useCallback(\n    (\n      payload: BackendFormSubmitPayload,\n      connectionMethod: BackendConnectionMethod,\n    ) => {\n      addBackend(payload);\n      // Coarse, non-sensitive host classification — never emit the raw host.\n      const isOpenHandsCloud = payload.host === DEFAULT_OPENHANDS_CLOUD_HOST;\n      trackBackendAdded({\n        backendKind: payload.kind,\n        connectionMethod,\n        isOpenhandsCloud: isOpenHandsCloud,\n        isCustomHost: !isOpenHandsCloud,\n        hasApiKey: Boolean(payload.apiKey),\n        source,\n      });\n      redirectAfterAdd();\n      onClose();\n    },\n    [addBackend, redirectAfterAdd, onClose, trackBackendAdded, source],\n  );\n\n  return <BackendConnectionOptions onConnected={handleConnected} />;\n}\n\n// ── Modal wrappers ──────────────────────────────────────────────────\n\n/**\n * Modal wrapper. In **add** mode it renders a two-column layout\n * (manual connection | OR | Cloud login). In **edit** mode it wraps\n * the standard `BackendForm`.\n */\nexport function BackendFormModal({\n  mode,\n  backend,\n  onClose,\n  source = \"add_backend_modal\",\n}: BackendFormModalProps) {\n  const { t } = useTranslation(\"openhands\");\n\n  if (mode === \"add\") {\n    return (\n      <ModalBackdrop\n        onClose={onClose}\n        closeOnEscape={false}\n        aria-label={t(I18nKey.BACKEND$ADD_TITLE)}\n      >\n        <div\n          data-testid=\"add-backend-modal\"\n          className={cn(\n            \"relative rounded-xl border border-[var(--oh-border)] bg-base-secondary\",\n            modalWidthClassName(\"xl\"),\n            MODAL_MAX_WIDTH_VIEWPORT,\n          )}\n        >\n          <ModalCloseButton onClose={onClose} testId=\"add-backend-close\" />\n          {/* Header */}\n          <div className=\"px-6 pt-6 pb-2 pr-12\">\n            <h2 className={modalTitleLgClassName}>\n              {t(I18nKey.BACKEND$ADD_TITLE)}\n            </h2>\n          </div>\n\n          <div className=\"px-6 pb-6 pt-2\">\n            <AddBackendConnectionOptions onClose={onClose} source={source} />\n          </div>\n        </div>\n      </ModalBackdrop>\n    );\n  }\n\n  // Edit mode — single-column form (unchanged)\n  const testIdRoot = \"edit-backend\";\n  return (\n    <ModalBackdrop\n      onClose={onClose}\n      closeOnEscape={false}\n      aria-label={t(I18nKey.BACKEND$EDIT_TITLE)}\n    >\n      <div\n        data-testid={`${testIdRoot}-modal`}\n        className={cn(\n          \"relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)]\",\n          modalWidthClassName(\"md\"),\n        )}\n      >\n        <ModalCloseButton onClose={onClose} testId={`${testIdRoot}-close`} />\n        <h2 className={cn(\"pr-6\", modalTitleLgClassName)}>\n          {t(I18nKey.BACKEND$EDIT_TITLE)}\n        </h2>\n        <BackendForm\n          mode=\"edit\"\n          backend={backend}\n          onSubmitted={onClose}\n          testIdRoot={testIdRoot}\n        />\n      </div>\n    </ModalBackdrop>\n  );\n}\n"],"mappings":"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"}

package/dist/components/features/backends/backend-form-modal.d.ts

@@ -6,7 +6,11 @@ interface BackendFormModalProps {
     /** Required when `mode === "edit"`. */
     backend?: Backend;
     onClose: () => void;
+    /** Analytics surface for the `backend_added` event (add mode only). */
+    source?: BackendAddedSource;
 }
+export type BackendConnectionMethod = "manual" | "cloud_login";
+export type BackendAddedSource = "add_backend_modal" | "manage_backends_modal";
 export interface BackendFormSubmitPayload {
     name: string;
     host: string;
@@ -71,7 +75,7 @@ export interface BackendFormProps {
  */
 export declare function BackendForm({ mode, backend, onSubmitted, renderActions, testIdRoot: explicitTestIdRoot, hostReadOnly, requireApiKey, hideConfigurationFields, onSubmitOverride, }: BackendFormProps): import("react/jsx-runtime").JSX.Element;
 interface BackendConnectionOptionsProps {
-    onConnected: (payload: BackendFormSubmitPayload) => void;
+    onConnected: (payload: BackendFormSubmitPayload, connectionMethod: BackendConnectionMethod) => void;
     testIdRoot?: string;
     initialManualBackend?: Partial<Pick<BackendFormSubmitPayload, "name" | "host" | "apiKey">>;
     requireManualApiKey?: boolean;
@@ -90,5 +94,5 @@ export declare function BackendConnectionOptions({ onConnected, testIdRoot, init
  * (manual connection | OR | Cloud login). In **edit** mode it wraps
  * the standard `BackendForm`.
  */
-export declare function BackendFormModal({ mode, backend, onClose, }: BackendFormModalProps): import("react/jsx-runtime").JSX.Element;
+export declare function BackendFormModal({ mode, backend, onClose, source, }: BackendFormModalProps): import("react/jsx-runtime").JSX.Element;
 export {};