@antelopejs/dms-ai 0.1.2 → 0.1.4

package/frontend-vue/app/plugins/ai.client.ts

@@ -4,85 +4,131 @@ import {
 	useDmsRouter,
 } from '#dms/frontend-module'
 import {
-	SIDECAR_HOST_NAME,
+	type ChannelClient,
+	createChannelClient,
+} from '../runtime/channel-client'
+import {
+	createChatTransport,
+	exposeChatTransport,
+} from '../runtime/chat-transport'
+import {
+	CHANNEL_IDLE_STOP_MS,
+	CHANNEL_STATUS_RECONNECTING,
+	CHAT_CHANNEL,
+	CHATBOX_PATH,
+	HELLO_MESSAGE_TYPE,
+	HOST_CHANNEL,
+	HOST_ROLE,
+	JSON_CONTENT_TYPE,
 	SIDECAR_INFO_PATH,
-	SIDECAR_PROBE_HOST,
 	SIDECAR_STATUS_CONNECTED,
 	SIDECAR_STATUS_REVIVING,
 	SIDECAR_STATUS_UNAVAILABLE,
-	WS_STATUS_CONNECTED,
-	WS_STATUS_CONNECTING,
+	VISIBILITY_CHANGE_EVENT,
 } from '../runtime/constants'
-import { installCurrentPageTracker } from '../runtime/current-page'
+import {
+	buildCurrentPageUpdate,
+	installCurrentPageTracker,
+} from '../runtime/current-page'
 import { registerLauncherAction } from '../runtime/header-action'
-import { createHostCommandDispatcher } from '../runtime/host-commands'
+import {
+	createHostCommandDispatcher,
+	type HostCommandDispatcher,
+} from '../runtime/host-commands'
 import { installNavigationCompleteEmitter } from '../runtime/navigation-complete'
-import { injectOverlay } from '../runtime/overlay'
+import { injectOverlay, type OverlayHandle } from '../runtime/overlay'
 import { runWhenLoggedIn } from '../runtime/session-gate'
 import { installToggleShortcut } from '../runtime/shortcuts'
 import {
 	createSidecarStatusController,
 	type SidecarStatus,
+	type SidecarStatusController,
 } from '../runtime/sidecar-status'
-import { createHostWsClient } from '../runtime/ws-client'
 
-function buildIframeUrl(port: number, token: string): string {
+type AuthFetch = ReturnType<typeof useAuthFetch>['$authFetch']
+
+interface ChannelDeps {
+	$authFetch: AuthFetch
+	controller: SidecarStatusController
+	dispatchHostCommand: HostCommandDispatcher
+}
+
+function buildIframeUrl(): string {
 	// Seed the chatbox with the host's current light/dark mode so its very first
 	// paint matches; the theme bridge keeps it in sync from there on.
 	const mode = document.documentElement.classList.contains('dark')
 		? 'dark'
 		: 'light'
-	return `${SIDECAR_PROBE_HOST}:${port}/?theme=${mode}#token=${encodeURIComponent(token)}`
+	return `${CHATBOX_PATH}?theme=${mode}`
 }
 
-async function startAssistant({ vueApp }: DmsAppContext): Promise<void> {
-	const { $authFetch } = useAuthFetch()
-	const controller = createSidecarStatusController(() =>
-		$authFetch(SIDECAR_INFO_PATH),
-	)
-	// A null/disabled first probe means the assistant shouldn't appear at all —
-	// preserve the previous "no icon, no overlay" behavior in that case.
-	if (!(await controller.init())) return
-	const overlay = injectOverlay()
-	if (overlay === null) return
-
-	installToggleShortcut({ onToggle: () => overlay.toggleOpen() })
-	// Registered unconditionally (even while reviving) so the launcher is present
-	// through an outage; opening it surfaces the panel's own status placeholder.
-	registerLauncherAction(() => overlay.toggleFromLauncher())
-
-	const router = useDmsRouter()
-	// Host-side dev hot reload. A page the agent just wrote is re-registered
-	// asynchronously, so every overlay-driven navigation waits for the committed
-	// site layout to serve the route before pushing it.
-	const devReload = useDmsDevReload()
-	// Serialized so a burst of navigate commands cannot land out of order.
-	const dispatchHostCommand = createHostCommandDispatcher({ router, devReload })
-	const hostWs = createHostWsClient({
-		sidecarHost: SIDECAR_HOST_NAME,
-		getPort: () => controller.getPort(),
-		getClientToken: () => controller.getClientToken(),
-		onMessage: dispatchHostCommand,
+function createAssistantChannel(deps: ChannelDeps): ChannelClient {
+	const chat = createChatTransport({
+		send: (msg) => channel.send(CHAT_CHANNEL, msg),
+		reconnect: () => channel.reconnectNow(),
+		getStatus: () => channel.getStatus(),
+	})
+	const frameRoutes: Record<string, (raw: string) => void> = {
+		[HOST_CHANNEL]: deps.dispatchHostCommand,
+		[CHAT_CHANNEL]: chat.deliverFrame,
+	}
+	const channel = createChannelClient({
+		channels: [HOST_CHANNEL, CHAT_CHANNEL],
+		post: (path, body) =>
+			deps.$authFetch(path, {
+				method: 'POST',
+				body: JSON.stringify(body),
+				headers: { 'content-type': JSON_CONTENT_TYPE },
+			}),
+		onReady: () => {
+			channel.send(HOST_CHANNEL, { type: HELLO_MESSAGE_TYPE, role: HOST_ROLE })
+			channel.send(HOST_CHANNEL, buildCurrentPageUpdate(window.location.href))
+			chat.announceReady()
+		},
+		onFrame: (name, raw) => frameRoutes[name]?.(raw),
 		onStatusChange: (status) => {
-			// A socket drop means the sidecar likely idle-exited/crashed: ask the
-			// controller to re-probe (relearning a possibly-new port) rather than let
-			// the socket keep retrying the dead one.
-			if (status !== WS_STATUS_CONNECTED && status !== WS_STATUS_CONNECTING) {
-				controller.reportWsDown()
-			}
+			chat.announceStatus(status)
+			// The sidecar went away, or dms-ai reloaded: re-probe, which revives
+			// an idle-exited sidecar, rather than only waiting on the retries.
+			if (status === CHANNEL_STATUS_RECONNECTING) deps.controller.reportChannelDown()
 		},
 	})
+	exposeChatTransport(chat.transport)
+	return channel
+}
 
+function followPanel(overlay: OverlayHandle, channel: ChannelClient): () => void {
+	let stopTimer: ReturnType<typeof setTimeout> | null = null
+	const clearStopTimer = (): void => {
+		if (stopTimer !== null) clearTimeout(stopTimer)
+		stopTimer = null
+	}
+	const follow = (): void => {
+		clearStopTimer()
+		const isNeeded = overlay.isOpen() && document.visibilityState === 'visible'
+		if (isNeeded) channel.start()
+		else stopTimer = setTimeout(() => channel.stop(), CHANNEL_IDLE_STOP_MS)
+	}
+	const stopOpenChange = overlay.onOpenChange(follow)
+	document.addEventListener(VISIBILITY_CHANGE_EVENT, follow)
+	follow()
+	return () => {
+		clearStopTimer()
+		stopOpenChange()
+		document.removeEventListener(VISIBILITY_CHANGE_EVENT, follow)
+	}
+}
+
+function statusApplier(
+	overlay: OverlayHandle,
+	channel: ChannelClient,
+): (status: SidecarStatus) => void {
 	let firstApply = true
-	const applyStatus = (status: SidecarStatus): void => {
+	return (status) => {
 		if (status === SIDECAR_STATUS_CONNECTED) {
-			const port = controller.getPort()
-			const token = controller.getClientToken()
-			if (port !== null && token) overlay.repoint(buildIframeUrl(port, token))
-			// On the first apply the socket was just created and is connecting to the
-			// right port; only later connects (after a drop or port change) need a
-			// forced, backoff-skipping reconnect.
-			if (!firstApply) hostWs.reconnectNow()
+			overlay.repoint(buildIframeUrl())
+			// Only a connect after a drop needs to skip the channel's backoff.
+			if (!firstApply) channel.reconnectNow()
 		} else if (status === SIDECAR_STATUS_REVIVING) {
 			overlay.showPlaceholder('reviving')
 		} else if (status === SIDECAR_STATUS_UNAVAILABLE) {
@@ -92,22 +138,55 @@ async function startAssistant({ vueApp }: DmsAppContext): Promise<void> {
 		}
 		firstApply = false
 	}
-	controller.subscribe(applyStatus)
+}
 
+function installHostState(channel: ChannelClient): () => void {
 	const sendWhenConnected = (msg: unknown): void => {
-		if (!hostWs.isConnected()) return
-		hostWs.send(msg)
+		if (!channel.isConnected()) return
+		channel.send(HOST_CHANNEL, msg)
 	}
 	const stopTracking = installCurrentPageTracker({ send: sendWhenConnected })
 	const stopNavigation = installNavigationCompleteEmitter({
 		send: sendWhenConnected,
 	})
-	const stop = (): void => {
+	return () => {
 		stopTracking()
 		stopNavigation()
 	}
-	vueApp.onUnmount(stop)
-	import.meta.hot?.dispose(stop)
+}
+
+async function startAssistant({ vueApp }: DmsAppContext): Promise<void> {
+	const { $authFetch } = useAuthFetch()
+	const controller = createSidecarStatusController(() =>
+		$authFetch(SIDECAR_INFO_PATH),
+	)
+	// A null/disabled first probe means the assistant shouldn't appear at all —
+	// preserve the previous "no icon, no overlay" behavior in that case.
+	if (!(await controller.init())) return
+	const overlay = injectOverlay()
+	if (overlay === null) return
+	installToggleShortcut({ onToggle: () => overlay.toggleOpen() })
+	// Registered unconditionally (even while reviving) so the launcher is present
+	// through an outage; opening it surfaces the panel's own status placeholder.
+	registerLauncherAction(() => overlay.toggleFromLauncher())
+	// Host-side dev hot reload: a page the agent just wrote is re-registered
+	// asynchronously, so each navigation waits for the layout to serve it, one at
+	// a time so a burst of commands cannot land out of order.
+	const dispatchHostCommand = createHostCommandDispatcher({
+		router: useDmsRouter(),
+		devReload: useDmsDevReload(),
+	})
+	const channel = createAssistantChannel({ $authFetch, controller, dispatchHostCommand })
+	controller.subscribe(statusApplier(overlay, channel))
+	const stopFollowing = followPanel(overlay, channel)
+	const stopHostState = installHostState(channel)
+	const teardown = (): void => {
+		stopFollowing()
+		stopHostState()
+		channel.stop()
+	}
+	vueApp.onUnmount(teardown)
+	import.meta.hot?.dispose(teardown)
 }
 
 export default defineDmsPlugin((context) => {

package/frontend-vue/app/runtime/channel-client.ts

@@ -0,0 +1,265 @@
+import {
+	type BackoffState,
+	createBackoff,
+	nextDelay,
+	resetBackoff,
+} from './backoff'
+import {
+	CHANNEL_EVENT_READY,
+	CHANNEL_EVENTS_SEGMENT,
+	CHANNEL_LIST_SEPARATOR,
+	CHANNEL_MESSAGES_SEGMENT,
+	CHANNEL_RECONNECT_DELAYS_MS,
+	CHANNEL_STATUS_CONNECTED,
+	CHANNEL_STATUS_CONNECTING,
+	CHANNEL_STATUS_DISCONNECTED,
+	CHANNEL_STATUS_RECONNECTING,
+	CHANNELS_PATH,
+	EVENT_STREAM_TYPE,
+} from './constants'
+import { readEventStream, type StreamEvent } from './event-stream'
+
+export type ChannelStatus =
+	| typeof CHANNEL_STATUS_CONNECTING
+	| typeof CHANNEL_STATUS_CONNECTED
+	| typeof CHANNEL_STATUS_DISCONNECTED
+	| typeof CHANNEL_STATUS_RECONNECTING
+
+/** Posts one message as JSON; `$authFetch` in the dashboard refreshes a stale session. */
+export type PostMessage = (path: string, body: unknown) => Promise<unknown>
+
+/** Opens the event stream of a set of channels. */
+export type OpenStream = (path: string, signal: AbortSignal) => Promise<Response>
+
+export interface ChannelClientOptions {
+	channels: readonly string[]
+	post: PostMessage
+	openStream?: OpenStream
+	/** Every connection is a new sidecar socket per channel: identify on it here. */
+	onReady?: () => void
+	/** Raw sidecar frame, as the socket of that channel delivered it. */
+	onFrame?: (channel: string, raw: string) => void
+	onStatusChange?: (status: ChannelStatus) => void
+}
+
+export interface ChannelClient {
+	/**
+	 * Queued and posted one at a time, in order. False when it was dropped
+	 * because the stream is not connected, so the caller knows nothing left.
+	 */
+	send: (channel: string, msg: unknown) => boolean
+	isConnected: () => boolean
+	getStatus: () => ChannelStatus
+	/** Opens the stream if it is not open yet. */
+	start: () => void
+	/** Closes the stream until the next `start`. */
+	stop: () => void
+	/**
+	 * Drops any pending backoff and replaces the stream at once, if started.
+	 * The status says connecting until the new stream is ready, since nothing
+	 * can be sent in between.
+	 */
+	reconnectNow: () => void
+}
+
+interface ReadyPayload {
+	connections?: Record<string, unknown>
+}
+
+interface QueuedMessage {
+	channel: string
+	msg: unknown
+}
+
+interface ClientState {
+	options: ChannelClientOptions
+	status: ChannelStatus
+	connections: Record<string, string> | null
+	stream: AbortController | null
+	retryTimer: ReturnType<typeof setTimeout> | null
+	queue: QueuedMessage[]
+	isDraining: boolean
+	isStarted: boolean
+	backoff: BackoffState
+}
+
+export function channelEventsPath(channels: readonly string[]): string {
+	return `${CHANNELS_PATH}/${channels.join(CHANNEL_LIST_SEPARATOR)}/${CHANNEL_EVENTS_SEGMENT}`
+}
+
+export function channelMessagesPath(connectionId: string): string {
+	return `${CHANNELS_PATH}/${encodeURIComponent(connectionId)}/${CHANNEL_MESSAGES_SEGMENT}`
+}
+
+function openEventStream(path: string, signal: AbortSignal): Promise<Response> {
+	return fetch(path, {
+		headers: { accept: EVENT_STREAM_TYPE },
+		credentials: 'same-origin',
+		cache: 'no-store',
+		signal,
+	})
+}
+
+function setStatus(state: ClientState, next: ChannelStatus): void {
+	if (state.status === next) return
+	state.status = next
+	state.options.onStatusChange?.(next)
+}
+
+function readConnections(data: string): Record<string, string> | null {
+	try {
+		const { connections } = JSON.parse(data) as ReadyPayload
+		if (connections === undefined || connections === null) return null
+		const entries = Object.entries(connections).filter(
+			(entry): entry is [string, string] => typeof entry[1] === 'string',
+		)
+		return Object.fromEntries(entries)
+	} catch {
+		return null
+	}
+}
+
+function handleReady(state: ClientState, event: StreamEvent): void {
+	state.connections = readConnections(event.data)
+	resetBackoff(state.backoff)
+	setStatus(state, CHANNEL_STATUS_CONNECTED)
+	state.options.onReady?.()
+}
+
+function handleEvent(state: ClientState, event: StreamEvent): void {
+	if (event.name === CHANNEL_EVENT_READY) return handleReady(state, event)
+	if (!state.options.channels.includes(event.name)) return
+	state.options.onFrame?.(event.name, event.data)
+}
+
+function scheduleRetry(state: ClientState): void {
+	if (state.retryTimer !== null) return
+	const delay = nextDelay(state.backoff, CHANNEL_RECONNECT_DELAYS_MS)
+	state.retryTimer = setTimeout(() => {
+		state.retryTimer = null
+		connect(state)
+	}, delay)
+}
+
+function lose(state: ClientState): void {
+	state.connections = null
+	state.queue = []
+	if (!state.isStarted) return
+	setStatus(state, CHANNEL_STATUS_RECONNECTING)
+	scheduleRetry(state)
+}
+
+async function run(state: ClientState, controller: AbortController): Promise<void> {
+	const open = state.options.openStream ?? openEventStream
+	try {
+		const response = await open(
+			channelEventsPath(state.options.channels),
+			controller.signal,
+		)
+		if (!response.ok || response.body === null) return
+		await readEventStream(response.body, (event) => handleEvent(state, event))
+	} catch {
+		return
+	} finally {
+		if (!controller.signal.aborted) lose(state)
+	}
+}
+
+function connect(state: ClientState): void {
+	if (!state.isStarted) return
+	state.stream?.abort()
+	state.connections = null
+	const controller = new AbortController()
+	state.stream = controller
+	void run(state, controller)
+}
+
+function restart(state: ClientState): void {
+	state.stream?.abort()
+	lose(state)
+}
+
+async function drain(state: ClientState): Promise<void> {
+	if (state.isDraining) return
+	state.isDraining = true
+	while (state.queue.length > 0 && state.connections !== null) {
+		const next = state.queue.shift() as QueuedMessage
+		const connectionId = state.connections[next.channel]
+		if (connectionId === undefined) continue
+		try {
+			await state.options.post(channelMessagesPath(connectionId), next.msg)
+		} catch {
+			restart(state)
+		}
+	}
+	state.isDraining = false
+}
+
+function send(state: ClientState, channel: string, msg: unknown): boolean {
+	if (state.connections?.[channel] === undefined) return false
+	state.queue.push({ channel, msg })
+	void drain(state)
+	return true
+}
+
+function clearRetry(state: ClientState): void {
+	if (state.retryTimer !== null) clearTimeout(state.retryTimer)
+	state.retryTimer = null
+}
+
+function start(state: ClientState): void {
+	if (state.isStarted) return
+	state.isStarted = true
+	resetBackoff(state.backoff)
+	setStatus(state, CHANNEL_STATUS_CONNECTING)
+	connect(state)
+}
+
+function stop(state: ClientState): void {
+	if (!state.isStarted) return
+	state.isStarted = false
+	clearRetry(state)
+	state.stream?.abort()
+	state.connections = null
+	state.queue = []
+	setStatus(state, CHANNEL_STATUS_DISCONNECTED)
+}
+
+function reconnectNow(state: ClientState): void {
+	if (!state.isStarted) return
+	clearRetry(state)
+	resetBackoff(state.backoff)
+	setStatus(state, CHANNEL_STATUS_CONNECTING)
+	connect(state)
+}
+
+/**
+ * One stream to the sidecar through the DMS carrying several channels, and
+ * sequential POSTs to send on each. Browsers keep at most six HTTP/1.1
+ * connections per origin, so a tab holds one such stream and only while it
+ * needs it: the caller starts and stops it. While started, any end of the
+ * stream — a sidecar that went down, a hot reload of dms-ai, a network drop —
+ * reconnects with backoff, and each new connection is announced through
+ * `onReady` so the caller identifies itself again.
+ */
+export function createChannelClient(options: ChannelClientOptions): ChannelClient {
+	const state: ClientState = {
+		options,
+		status: CHANNEL_STATUS_DISCONNECTED,
+		connections: null,
+		stream: null,
+		retryTimer: null,
+		queue: [],
+		isDraining: false,
+		isStarted: false,
+		backoff: createBackoff(),
+	}
+	return {
+		send: (channel, msg) => send(state, channel, msg),
+		isConnected: () => state.connections !== null,
+		getStatus: () => state.status,
+		start: () => start(state),
+		stop: () => stop(state),
+		reconnectNow: () => reconnectNow(state),
+	}
+}

package/frontend-vue/app/runtime/chat-transport.ts

@@ -0,0 +1,82 @@
+import type { ChannelStatus } from './channel-client'
+import { CHAT_TRANSPORT_KEY, LOG_PREFIX } from './constants'
+
+/**
+ * What the chat document, same-origin with the dashboard, reads on its parent
+ * window to reach the sidecar: the dashboard owns the tab's only stream and
+ * lends the chat its channel of it.
+ */
+export interface ChatTransport {
+	/** Raw sidecar frames of the chat channel, in order. */
+	onFrame: (listener: (raw: string) => void) => () => void
+	/** Every (re)connection is a new sidecar socket: the chat says hello again. */
+	onReady: (listener: () => void) => () => void
+	onStatus: (listener: (status: ChannelStatus) => void) => () => void
+	getStatus: () => ChannelStatus
+	/** False when the message was dropped because the channel is not connected. */
+	send: (msg: unknown) => boolean
+	reconnect: () => void
+}
+
+export interface ChatTransportActions {
+	send: (msg: unknown) => boolean
+	reconnect: () => void
+	getStatus: () => ChannelStatus
+}
+
+export interface ChatTransportHub {
+	transport: ChatTransport
+	deliverFrame: (raw: string) => void
+	announceReady: () => void
+	announceStatus: (status: ChannelStatus) => void
+}
+
+interface Listeners<T> {
+	add: (listener: (value: T) => void) => () => void
+	emit: (value: T) => void
+}
+
+function createListeners<T>(): Listeners<T> {
+	const listeners = new Set<(value: T) => void>()
+	return {
+		add: (listener) => {
+			listeners.add(listener)
+			return () => listeners.delete(listener)
+		},
+		emit: (value) => {
+			for (const listener of listeners) {
+				try {
+					listener(value)
+				} catch (error: unknown) {
+					console.error(`${LOG_PREFIX} chat listener failed`, error)
+				}
+			}
+		},
+	}
+}
+
+export function createChatTransport(
+	actions: ChatTransportActions,
+): ChatTransportHub {
+	const frames = createListeners<string>()
+	const ready = createListeners<undefined>()
+	const statuses = createListeners<ChannelStatus>()
+	return {
+		transport: {
+			onFrame: frames.add,
+			onReady: (listener) => ready.add(() => listener()),
+			onStatus: statuses.add,
+			getStatus: actions.getStatus,
+			send: actions.send,
+			reconnect: actions.reconnect,
+		},
+		deliverFrame: frames.emit,
+		announceReady: () => ready.emit(undefined),
+		announceStatus: statuses.emit,
+	}
+}
+
+/** Publishes the transport where the chat document looks for it. */
+export function exposeChatTransport(transport: ChatTransport): void {
+	Reflect.set(globalThis, CHAT_TRANSPORT_KEY, transport)
+}

package/frontend-vue/app/runtime/constants.ts

@@ -3,17 +3,36 @@ export const OVERLAY_Z_INDEX = 999_999
 export const OVERLAY_DOM_ID = 'dms-ai-overlay-root'
 export const OVERLAY_IFRAME_ID = 'dms-ai-overlay-iframe'
 export const SIDECAR_INFO_PATH = '/ai/sidecar-info'
-export const SIDECAR_PROBE_HOST = 'http://localhost'
+/** The chat document, served through the DMS from the dashboard's own origin. */
+export const CHATBOX_PATH = '/api/ai/chatbox/'
+/** Event stream to receive, POST to send: HTTP the DMS frontend server relays. */
+export const CHANNELS_PATH = '/ai/channels'
+export const CHANNEL_EVENTS_SEGMENT = 'events'
+export const CHANNEL_MESSAGES_SEGMENT = 'messages'
+export const CHANNEL_LIST_SEPARATOR = ','
+export const HOST_CHANNEL = 'host'
+export const CHAT_CHANNEL = 'chat'
+export const CHANNEL_EVENT_READY = 'ready'
+/**
+ * How long the stream outlives a closed panel or a hidden tab, so a quick
+ * close and reopen does not reconnect, while a tab left in the background soon
+ * gives back its one of the browser's six HTTP/1.1 connections to the dashboard.
+ */
+export const CHANNEL_IDLE_STOP_MS = 2_000
+export const VISIBILITY_CHANGE_EVENT = 'visibilitychange'
+/** Where the chat document, same-origin, finds the dashboard's chat transport. */
+export const CHAT_TRANSPORT_KEY = 'dmsAiChatTransport'
+export const OVERLAY_OPEN_CHANGE_EVENT = 'dms-ai:open-change'
+export const EVENT_STREAM_TYPE = 'text/event-stream'
+export const JSON_CONTENT_TYPE = 'application/json'
 export const OVERLAY_BOX_SHADOW = '0 8px 24px rgba(0, 0, 0, 0.18)'
-export const SIDECAR_HOST_NAME = 'localhost'
-export const WS_HOST_PATH = '/ws/host'
-export const WS_RECONNECT_DELAYS_MS = [
+export const CHANNEL_RECONNECT_DELAYS_MS = [
 	1000, 2000, 4000, 8000, 15000, 30000,
 ] as const
 // Sidecar reachability, as seen by the host. `reviving` is the self-healing
-// state (idle-exited / crashed-respawning): the probe loop is relearning the new
-// random port and will repoint the frame. `unavailable` is terminal (the crash
-// budget is spent) and needs a reload.
+// state (idle-exited / crashed-respawning): the probe loop revives the sidecar
+// and the channels reconnect once it answers. `unavailable` is terminal (the
+// crash budget is spent) and needs a reload.
 export const SIDECAR_STATUS_CONNECTING = 'connecting'
 export const SIDECAR_STATUS_CONNECTED = 'connected'
 export const SIDECAR_STATUS_REVIVING = 'reviving'
@@ -30,13 +49,10 @@ export const PLACEHOLDER_REVIVING_TEXT = 'Reconnecting the assistant…'
 export const PLACEHOLDER_UNAVAILABLE_TITLE = 'Assistant unavailable'
 export const PLACEHOLDER_UNAVAILABLE_TEXT = 'Reload the page to try again.'
 
-export const WS_STATUS_CONNECTING = 'connecting'
-export const WS_STATUS_CONNECTED = 'connected'
-export const WS_STATUS_DISCONNECTED = 'disconnected'
-export const WS_STATUS_RECONNECTING = 'reconnecting'
-export const WS_PROTOCOL_SECURE = 'wss:'
-export const WS_PROTOCOL_INSECURE = 'ws:'
-export const PAGE_PROTOCOL_SECURE = 'https:'
+export const CHANNEL_STATUS_CONNECTING = 'connecting'
+export const CHANNEL_STATUS_CONNECTED = 'connected'
+export const CHANNEL_STATUS_DISCONNECTED = 'disconnected'
+export const CHANNEL_STATUS_RECONNECTING = 'reconnecting'
 export const HOST_ROLE = 'host'
 export const HELLO_MESSAGE_TYPE = 'hello'
 export const LOG_PREFIX = '[dms-ai]'
@@ -52,7 +68,7 @@ export const TOGGLE_SHORTCUT_KEY = 'k'
 export const MODAL_OPEN_SELECTOR = '[role="dialog"][aria-modal="true"]'
 
 // Generic header-action registry exposed by the DMS core (dms-back). Any module
-// can push a button by writing to this shared Nuxt state key; the core renders
+// can push a button by writing to this shared `useDmsState` key; the core renders
 // it with no knowledge of who registered it.
 export const HEADER_ACTIONS_STATE_KEY = 'dms:header-actions'
 export const LAUNCHER_ACTION_ID = 'dms-ai-launcher'

package/frontend-vue/app/runtime/current-page.ts

@@ -14,14 +14,18 @@ interface InstallCurrentPageTrackerOptions {
 	send: (msg: HostStateUpdateMessage) => void
 }
 
+/** The state update announcing the page at `url`. */
+export function buildCurrentPageUpdate(url: string): HostStateUpdateMessage {
+	return {
+		type: HOST_STATE_UPDATE_TYPE,
+		currentPage: { path: new URL(url, window.location.origin).pathname },
+	}
+}
+
 export function installCurrentPageTracker(
 	options: InstallCurrentPageTrackerOptions,
 ): () => void {
-	const pushFor = (url: string): void =>
-		options.send({
-			type: HOST_STATE_UPDATE_TYPE,
-			currentPage: { path: new URL(url, window.location.origin).pathname },
-		})
+	const pushFor = (url: string): void => options.send(buildCurrentPageUpdate(url))
 	const stop = router.on('navigate', (event) => pushFor(event.detail.page.url))
 	pushFor(window.location.href)
 	return stop