diff --git a/apps/desktop/src/app/settings/gateway-settings.test.tsx b/apps/desktop/src/app/settings/gateway-settings.test.tsx
index a42a6ed77f..31d4fe470f 100644
--- a/apps/desktop/src/app/settings/gateway-settings.test.tsx
+++ b/apps/desktop/src/app/settings/gateway-settings.test.tsx
@@ -1,4 +1,4 @@
-import { cleanup, fireEvent, render, screen, waitFor, within } from '@testing-library/react'
+import { act, cleanup, fireEvent, render, screen, waitFor, within } from '@testing-library/react'
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
// Collect the component graph before the behavioral test deadline starts.
@@ -57,6 +57,178 @@ afterEach(() => {
})
describe('GatewaySettings', () => {
+ it('releases a pending save after a late probe invalidates its response', async () => {
+ const saved = { ...localConnection, mode: 'remote', remoteUrl: 'https://a.example', remoteTokenSet: true }
+ getConnectionConfig.mockResolvedValue(saved)
+ let finishSave!: (value: typeof saved) => void
+ let finishProbe!: (value: { reachable: boolean; authMode: string; providers: never[] }) => void
+ saveConnectionConfig.mockReturnValueOnce(
+ new Promise
(resolve => {
+ finishSave = resolve
+ })
+ )
+
+ const probeConnectionConfig = vi.fn(
+ () =>
+ new Promise<{ reachable: boolean; authMode: string; providers: never[] }>(resolve => {
+ finishProbe = resolve
+ })
+ )
+
+ Object.assign(window.hermesDesktop, { probeConnectionConfig })
+ render()
+ const saveButton = (await screen.findByRole('button', { name: 'Save for next restart' })) as HTMLButtonElement
+ await waitFor(() => expect(probeConnectionConfig).toHaveBeenCalledWith('https://a.example'))
+ fireEvent.click(saveButton)
+ expect(saveConnectionConfig).toHaveBeenCalledExactlyOnceWith({
+ mode: 'remote',
+ remoteUrl: 'https://a.example',
+ remoteAuthMode: 'token',
+ remoteToken: undefined
+ })
+ expect(saveButton.disabled).toBe(true)
+ await act(async () => finishProbe({ reachable: true, authMode: 'oauth', providers: [] }))
+ await act(async () => finishSave(saved))
+ expect(saveButton.disabled).toBe(false)
+ expect(screen.getByRole('button', { name: /Sign in with/ })).toBeTruthy()
+ expect(screen.queryByPlaceholderText('Existing token saved')).toBeNull()
+ })
+
+ it('pre-saves OAuth before login and applies the resolved auth mode without requiring a test', async () => {
+ getConnectionConfig.mockResolvedValue({ ...localConnection, mode: 'remote', remoteUrl: 'https://login.example' })
+ let finishSave!: () => void
+ saveConnectionConfig.mockReturnValueOnce(
+ new Promise(resolve => {
+ finishSave = resolve
+ })
+ )
+ const oauthLoginConnectionConfig = vi.fn().mockResolvedValue({ connected: true })
+ const applyConnectionConfig = vi.fn().mockResolvedValue(localConnection)
+ const testConnectionConfig = vi.fn()
+ Object.assign(window.hermesDesktop, {
+ oauthLoginConnectionConfig,
+ applyConnectionConfig,
+ testConnectionConfig,
+ probeConnectionConfig: vi.fn().mockResolvedValue({
+ reachable: true,
+ authMode: 'oauth',
+ providers: [{ name: 'password', displayName: 'Username & Password', supportsPassword: true }]
+ })
+ })
+ render()
+ fireEvent.click(await screen.findByRole('button', { name: 'Sign in' }))
+ expect(saveConnectionConfig).toHaveBeenCalledExactlyOnceWith({
+ mode: 'remote',
+ remoteAuthMode: 'oauth',
+ remoteUrl: 'https://login.example'
+ })
+ expect(oauthLoginConnectionConfig).not.toHaveBeenCalled()
+ await act(async () => finishSave())
+ await screen.findByText('Signed in')
+ expect(oauthLoginConnectionConfig).toHaveBeenCalledExactlyOnceWith('https://login.example')
+ fireEvent.click(screen.getByRole('button', { name: 'Save and reconnect' }))
+ await waitFor(() =>
+ expect(applyConnectionConfig).toHaveBeenCalledExactlyOnceWith({
+ mode: 'remote',
+ remoteAuthMode: 'oauth',
+ remoteUrl: 'https://login.example',
+ remoteToken: undefined
+ })
+ )
+ expect(testConnectionConfig).not.toHaveBeenCalled()
+ })
+
+ it('keeps a saved token when blank and requires consent before replacing it in plaintext', async () => {
+ const saved = {
+ ...localConnection,
+ mode: 'remote',
+ remoteUrl: 'https://a.example',
+ remoteTokenSet: true,
+ remoteTokenPreview: 'saved-preview',
+ secureTokenStorage: false,
+ remoteTokenPlainText: true
+ }
+
+ getConnectionConfig.mockResolvedValue(saved)
+ saveConnectionConfig.mockResolvedValue(saved)
+ let finishSave!: (value: typeof saved) => void
+ saveConnectionConfig.mockReturnValueOnce(
+ new Promise(resolve => {
+ finishSave = resolve
+ })
+ )
+ Object.assign(window.hermesDesktop, {
+ probeConnectionConfig: vi.fn().mockResolvedValue({ reachable: true, authMode: 'token', providers: [] })
+ })
+ render()
+ await screen.findByPlaceholderText('Existing token saved-preview')
+ fireEvent.click(screen.getByRole('button', { name: 'Save for next restart' }))
+ await waitFor(() =>
+ expect(saveConnectionConfig).toHaveBeenCalledExactlyOnceWith({
+ mode: 'remote',
+ remoteUrl: 'https://a.example',
+ remoteAuthMode: 'token',
+ remoteToken: undefined
+ })
+ )
+ // Flush the save's reset and probe effects before acquiring the replacement field.
+ await act(async () => finishSave(saved))
+ const tokenInput = await screen.findByPlaceholderText('Existing token saved-preview')
+ expect(tokenInput.isConnected, 'saved credential control must survive the refresh probe').toBe(true)
+ fireEvent.change(tokenInput, { target: { value: 'replacement' } })
+ fireEvent.click(screen.getByRole('button', { name: 'Save for next restart' }))
+ await screen.findByText('Store the gateway token in plain text?')
+ expect(saveConnectionConfig).toHaveBeenCalledTimes(1)
+ fireEvent.click(screen.getByRole('button', { name: 'Save as plain text' }))
+ await waitFor(() =>
+ expect(saveConnectionConfig).toHaveBeenLastCalledWith({
+ mode: 'remote',
+ remoteUrl: 'https://a.example',
+ remoteAuthMode: 'token',
+ remoteToken: 'replacement',
+ allowPlainTextToken: true
+ })
+ )
+ })
+
+ it('discards an old token test while saving the current credential-ready payload', async () => {
+ getConnectionConfig.mockResolvedValue({ ...localConnection, mode: 'remote', remoteUrl: 'https://a.example' })
+ const probeConnectionConfig = vi.fn().mockResolvedValue({ reachable: true, authMode: 'token', providers: [] })
+ let finishTest!: (value: { ok: boolean; baseUrl: string }) => void
+
+ const testConnectionConfig = vi.fn().mockReturnValue(
+ new Promise<{ ok: boolean; baseUrl: string }>(resolve => {
+ finishTest = resolve
+ })
+ )
+
+ Object.assign(window.hermesDesktop, { probeConnectionConfig, testConnectionConfig })
+ render()
+ const token = await screen.findByPlaceholderText('Paste session token')
+ fireEvent.change(token, { target: { value: 'old-token' } })
+ fireEvent.click(screen.getByRole('button', { name: 'Test remote' }))
+ expect(testConnectionConfig).toHaveBeenCalledWith({
+ mode: 'remote',
+ remoteUrl: 'https://a.example',
+ remoteAuthMode: 'token',
+ remoteToken: 'old-token'
+ })
+ fireEvent.change(token, { target: { value: 'new-token' } })
+ await act(async () => finishTest({ ok: true, baseUrl: 'https://a.example' }))
+ expect(screen.queryByText('Connected to https://a.example')).toBeNull()
+ fireEvent.click(screen.getByRole('button', { name: 'Save for next restart' }))
+ await waitFor(() =>
+ expect(saveConnectionConfig).toHaveBeenCalledWith(
+ expect.objectContaining({
+ mode: 'remote',
+ remoteUrl: 'https://a.example',
+ remoteAuthMode: 'token',
+ remoteToken: 'new-token'
+ })
+ )
+ )
+ })
+
it('keeps saved Cloud instances usable without discovery and marks the live source, not the default', async () => {
getConnectionConfig.mockResolvedValue({ ...localConnection, mode: 'cloud', remoteUrl: 'https://a.example' })
registry.value = {
diff --git a/apps/desktop/src/app/settings/gateway-settings.tsx b/apps/desktop/src/app/settings/gateway-settings.tsx
index ac5a2b43d2..5409a87c41 100644
--- a/apps/desktop/src/app/settings/gateway-settings.tsx
+++ b/apps/desktop/src/app/settings/gateway-settings.tsx
@@ -1,12 +1,14 @@
import { useStore } from '@nanostores/react'
-import { useEffect, useMemo, useRef, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
+import { RemoteSetupFields } from '@/components/remote-setup/fields'
+import { useRemoteSetup } from '@/components/remote-setup/use-remote-setup'
import { Button } from '@/components/ui/button'
import { ConfirmDialog } from '@/components/ui/confirm-dialog'
import { Input } from '@/components/ui/input'
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
import { Tip } from '@/components/ui/tooltip'
-import type { DesktopAuthProvider, DesktopCloudAgent, DesktopCloudOrg, DesktopConnectionProbeResult } from '@/global'
+import type { DesktopCloudAgent, DesktopCloudOrg, DesktopConnectionConfigInput } from '@/global'
import { useI18n } from '@/i18n'
import { ExternalLink } from '@/lib/external-link'
import {
@@ -41,7 +43,6 @@ import { enrichSelectedSshHost, selectSshHost } from './ssh-host-selection'
type Mode = 'local' | 'remote' | 'cloud' | 'ssh'
type AuthMode = 'oauth' | 'token'
-type ProbeStatus = 'idle' | 'probing' | 'done' | 'error'
// Hermes Cloud discovery lifecycle for the cloud-mode panel.
type CloudDiscoverStatus = 'idle' | 'loading' | 'done' | 'error'
@@ -164,15 +165,24 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
const [loading, setLoading] = useState(true)
const [saving, setSaving] = useState(false)
const [testing, setTesting] = useState(false)
- const [signingIn, setSigningIn] = useState(false)
const [state, setState] = useState(EMPTY_STATE)
- const [remoteToken, setRemoteToken] = useState('')
+
+ const remote = useRemoteSetup({
+ host: 'settings',
+ enabled: !loading && state.mode === 'remote',
+ beforeOAuthLogin: async (payload: DesktopConnectionConfigInput): Promise => {
+ await window.hermesDesktop.saveConnectionConfig(payload)
+ },
+ onNotice: notify
+ })
+
const [lastTest, setLastTest] = useState(null)
const [sshHostSuggestions, setSshHostSuggestions] = useState([])
const [sshCustomHost, setSshCustomHost] = useState(false)
const sshResolveSeq = useRef(0)
const sshTestSeq = useRef(0)
const saveSeq = useRef(0)
+ const saveOwner = useRef(null)
const signingSeq = useRef(0)
const cloudConnectSeq = useRef(0)
const contextSeq = useRef(0)
@@ -224,10 +234,17 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
}
}
- const acceptSavedConfig = (config: GatewaySettingsState) => {
+ const acceptSavedConfig = (config: GatewaySettingsState): void => {
const normalized = normalizeGatewaySettingsState(config)
setState(normalized)
+ remote.reset({
+ url: normalized.remoteUrl,
+ authMode: normalized.remoteAuthMode,
+ oauthConnected: normalized.remoteOauthConnected,
+ tokenSet: normalized.remoteTokenSet,
+ tokenPreview: normalized.remoteTokenPreview
+ })
}
// When set, the plain-text opt-in dialog is open; `apply` remembers whether
@@ -261,13 +278,6 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
setCloudOrgState(value)
}
- // Auth-mode probe: as the user types a remote URL we ask the gateway (via
- // its public /api/status) whether it gates with OAuth or a static session
- // token, so we can show the right control (login button vs token box).
- const [probeStatus, setProbeStatus] = useState('idle')
- const [probe, setProbe] = useState(null)
- const probeSeq = useRef(0)
-
useEffect(() => {
let cancelled = false
const desktop = window.hermesDesktop
@@ -300,12 +310,6 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
// eslint-disable-next-line react-hooks/exhaustive-deps -- load once on mount; copy is stable
}, [])
- // Debounced probe of the entered remote URL. Only runs in remote mode with a
- // syntactically plausible URL. The probe result drives whether we render the
- // OAuth login button or the session-token entry box. The effective auth mode
- // prefers a fresh probe result over the saved value.
- const trimmedUrl = coerceRemoteUrlScheme(state.remoteUrl)
-
const savedAgent = (agent: DesktopCloudAgent) =>
registry?.connections.find(
connection =>
@@ -330,105 +334,6 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
}
}
- useEffect(() => {
- if (state.mode !== 'remote' || !trimmedUrl || !/^https?:\/\//i.test(trimmedUrl)) {
- setProbeStatus('idle')
- setProbe(null)
-
- return
- }
-
- const desktop = window.hermesDesktop
-
- if (!desktop?.probeConnectionConfig) {
- return
- }
-
- const seq = ++probeSeq.current
- setProbeStatus('probing')
-
- const timer = setTimeout(() => {
- desktop
- .probeConnectionConfig(trimmedUrl)
- .then(result => {
- if (seq !== probeSeq.current) {
- return
- }
-
- setProbe(result)
- setProbeStatus(result.reachable ? 'done' : 'error')
- })
- .catch(() => {
- if (seq !== probeSeq.current) {
- return
- }
-
- setProbe(null)
- setProbeStatus('error')
- })
- }, 500)
-
- return () => clearTimeout(timer)
- }, [state.mode, trimmedUrl])
-
- // Effective auth mode: a reachable probe wins; otherwise fall back to the
- // saved config's mode so a re-open of settings doesn't flicker.
- const authMode: AuthMode = useMemo(() => {
- if (probeStatus === 'done' && probe && probe.authMode !== 'unknown') {
- return probe.authMode
- }
-
- return state.remoteAuthMode
- }, [probe, probeStatus, state.remoteAuthMode])
-
- // Whether we actually KNOW how this gateway authenticates yet. Until we do,
- // neither the OAuth button nor the session-token box should render —
- // `authMode` defaults to 'token', so without this gate the token box flashes
- // for every gateway (including OAuth ones) during the idle/probing window
- // before the first probe lands. The scheme is known when either:
- // * the live probe finished (probeStatus 'done'), or
- // * we're idle but showing a previously-saved remote config (re-opening
- // settings for a gateway already signed-in or with a saved token), so
- // its control appears immediately with no flicker.
- // While probing (or after a probe error), the scheme is unknown and we show
- // the probe status row instead of a control.
- const hasSavedRemote = state.remoteTokenSet || state.remoteOauthConnected
-
- const authResolved = useMemo(() => {
- if (probeStatus === 'done') {
- return true
- }
-
- return probeStatus === 'idle' && hasSavedRemote
- }, [probeStatus, hasSavedRemote])
-
- const providerLabel = useMemo(() => {
- const providers: DesktopAuthProvider[] = probe?.providers ?? []
-
- if (providers.length === 1) {
- return providers[0].displayName || providers[0].name
- }
-
- if (providers.length > 1) {
- return providers.map(p => p.displayName || p.name).join(' / ')
- }
-
- return t.boot.failure.identityProvider
- }, [probe, t.boot.failure.identityProvider])
-
- // A username/password gateway authenticates through a credential form on the
- // gateway's /login page (POST /auth/password-login) rather than an OAuth
- // redirect. Everything downstream — the session cookie, the ws-ticket mint,
- // the persistent partition — is identical, so the desktop drives it through
- // the same sign-in window; only the button copy changes. We treat the
- // gateway as password-style only when EVERY advertised provider supports
- // password, so a mixed deployment keeps the generic OAuth copy.
- const isPasswordProvider = useMemo(() => {
- const providers: DesktopAuthProvider[] = probe?.providers ?? []
-
- return providers.length > 0 && providers.every(p => p.supportsPassword)
- }, [probe])
-
useEffect(() => {
// One-directional: a saved host that isn't in the suggestions must render
// the free-text input (rehydration). Never force custom OFF here — that
@@ -472,6 +377,9 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
setLastTest(null)
}, [
state.mode,
+ remote.credentials.url,
+ remote.credentials.token,
+ remote.credentials.authMode,
state.sshHost,
state.sshUser,
state.sshPort,
@@ -480,33 +388,21 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
state.sshRemoteProfile
])
- const oauthConnected = state.remoteOauthConnected
-
- const canUseRemote = useMemo(() => {
- if (!trimmedUrl) {
- return false
- }
-
- if (authMode === 'oauth') {
- return oauthConnected
- }
-
- return Boolean(remoteToken.trim()) || state.remoteTokenSet
- }, [authMode, oauthConnected, remoteToken, state.remoteTokenSet, trimmedUrl])
-
- const payload = (allowPlainTextToken?: boolean) => ({
- mode: state.mode,
- remoteAuthMode: authMode,
- remoteToken: authMode === 'token' ? remoteToken.trim() || undefined : undefined,
- remoteUrl: trimmedUrl,
- sshHost: state.sshHost.trim(),
- sshUser: state.sshUser.trim() || undefined,
- sshPort: state.sshPort,
- sshKeyPath: state.sshKeyPath.trim() || undefined,
- sshRemoteHermesPath: state.sshRemoteHermesPath.trim(),
- // Preserve an intentional blank so an existing remote-profile mapping can
- // be cleared instead of being mistaken for an omitted field.
- sshRemoteProfile: state.sshRemoteProfile.trim(),
+ const payload = (allowPlainTextToken?: boolean): DesktopConnectionConfigInput => ({
+ ...(state.mode === 'remote'
+ ? remote.payload
+ : {
+ mode: state.mode,
+ remoteAuthMode: state.remoteAuthMode,
+ remoteUrl: coerceRemoteUrlScheme(state.remoteUrl),
+ sshHost: state.sshHost.trim(),
+ sshUser: state.sshUser.trim() || undefined,
+ sshPort: state.sshPort,
+ sshKeyPath: state.sshKeyPath.trim() || undefined,
+ sshRemoteHermesPath: state.sshRemoteHermesPath.trim(),
+ // A blank clears an existing remote-profile mapping.
+ sshRemoteProfile: state.sshRemoteProfile.trim()
+ }),
...(allowPlainTextToken ? { allowPlainTextToken: true } : {})
})
@@ -515,13 +411,14 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
// and this machine has no OS keyring (safeStorage unavailable). In that case
// we must get an explicit opt-in before persisting.
const wouldPersistPlainTextToken =
- (state.mode === 'remote' || state.mode === 'cloud') &&
- authMode !== 'oauth' &&
- Boolean(remoteToken.trim()) &&
+ state.mode === 'remote' &&
+ remote.credentials.authMode === 'token' &&
+ Boolean(remote.credentials.token.trim()) &&
state.secureTokenStorage === false
- const performSave = async (apply: boolean, allowPlainTextToken: boolean) => {
+ const performSave = async (apply: boolean, allowPlainTextToken: boolean): Promise => {
const seq = ++saveSeq.current
+ saveOwner.current = seq
setSaving(true)
try {
@@ -534,7 +431,6 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
}
acceptSavedConfig(next)
- setRemoteToken('')
notify({
kind: 'success',
title: apply ? g.restartingTitle : g.savedTitle,
@@ -574,18 +470,20 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
notifyError(err, apply ? g.applyFailed : g.saveFailed)
}
} finally {
- if (seq === saveSeq.current) {
+ // A stale response cannot replace the draft, but its request must release busy state.
+ if (seq === saveOwner.current) {
+ saveOwner.current = null
setSaving(false)
}
}
}
- const save = async (apply: boolean) => {
- if (state.mode === 'remote' && !canUseRemote) {
+ const save = async (apply: boolean): Promise => {
+ if (state.mode === 'remote' && !remote.canCommit) {
notify({
kind: 'warning',
title: g.incompleteTitle,
- message: authMode === 'oauth' ? g.incompleteSignIn : g.incompleteToken
+ message: remote.credentials.authMode === 'oauth' ? g.incompleteSignIn : g.incompleteToken
})
return
@@ -601,94 +499,6 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
await performSave(apply, false)
}
- // OAuth sign-in: persist the URL + oauth mode first (so the saved config has
- // the URL the login window needs), then open the gateway login window and
- // refresh the connection status from the saved config once it completes.
- const signIn = async () => {
- const seq = ++signingSeq.current
-
- if (!trimmedUrl) {
- notify({ kind: 'warning', title: g.incompleteTitle, message: g.enterUrlFirst })
-
- return
- }
-
- setSigningIn(true)
-
- try {
- // Save (don't apply/restart) so the login window has a URL to use and the
- // oauth mode is persisted, without yet flipping the live connection.
- const saved = await window.hermesDesktop.saveConnectionConfig({
- mode: state.mode,
- remoteAuthMode: 'oauth',
- remoteUrl: trimmedUrl
- })
-
- if (seq !== signingSeq.current) {
- return
- }
-
- acceptSavedConfig(saved)
-
- const result = await window.hermesDesktop.oauthLoginConnectionConfig(trimmedUrl)
-
- if (seq !== signingSeq.current) {
- return
- }
-
- if (result.connected) {
- const refreshed = await window.hermesDesktop.getConnectionConfig(null)
- acceptSavedConfig(refreshed)
- notify({ kind: 'success', title: g.signedIn, message: g.connectedTo(providerLabel) })
- } else {
- notify({
- kind: 'warning',
- title: t.boot.failure.signInIncompleteTitle,
- message: result?.error
- ? `${t.boot.failure.signInIncompleteMessage}: ${result.error}`
- : t.boot.failure.signInIncompleteMessage
- })
- }
- } catch (err) {
- if (seq === signingSeq.current) {
- notifyError(err, g.signInFailed)
- }
- } finally {
- if (seq === signingSeq.current) {
- setSigningIn(false)
- }
- }
- }
-
- const signOut = async () => {
- if (!trimmedUrl) {
- return
- }
-
- const seq = ++signingSeq.current
- setSigningIn(true)
-
- try {
- await window.hermesDesktop.oauthLogoutConnectionConfig(trimmedUrl)
- const refreshed = await window.hermesDesktop.getConnectionConfig(null)
-
- if (seq !== signingSeq.current) {
- return
- }
-
- acceptSavedConfig(refreshed)
- notify({ kind: 'success', title: g.signedOutTitle, message: g.signedOutMessage })
- } catch (err) {
- if (seq === signingSeq.current) {
- notifyError(err, g.signOutFailed)
- }
- } finally {
- if (seq === signingSeq.current) {
- setSigningIn(false)
- }
- }
- }
-
// --- Hermes Cloud handlers ---
// Pull the discovered agent list over the shared portal session. Tolerant of
@@ -1054,48 +864,6 @@ export function GatewaySettings({ embedded = false }: { embedded?: boolean } = {
}
}
- const testRemote = async () => {
- const seq = ++sshTestSeq.current
-
- if (!canUseRemote) {
- notify({
- kind: 'warning',
- title: g.incompleteTitle,
- message: authMode === 'oauth' ? g.incompleteSignInTest : g.incompleteTokenTest
- })
-
- return
- }
-
- setTesting(true)
- setLastTest(null)
-
- try {
- const result = await window.hermesDesktop.testConnectionConfig({
- mode: 'remote',
- remoteAuthMode: authMode,
- remoteToken: authMode === 'token' ? remoteToken.trim() || undefined : undefined,
- remoteUrl: trimmedUrl
- })
-
- if (seq !== sshTestSeq.current) {
- return
- }
-
- const message = g.connectedTo(result.baseUrl || trimmedUrl, result.version ?? undefined)
- setLastTest(message)
- notify({ kind: 'success', title: g.reachableTitle, message })
- } catch (err) {
- if (seq === sshTestSeq.current) {
- notifyError(err, g.testFailed)
- }
- } finally {
- if (seq === sshTestSeq.current) {
- setTesting(false)
- }
- }
- }
-
if (loading) {
return (
- setState(current => ({ ...current, remoteUrl: event.target.value }))}
- placeholder="https://gateway.example.com/hermes"
- value={state.remoteUrl}
- />
- }
- description={g.remoteUrlDesc}
- title={g.remoteUrlTitle}
- />
-
- {state.mode === 'remote' && probeStatus === 'probing' ? (
-
-
- {g.probing}
+
+
+ {remote.credentials.authMode === 'token' && state.remoteTokenPlainText ? (
+
+
{g.plainTextStoredTitle}
+
{g.plainTextStoredDesc}
) : null}
-
- {state.mode === 'remote' && probeStatus === 'error' ? (
-
- ) : null}
-
- {/* OAuth / password gateways: present a sign-in button + connection status. */}
- {state.mode === 'remote' && authResolved && authMode === 'oauth' ? (
-
-
- {g.signedIn}
-
-
-
- ) : (
-
- )
- }
- description={
- oauthConnected
- ? isPasswordProvider
- ? g.authSignedInPassword
- : g.authSignedInOauth
- : isPasswordProvider
- ? g.authNeedsPassword
- : g.authNeedsOauth(providerLabel)
- }
- title={g.authTitle}
- />
- ) : null}
-
- {/* Session-token gateways: keep the existing token entry box. */}
- {state.mode === 'remote' && authResolved && authMode === 'token' ? (
- <>
-
setRemoteToken(event.target.value)}
- placeholder={
- state.remoteTokenSet
- ? g.existingToken(state.remoteTokenPreview ?? g.savedToken)
- : g.pasteSessionToken
- }
- type="password"
- value={remoteToken}
- />
- }
- description={g.tokenDesc}
- title={g.tokenTitle}
- />
-
- {/* The saved token is on disk in plain text (no OS keyring). Same
- banner idiom as envOverride so it reads as a real warning. */}
- {state.remoteTokenPlainText ? (
-
-
-
-
{g.plainTextStoredTitle}
-
{g.plainTextStoredDesc}
-
-
-
-
-
-
-
{copy.remoteSetupTitle}
-
{copy.remoteSetupDesc}
-
-
-
-
-
-
- {probeStatus === 'probing' ? (
-
-
- {copy.probing}
-
- ) : null}
-
- {probeStatus === 'error' ? (
-
-
-
{probe?.error || copy.probeError}
-
- ) : null}
-
- {authResolved && authMode === 'oauth' ? (
-
-
-
-
{copy.authTitle}
-
- {oauthConnected ? copy.authSignedIn : copy.authNeedsOauth(providerLabel)}
-
-
- {oauthConnected ? (
-
-
- {copy.connected}
-
- ) : (
-
- )}
-
-
- ) : null}
-
- {authResolved && authMode === 'token' ? (
-
- ) : null}
-
- {error ? (
-
- ) : null}
-
- {success ? (
-
-
- {success}
-
- ) : null}
-
-
-
-
-
-
-
-
-
-
-
+ {title}
+ {children}
+ {description ? {description} : null}
+
+ ) : (
+
+ )
+}
+
+interface RemoteSetupFieldsProps {
+ setup: RemoteSetup
+ disabled?: boolean
+ urlOnly?: boolean
+ onUrlChange?: () => void
+}
+
+export function RemoteSetupFields({
+ setup,
+ disabled = false,
+ urlOnly = false,
+ onUrlChange
+}: RemoteSetupFieldsProps): ReactElement {
+ const { t } = useI18n()
+ const g = t.settings.gateway
+ const firstRun = setup.host === 'first-run'
+ const registry = setup.host === 'registry'
+ const copy = firstRun ? t.install : g
+ const { credentials, isPassword, providerLabel } = setup
+ const urlTitle = registry ? t.settings.connections.urlTitle : copy.remoteUrlTitle
+
+ const authDescription = firstRun
+ ? credentials.oauthConnected
+ ? t.install.authSignedIn
+ : t.install.authNeedsOauth(providerLabel)
+ : credentials.oauthConnected
+ ? isPassword
+ ? g.authSignedInPassword
+ : g.authSignedInOauth
+ : isPassword
+ ? g.authNeedsPassword
+ : g.authNeedsOauth(providerLabel)
+
+ return (
+
+
+ {
+ setup.setUrl(event.target.value)
+ onUrlChange?.()
+ }}
+ placeholder={registry ? 'http://homelab.lan:9119' : t.install.remoteUrlPlaceholder}
+ value={credentials.url}
+ />
+
+ {!registry && setup.probeStatus === 'probing' ? (
+
+
+ {copy.probing}
+
+ ) : null}
+ {!registry && setup.probeStatus === 'error' ? (
+
+ ) : null}
+ {registry && !urlOnly ? (
+
+
+ {(['token', 'oauth'] as const).map(mode => (
+
+ ))}
+
+
+ ) : null}
+ {!urlOnly && setup.authResolved && credentials.authMode === 'oauth' ? (
+
+ {credentials.oauthConnected ? (
+
+
+
+ {firstRun ? t.install.connected : g.signedIn}
+
+ {setup.host === 'settings' ? (
+
+ ) : null}
+
+ ) : null}
+ {!urlOnly && setup.authResolved && credentials.authMode === 'token' ? (
+
+ setup.setToken(event.target.value)}
+ placeholder={
+ credentials.tokenSet ? g.existingToken(credentials.tokenPreview ?? g.savedToken) : copy.pasteSessionToken
+ }
+ type="password"
+ value={credentials.token}
+ />
+
+ ) : null}
+ {setup.error ?
{setup.error}
: null}
+ {setup.success ?
{setup.success}
: null}
+
+
+
+
+
+
{copy.remoteSetupTitle}
+
{copy.remoteSetupDesc}
+
+
+
+
+ {error ?
{error}
: null}
+
+
+
+
+
+
+
+
+
+