diff --git a/ui/src/ui/app-render.ts b/ui/src/ui/app-render.ts index a088c33ff..422af6863 100644 --- a/ui/src/ui/app-render.ts +++ b/ui/src/ui/app-render.ts @@ -42,6 +42,7 @@ import { renderNodes } from "./views/nodes"; import { renderOverview } from "./views/overview"; import { renderSessions } from "./views/sessions"; import { renderExecApprovalPrompt } from "./views/exec-approval"; +import { renderGatewayUrlConfirmation } from "./views/gateway-url-confirmation"; import { approveDevicePairing, loadDevices, @@ -578,6 +579,7 @@ export function renderApp(state: AppViewState) { : nothing} ${renderExecApprovalPrompt(state)} + ${renderGatewayUrlConfirmation(state)} `; } diff --git a/ui/src/ui/app-settings.ts b/ui/src/ui/app-settings.ts index e269742b2..7e3ab29cf 100644 --- a/ui/src/ui/app-settings.ts +++ b/ui/src/ui/app-settings.ts @@ -33,6 +33,7 @@ type SettingsHost = { basePath: string; themeMedia: MediaQueryList | null; themeMediaHandler: ((event: MediaQueryListEvent) => void) | null; + pendingGatewayUrl?: string | null; }; export function applySettings(host: SettingsHost, next: UiSettings) { @@ -98,7 +99,7 @@ export function applySettingsFromUrl(host: SettingsHost) { if (gatewayUrlRaw != null) { const gatewayUrl = gatewayUrlRaw.trim(); if (gatewayUrl && gatewayUrl !== host.settings.gatewayUrl) { - applySettings(host, { ...host.settings, gatewayUrl }); + host.pendingGatewayUrl = gatewayUrl; } params.delete("gatewayUrl"); shouldCleanUrl = true; diff --git a/ui/src/ui/app-view-state.ts b/ui/src/ui/app-view-state.ts index 069465e32..f58656bfb 100644 --- a/ui/src/ui/app-view-state.ts +++ b/ui/src/ui/app-view-state.ts @@ -73,6 +73,7 @@ export type AppViewState = { execApprovalQueue: ExecApprovalRequest[]; execApprovalBusy: boolean; execApprovalError: string | null; + pendingGatewayUrl: string | null; configLoading: boolean; configRaw: string; configRawOriginal: string; @@ -165,6 +166,8 @@ export type AppViewState = { handleNostrProfileImport: () => Promise; handleNostrProfileToggleAdvanced: () => void; handleExecApprovalDecision: (decision: "allow-once" | "allow-always" | "deny") => Promise; + handleGatewayUrlConfirm: () => void; + handleGatewayUrlCancel: () => void; handleConfigLoad: () => Promise; handleConfigSave: () => Promise; handleConfigApply: () => Promise; diff --git a/ui/src/ui/app.ts b/ui/src/ui/app.ts index d23e543cd..26f4a5836 100644 --- a/ui/src/ui/app.ts +++ b/ui/src/ui/app.ts @@ -152,6 +152,7 @@ export class MoltbotApp extends LitElement { @state() execApprovalQueue: ExecApprovalRequest[] = []; @state() execApprovalBusy = false; @state() execApprovalError: string | null = null; + @state() pendingGatewayUrl: string | null = null; @state() configLoading = false; @state() configRaw = "{\n}\n"; @@ -448,6 +449,21 @@ export class MoltbotApp extends LitElement { } } + handleGatewayUrlConfirm() { + const nextGatewayUrl = this.pendingGatewayUrl; + if (!nextGatewayUrl) return; + this.pendingGatewayUrl = null; + applySettingsInternal( + this as unknown as Parameters[0], + { ...this.settings, gatewayUrl: nextGatewayUrl }, + ); + this.connect(); + } + + handleGatewayUrlCancel() { + this.pendingGatewayUrl = null; + } + // Sidebar handlers for tool output viewing handleOpenSidebar(content: string) { if (this.sidebarCloseTimer != null) { diff --git a/ui/src/ui/views/gateway-url-confirmation.ts b/ui/src/ui/views/gateway-url-confirmation.ts new file mode 100644 index 000000000..7d48c4367 --- /dev/null +++ b/ui/src/ui/views/gateway-url-confirmation.ts @@ -0,0 +1,39 @@ +import { html, nothing } from "lit"; + +import type { AppViewState } from "../app-view-state"; + +export function renderGatewayUrlConfirmation(state: AppViewState) { + const { pendingGatewayUrl } = state; + if (!pendingGatewayUrl) return nothing; + + return html` + + `; +}