feat(chat): work-status panel, and MCP auth and settings fixes (#2776)
Adds a work-status panel beside the transcript. Context fill, model and cost, todos, running subagents and the permission requests blocking them, branch and working-tree state, MCP servers, pinned messages and context sources were scattered across the header, the composer and the context panel — a blocked subagent was reported nowhere at all. The panel reads them from live channels rather than persisted history, and becomes an overlay where the chat is too narrow to seat a column. It is on by default, including for existing installs. Because it now carries these readouts, the desktop header and composer drop the ones it duplicates: todo and changed-files chips, usage and MCP tabs. VS Code and mobile keep theirs — neither hosts the panel. Fixes MCP authorization, which was broken from the panel, invalidated by a directory switch through a redirect URI that encoded the working directory, and left the desktop app in the background because browsers will not follow a custom-protocol link without a user gesture. The settings page no longer asks the user to understand the MCP spec before adding a server: one field takes the command or the link, with the kind inferred and a visible override, and client-registration fields appear only when a server actually asks for its own credentials. Also: skills load from the panel instead of only when the composer's slash autocomplete opens; the header button names the current instance rather than falling through to the word "Instance" for relay hosts. Three new optional UI settings keys, all migrated. No change to stored MCP server configuration.
This commit is contained in:
Bohdan Triapitsyn
@@ -23,7 +23,6 @@ import {
|
||||
desktopOpenNewWindowAtUrl,
|
||||
desktopOpenNewWindowForHost,
|
||||
getDesktopHostApiUrl,
|
||||
locationMatchesHost,
|
||||
normalizeHostUrl,
|
||||
probeRelayDesktopHost,
|
||||
redactSensitiveUrl,
|
||||
@@ -31,10 +30,17 @@ import {
|
||||
type DesktopHost,
|
||||
type HostProbeResult,
|
||||
} from '@/lib/desktopHosts';
|
||||
import {
|
||||
LOCAL_HOST_ID,
|
||||
buildLocalDesktopHost,
|
||||
getLocalDesktopOrigin,
|
||||
resolveCurrentDesktopHost,
|
||||
runtimeKeyForDesktopHost,
|
||||
} from '@/lib/desktopCurrentHost';
|
||||
import { scheduleDesktopHostCandidateRefresh } from '@/lib/desktopRelayRestore';
|
||||
import { adoptRelayTunnel } from '@/lib/relay/runtime-tunnel';
|
||||
import { createRelayTunnelClient } from '@/lib/relay/tunnel-client';
|
||||
import { getRuntimeApiBaseUrl, getRuntimeKey, subscribeRuntimeEndpointChanged, switchRuntimeEndpoint } from '@/lib/runtime-switch';
|
||||
import { subscribeRuntimeEndpointChanged, switchRuntimeEndpoint } from '@/lib/runtime-switch';
|
||||
import {
|
||||
desktopSshConnect,
|
||||
desktopSshDisconnect,
|
||||
@@ -43,15 +49,9 @@ import {
|
||||
type DesktopSshInstanceStatus,
|
||||
} from '@/lib/desktopSsh';
|
||||
|
||||
const LOCAL_HOST_ID = 'local';
|
||||
const SSH_CONNECT_TIMEOUT_MS = 90_000;
|
||||
const SSH_CONNECT_CANCELLED_ERROR = 'SSH connection cancelled';
|
||||
|
||||
const runtimeKeyForHost = (host: DesktopHost): string => {
|
||||
if (host.id === LOCAL_HOST_ID) return 'local';
|
||||
return `host:${host.id}`;
|
||||
};
|
||||
|
||||
type HostStatus = {
|
||||
status: HostProbeResult['status'];
|
||||
latencyMs: number;
|
||||
@@ -83,11 +83,6 @@ const toNavigationUrl = (rawUrl: string): string => {
|
||||
}
|
||||
};
|
||||
|
||||
const getLocalOrigin = (): string => {
|
||||
if (typeof window === 'undefined') return '';
|
||||
return window.__OPENCHAMBER_LOCAL_ORIGIN__ || window.location.origin;
|
||||
};
|
||||
|
||||
const getLocalClientToken = async (): Promise<string> => {
|
||||
if (!isElectronShell()) return '';
|
||||
return desktopLocalClientTokenGet().catch(() => '');
|
||||
@@ -236,67 +231,6 @@ const waitForSshReady = async (
|
||||
throw new Error('Timed out waiting for SSH connection');
|
||||
};
|
||||
|
||||
const buildLocalHost = (localOrigin?: string | null): DesktopHost => ({
|
||||
id: LOCAL_HOST_ID,
|
||||
label: 'Local',
|
||||
url: localOrigin || getLocalOrigin(),
|
||||
});
|
||||
|
||||
const resolveCurrentHost = (hosts: DesktopHost[]) => {
|
||||
const currentHref = typeof window === 'undefined' ? '' : window.location.href;
|
||||
const localOrigin = hosts.find((host) => host.id === LOCAL_HOST_ID)?.url || getLocalOrigin();
|
||||
const runtimeApiBaseUrl = getRuntimeApiBaseUrl();
|
||||
const normalizedLocal = normalizeHostUrl(localOrigin) || localOrigin;
|
||||
const normalizedCurrent = normalizeHostUrl(currentHref) || currentHref;
|
||||
|
||||
// Relay hosts share the window origin as their (virtual) API base, so URL
|
||||
// matching can't distinguish them — identify the active relay host by its
|
||||
// stable runtime key instead.
|
||||
const activeRuntimeKey = getRuntimeKey();
|
||||
const relayMatch = hosts.find((h) => h.relay && runtimeKeyForHost(h) === activeRuntimeKey);
|
||||
if (relayMatch) {
|
||||
return { id: relayMatch.id, label: relayMatch.label, url: relayMatch.url };
|
||||
}
|
||||
|
||||
if (runtimeApiBaseUrl && locationMatchesHost(runtimeApiBaseUrl, localOrigin)) {
|
||||
return { id: LOCAL_HOST_ID, label: 'Local', url: normalizedLocal };
|
||||
}
|
||||
|
||||
const runtimeMatch = hosts.find((h) => {
|
||||
return runtimeApiBaseUrl ? locationMatchesHost(runtimeApiBaseUrl, getDesktopHostApiUrl(h)) : false;
|
||||
});
|
||||
|
||||
if (runtimeMatch) {
|
||||
return {
|
||||
id: runtimeMatch.id,
|
||||
label: runtimeMatch.label,
|
||||
url: normalizeHostUrl(getDesktopHostApiUrl(runtimeMatch)) || getDesktopHostApiUrl(runtimeMatch),
|
||||
};
|
||||
}
|
||||
|
||||
if (currentHref && locationMatchesHost(currentHref, localOrigin)) {
|
||||
return { id: LOCAL_HOST_ID, label: 'Local', url: normalizedLocal };
|
||||
}
|
||||
|
||||
const match = hosts.find((h) => {
|
||||
return currentHref ? locationMatchesHost(currentHref, h.url) : false;
|
||||
});
|
||||
|
||||
if (match) {
|
||||
return { id: match.id, label: match.label, url: normalizeHostUrl(match.url) || match.url };
|
||||
}
|
||||
|
||||
if (currentHref.startsWith('openchamber-ui://')) {
|
||||
return { id: LOCAL_HOST_ID, label: 'Local', url: normalizedLocal };
|
||||
}
|
||||
|
||||
return {
|
||||
id: 'custom',
|
||||
label: redactSensitiveUrl(normalizedCurrent || 'Instance'),
|
||||
url: normalizedCurrent,
|
||||
};
|
||||
};
|
||||
|
||||
type DesktopHostSwitcherDialogProps = {
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
@@ -342,7 +276,7 @@ export function DesktopHostSwitcherDialog({
|
||||
error: null,
|
||||
});
|
||||
const [error, setError] = React.useState<string>('');
|
||||
const [localOrigin, setLocalOrigin] = React.useState<string>(() => getLocalOrigin());
|
||||
const [localOrigin, setLocalOrigin] = React.useState<string>(() => getLocalDesktopOrigin());
|
||||
|
||||
const [editingId, setEditingId] = React.useState<string | null>(null);
|
||||
const [editLabel, setEditLabel] = React.useState('');
|
||||
@@ -352,7 +286,7 @@ export function DesktopHostSwitcherDialog({
|
||||
const sshSwitchTokenRef = React.useRef(0);
|
||||
|
||||
const allHosts = React.useMemo(() => {
|
||||
const local = buildLocalHost(localOrigin);
|
||||
const local = buildLocalDesktopHost(localOrigin);
|
||||
const normalizedRemote = configHosts.map((h) => ({
|
||||
...h,
|
||||
url: normalizeHostUrl(h.url) || h.url,
|
||||
@@ -366,7 +300,7 @@ export function DesktopHostSwitcherDialog({
|
||||
|
||||
const current = React.useMemo(() => {
|
||||
void runtimeEndpointEpoch;
|
||||
return resolveCurrentHost(allHosts);
|
||||
return resolveCurrentDesktopHost(allHosts);
|
||||
}, [allHosts, runtimeEndpointEpoch]);
|
||||
const currentDefaultLabel = React.useMemo(() => {
|
||||
const id = defaultHostId || LOCAL_HOST_ID;
|
||||
@@ -525,7 +459,7 @@ export function DesktopHostSwitcherDialog({
|
||||
switchRuntimeEndpoint({
|
||||
apiBaseUrl: typeof window !== 'undefined' ? window.location.origin : '',
|
||||
clientToken: host.clientToken || null,
|
||||
runtimeKey: runtimeKeyForHost(host),
|
||||
runtimeKey: runtimeKeyForDesktopHost(host),
|
||||
relay,
|
||||
});
|
||||
// On the relay: learn the server's current LAN address in the background
|
||||
@@ -551,7 +485,7 @@ export function DesktopHostSwitcherDialog({
|
||||
if (cached.via === 'relay' && host.relay) {
|
||||
activateRelay(host.relay);
|
||||
} else if (apiOrigin) {
|
||||
switchRuntimeEndpoint({ apiBaseUrl: apiOrigin, clientToken: clientToken || null, requestHeaders: host.requestHeaders || null, runtimeKey: runtimeKeyForHost(host) });
|
||||
switchRuntimeEndpoint({ apiBaseUrl: apiOrigin, clientToken: clientToken || null, requestHeaders: host.requestHeaders || null, runtimeKey: runtimeKeyForDesktopHost(host) });
|
||||
} else if (host.relay) {
|
||||
activateRelay(host.relay);
|
||||
}
|
||||
@@ -590,7 +524,7 @@ export function DesktopHostSwitcherDialog({
|
||||
if (transport === 'relay' && host.relay) {
|
||||
activateRelay(host.relay, relayProbeTunnel);
|
||||
} else {
|
||||
switchRuntimeEndpoint({ apiBaseUrl: apiOrigin, clientToken: clientToken || null, requestHeaders: host.requestHeaders || null, runtimeKey: runtimeKeyForHost(host) });
|
||||
switchRuntimeEndpoint({ apiBaseUrl: apiOrigin, clientToken: clientToken || null, requestHeaders: host.requestHeaders || null, runtimeKey: runtimeKeyForDesktopHost(host) });
|
||||
}
|
||||
onHostSwitched?.();
|
||||
setSwitchingHostId(null);
|
||||
|
||||
Reference in New Issue
Block a user