@antelopejs/dms-ai 0.1.6 → 0.2.0

package/frontend-vue/app/chat/composables/conversation-events.ts

@@ -0,0 +1,404 @@
+import { MESSAGE_ROLES } from "../constants/conversation";
+import { SERVER_EVENT_TYPES } from "../constants/protocol";
+import type {
+	ConversationMessage,
+	ToolCallMessage,
+} from "../types/conversation";
+import type {
+	AllowedBy,
+	AttachmentMeta,
+	ChangeSetSummary,
+	ConversationModeState,
+	FullAutoState,
+	Notice,
+	QueuedItemWire,
+	SnapshotMessage,
+	ToolOutcome,
+	WireAttachment,
+} from "../types/protocol";
+import type { PendingAttachment } from "../utils/attachments";
+import {
+	buildAssistantMessage,
+	buildErrorMessage,
+	buildUserMessage,
+	closedStatus,
+	settleOpenTools,
+	snapshotToMessages,
+} from "../utils/conversation-messages";
+import { newUuid } from "../utils/ids";
+import { toActivityKind } from "../utils/run-status";
+import type { ConversationState } from "./useConversation";
+
+interface ChunkEvent {
+	text: string;
+}
+
+interface ToolStartEvent {
+	callId: string;
+	toolName: string;
+	args: unknown;
+}
+
+interface ToolEndEvent {
+	callId: string;
+	status?: string;
+	result: unknown;
+	outcome?: ToolOutcome;
+	allowedBy?: AllowedBy;
+	changeSetId?: string;
+}
+
+interface RunErrorEvent {
+	error: string;
+	isRetryable?: boolean;
+}
+
+interface RunProgressEvent {
+	activity: string;
+	detail?: string;
+	elapsedMs: number;
+	idleMs: number;
+}
+
+interface SnapshotModeWire {
+	mode?: ConversationModeState["mode"];
+	generationMode?: ConversationModeState["generationMode"];
+	fullAuto?: FullAutoState | null;
+}
+
+interface SnapshotEvent {
+	messages?: SnapshotMessage[];
+	changeSets?: ChangeSetSummary[];
+	mode?: SnapshotModeWire;
+	totalTokens?: number;
+}
+
+interface QueueStateEvent {
+	items?: QueuedItemWire[];
+}
+
+interface UserMessageEchoEvent {
+	content: string;
+	attachments?: AttachmentMeta[];
+	timestampMs?: number;
+}
+
+interface NoticeEvent {
+	notice?: Notice;
+}
+
+interface ChangeSetEvent {
+	changeSet?: ChangeSetSummary;
+}
+
+interface UsageEvent {
+	totalTokens?: number;
+}
+
+type EventHandler = (state: ConversationState, event: never) => void;
+
+function setMessages(
+	state: ConversationState,
+	next: ConversationMessage[],
+): void {
+	state.messages.value = next;
+}
+
+function appendMessage(
+	state: ConversationState,
+	message: ConversationMessage,
+): void {
+	setMessages(state, [...state.messages.value, message]);
+}
+
+function endTurn(state: ConversationState): void {
+	setMessages(state, settleOpenTools(state.messages.value));
+	state.progress.value = null;
+	state.isTurnInFlight.value = false;
+	state.isRunning.value = state.queued.value.length > 0;
+}
+
+function appendChunk(state: ConversationState, event: ChunkEvent): void {
+	const list = state.messages.value;
+	const last = list.at(-1);
+	if (last?.role !== MESSAGE_ROLES.ASSISTANT) {
+		appendMessage(state, buildAssistantMessage(event.text));
+		return;
+	}
+	setMessages(state, [
+		...list.slice(0, -1),
+		{ ...last, content: last.content + event.text },
+	]);
+}
+
+function isCall(msg: ConversationMessage, callId: string): boolean {
+	return msg.role === MESSAGE_ROLES.TOOL && msg.callId === callId;
+}
+
+function startTool(state: ConversationState, event: ToolStartEvent): void {
+	const list = state.messages.value;
+	if (list.some((msg) => isCall(msg, event.callId))) {
+		setMessages(
+			state,
+			list.map((msg) =>
+				isCall(msg, event.callId)
+					? { ...msg, toolName: event.toolName, args: event.args }
+					: msg,
+			),
+		);
+		return;
+	}
+	const tool: ToolCallMessage = {
+		id: newUuid(),
+		role: MESSAGE_ROLES.TOOL,
+		callId: event.callId,
+		toolName: event.toolName,
+		args: event.args,
+		status: "pending",
+		timestampMs: state.callTimes.get(event.callId)?.startedAtMs ?? Date.now(),
+	};
+	appendMessage(state, tool);
+}
+
+function endTool(state: ConversationState, event: ToolEndEvent): void {
+	const endedAtMs = state.callTimes.get(event.callId)?.endedAtMs ?? Date.now();
+	setMessages(
+		state,
+		state.messages.value.map((msg) => {
+			if (!isCall(msg, event.callId) || msg.role !== MESSAGE_ROLES.TOOL)
+				return msg;
+			return {
+				...msg,
+				status: closedStatus(event.outcome, event.status),
+				result: event.result,
+				outcome: event.outcome,
+				allowedBy: event.allowedBy ?? msg.allowedBy,
+				changeSetId: event.changeSetId,
+				endedAtMs,
+			};
+		}),
+	);
+}
+
+function failRun(state: ConversationState, event: RunErrorEvent): void {
+	endTurn(state);
+	appendMessage(
+		state,
+		buildErrorMessage(event.error, event.isRetryable ?? true),
+	);
+}
+
+function isTurnStart(msg: ConversationMessage): boolean {
+	if (msg.role === MESSAGE_ROLES.USER) return true;
+	return msg.role === MESSAGE_ROLES.NOTICE && msg.notice.kind === "autofix";
+}
+
+/** Kept through a replay: stored outside the turn's own events. */
+function isOutOfTurn(msg: ConversationMessage): boolean {
+	return (
+		msg.role === MESSAGE_ROLES.NOTICE ||
+		msg.role === MESSAGE_ROLES.QUESTION_ANSWER
+	);
+}
+
+/**
+ * The transcript up to where the running turn began. A re-attach sends the
+ * stored transcript, then `run_resumed` and every event of the running turn
+ * from its start: the turn's stored part makes way for that replay, or its
+ * texts would be appended twice.
+ */
+function withoutRunningTurn(
+	list: ConversationMessage[],
+): ConversationMessage[] {
+	const start = lastIndexWhere(list, isTurnStart);
+	return [
+		...list.slice(0, start + 1),
+		...list.slice(start + 1).filter(isOutOfTurn),
+	];
+}
+
+function lastIndexWhere(
+	list: ConversationMessage[],
+	predicate: (msg: ConversationMessage) => boolean,
+): number {
+	for (let index = list.length - 1; index >= 0; index -= 1)
+		if (predicate(list[index])) return index;
+	return -1;
+}
+
+function resumeRun(state: ConversationState): void {
+	setMessages(state, withoutRunningTurn(state.messages.value));
+	state.isRunning.value = true;
+	state.isTurnInFlight.value = true;
+	state.lastEventAtMs.value = Date.now();
+}
+
+function reportProgress(
+	state: ConversationState,
+	event: RunProgressEvent,
+): void {
+	state.progress.value = {
+		activity: toActivityKind(event.activity),
+		detail: event.detail,
+		elapsedMs: event.elapsedMs,
+		idleMs: event.idleMs,
+		receivedAtMs: Date.now(),
+	};
+	state.isRunning.value = true;
+	state.isTurnInFlight.value = true;
+}
+
+function toModeState(wire: SnapshotModeWire | undefined) {
+	if (wire?.mode === undefined || wire.generationMode === undefined)
+		return null;
+	return {
+		mode: wire.mode,
+		generationMode: wire.generationMode,
+		fullAuto: wire.fullAuto ?? null,
+	};
+}
+
+function byId(sets: readonly ChangeSetSummary[]) {
+	return Object.fromEntries(sets.map((set) => [set.id, set]));
+}
+
+function rememberCallTimes(
+	state: ConversationState,
+	list: ConversationMessage[],
+): void {
+	state.callTimes.clear();
+	for (const msg of list) {
+		if (msg.role !== MESSAGE_ROLES.TOOL) continue;
+		state.callTimes.set(msg.callId, {
+			startedAtMs: msg.timestampMs,
+			endedAtMs: msg.endedAtMs,
+		});
+	}
+}
+
+function applySnapshot(state: ConversationState, event: SnapshotEvent): void {
+	const messages = snapshotToMessages(event.messages ?? []);
+	rememberCallTimes(state, messages);
+	setMessages(state, messages);
+	state.changeSets.value = byId(event.changeSets ?? []);
+	state.mode.value = toModeState(event.mode) ?? state.mode.value;
+	state.totalTokens.value = event.totalTokens ?? state.totalTokens.value;
+	state.isRunning.value = false;
+	state.progress.value = null;
+	state.isTurnInFlight.value = false;
+}
+
+function toPendingAttachment(wire: WireAttachment): PendingAttachment {
+	return {
+		id: newUuid(),
+		name: wire.name,
+		mimeType: wire.mimeType,
+		size: wire.size,
+		data: wire.data,
+		dataUrl: `data:${wire.mimeType};base64,${wire.data}`,
+	};
+}
+
+function applyQueue(state: ConversationState, event: QueueStateEvent): void {
+	state.queued.value = (event.items ?? []).map((item) => ({
+		id: item.id,
+		content: item.content,
+		attachments: (item.attachments ?? []).map(toPendingAttachment),
+	}));
+}
+
+function echoUserMessage(
+	state: ConversationState,
+	event: UserMessageEchoEvent,
+): void {
+	const attachments = (event.attachments ?? []).map((meta) => ({ ...meta }));
+	appendMessage(
+		state,
+		buildUserMessage(
+			event.content,
+			attachments.length > 0 ? attachments : undefined,
+			undefined,
+			event.timestampMs ?? Date.now(),
+		),
+	);
+}
+
+function applyMode(state: ConversationState, event: SnapshotModeWire): void {
+	state.mode.value = toModeState(event) ?? state.mode.value;
+}
+
+function appendNotice(state: ConversationState, event: NoticeEvent): void {
+	if (event.notice === undefined) return;
+	appendMessage(state, {
+		id: newUuid(),
+		role: MESSAGE_ROLES.NOTICE,
+		notice: event.notice,
+		timestampMs: event.notice.timestampMs ?? Date.now(),
+	});
+}
+
+function hasCardFor(state: ConversationState, changeSetId: string): boolean {
+	return state.messages.value.some(
+		(msg) =>
+			msg.role === MESSAGE_ROLES.CHANGE_SET && msg.changeSetId === changeSetId,
+	);
+}
+
+function applyChangeSet(state: ConversationState, event: ChangeSetEvent): void {
+	const set = event.changeSet;
+	if (set === undefined) return;
+	state.changeSets.value = { ...state.changeSets.value, [set.id]: set };
+	if (hasCardFor(state, set.id)) return;
+	appendMessage(state, {
+		id: newUuid(),
+		role: MESSAGE_ROLES.CHANGE_SET,
+		changeSetId: set.id,
+		timestampMs: set.createdAtMs,
+	});
+}
+
+function applyUsage(state: ConversationState, event: UsageEvent): void {
+	if (typeof event.totalTokens !== "number") return;
+	state.totalTokens.value = event.totalTokens;
+}
+
+const EVENT_HANDLERS: Record<string, EventHandler> = {
+	[SERVER_EVENT_TYPES.ASSISTANT_MESSAGE_CHUNK]: appendChunk,
+	[SERVER_EVENT_TYPES.TOOL_CALL_START]: startTool,
+	[SERVER_EVENT_TYPES.TOOL_CALL_END]: endTool,
+	[SERVER_EVENT_TYPES.RUN_DONE]: endTurn,
+	[SERVER_EVENT_TYPES.RUN_ERROR]: failRun,
+	[SERVER_EVENT_TYPES.RUN_RESUMED]: resumeRun,
+	[SERVER_EVENT_TYPES.RUN_PROGRESS]: reportProgress,
+	[SERVER_EVENT_TYPES.CONVERSATION_SNAPSHOT]: applySnapshot,
+	[SERVER_EVENT_TYPES.QUEUE_STATE]: applyQueue,
+	[SERVER_EVENT_TYPES.USER_MESSAGE_ECHO]: echoUserMessage,
+	[SERVER_EVENT_TYPES.CONVERSATION_MODE]: applyMode,
+	[SERVER_EVENT_TYPES.NOTICE]: appendNotice,
+	[SERVER_EVENT_TYPES.CHANGE_SET]: applyChangeSet,
+	[SERVER_EVENT_TYPES.USAGE]: applyUsage,
+};
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+	return value !== null && typeof value === "object";
+}
+
+function isForActive(
+	state: ConversationState,
+	msg: Record<string, unknown>,
+): boolean {
+	const id = msg.conversationId;
+	return typeof id !== "string" || id === state.options.activeId.value;
+}
+
+/** Folds one sidecar event into the active conversation; others are ignored. */
+export function dispatchConversationEvent(
+	state: ConversationState,
+	msg: unknown,
+): void {
+	if (!isRecord(msg) || typeof msg.type !== "string") return;
+	const handler = EVENT_HANDLERS[msg.type];
+	if (handler === undefined || !isForActive(state, msg)) return;
+	state.lastEventAtMs.value = Date.now();
+	handler(state, msg as never);
+}

package/frontend-vue/app/chat/composables/useChangeSetActions.ts

@@ -0,0 +1,135 @@
+import { type Ref, ref, watch } from "vue";
+import { CLIENT_MESSAGE_TYPES } from "../constants/protocol";
+import type { ChangeSetSummary } from "../types/protocol";
+
+/** What the dashboard's authenticated fetch gives the chat. */
+export interface ChatApi {
+	get: <T>(path: string) => Promise<T>;
+	post: <T>(path: string, body?: unknown) => Promise<T>;
+}
+
+export interface UndoConflict {
+	changeSetId: string;
+	number: number;
+	title: string;
+	files: string[];
+}
+
+interface UndoPreview {
+	conflicts?: UndoConflict[];
+}
+
+/** An undo waiting on the user: later sets touch the same files. */
+interface PendingUndo {
+	changeSetId: string;
+	number: number;
+	conflicts: UndoConflict[];
+}
+
+export interface UseChangeSetActionsOptions {
+	activeId: Ref<string>;
+	changeSets: Ref<Record<string, ChangeSetSummary>>;
+	send: (msg: object) => boolean;
+	api: ChatApi | null;
+}
+
+export interface UseChangeSetActionsResult {
+	busyIds: Ref<ReadonlySet<string>>;
+	pendingUndo: Ref<PendingUndo | null>;
+	undo: (changeSetId: string) => Promise<void>;
+	redo: (changeSetId: string) => void;
+	/** Answers the conflict question: with the later sets, or this one alone. */
+	confirmUndo: (includeLater: boolean) => void;
+	cancelUndo: () => void;
+}
+
+const BUSY_TIMEOUT_MS = 10_000;
+
+function undoPreviewPath(changeSetId: string): string {
+	return `/ai/changes/${encodeURIComponent(changeSetId)}/undo-preview`;
+}
+
+/**
+ * Undo and Redo from the chat's change set cards. Undo first asks the backend
+ * which later sets touch the same files, and lets the user choose when some
+ * do, since undoing one alone may leave code that does not compile.
+ */
+export function useChangeSetActions(
+	options: UseChangeSetActionsOptions,
+): UseChangeSetActionsResult {
+	const busyIds = ref<ReadonlySet<string>>(new Set());
+	const stateAtAction = new Map<string, string | undefined>();
+	const pendingUndo = ref<PendingUndo | null>(null);
+
+	const setBusy = (id: string, isBusy: boolean): void => {
+		const next = new Set(busyIds.value);
+		if (isBusy) next.add(id);
+		else next.delete(id);
+		busyIds.value = next;
+	};
+
+	const act = (
+		changeSetId: string,
+		action: "undo" | "redo",
+		includeLater = false,
+	): void => {
+		const isSent = options.send({
+			type: CLIENT_MESSAGE_TYPES.CHANGE_SET_ACTION,
+			conversationId: options.activeId.value,
+			changeSetId,
+			action,
+			...(includeLater ? { includeLater: true } : {}),
+		});
+		if (!isSent) return;
+		stateAtAction.set(
+			changeSetId,
+			options.changeSets.value[changeSetId]?.state,
+		);
+		setBusy(changeSetId, true);
+		setTimeout(() => setBusy(changeSetId, false), BUSY_TIMEOUT_MS);
+	};
+
+	watch(options.changeSets, (sets) => {
+		const settled = [...busyIds.value].filter(
+			(id) => sets[id]?.state !== stateAtAction.get(id),
+		);
+		settled.forEach((id) => setBusy(id, false));
+	});
+
+	const conflictsOf = async (changeSetId: string): Promise<UndoConflict[]> => {
+		if (options.api === null) return [];
+		try {
+			const preview = await options.api.get<UndoPreview>(
+				undoPreviewPath(changeSetId),
+			);
+			return preview.conflicts ?? [];
+		} catch {
+			return [];
+		}
+	};
+
+	const undo = async (changeSetId: string): Promise<void> => {
+		const conflicts = await conflictsOf(changeSetId);
+		if (conflicts.length === 0) {
+			act(changeSetId, "undo");
+			return;
+		}
+		const number = options.changeSets.value[changeSetId]?.number ?? 0;
+		pendingUndo.value = { changeSetId, number, conflicts };
+	};
+
+	return {
+		busyIds,
+		pendingUndo,
+		undo,
+		redo: (changeSetId) => act(changeSetId, "redo"),
+		confirmUndo: (includeLater) => {
+			const pending = pendingUndo.value;
+			pendingUndo.value = null;
+			if (pending !== null) act(pending.changeSetId, "undo", includeLater);
+		},
+		cancelUndo: () => {
+			pendingUndo.value = null;
+		},
+	};
+}

package/frontend-vue/app/chat/composables/useChatChannel.ts

@@ -11,9 +11,15 @@ import {
 export interface UseChatChannelOptions {
 	transport: ChatTransport;
 	getConversationId: () => string;
+	/**
+	 * Follows the conversation next to the one the tab's stream shows, rather
+	 * than switching it: the command palette's answer, while the panel keeps
+	 * its own chat.
+	 */
+	isFollowing?: boolean;
 }
 
-export type ChannelMessageHandler = (msg: unknown) => void;
+type ChannelMessageHandler = (msg: unknown) => void;
 
 export interface UseChatChannelResult {
 	/** False when the message was dropped: the stream is not connected. */
@@ -43,10 +49,12 @@ function setStatus(state: ChannelState, status: string): void {
 }
 
 function sendHello(state: ChannelState): void {
-	state.options.transport.send({
+	const { transport, getConversationId, isFollowing } = state.options;
+	transport.send({
 		type: CLIENT_MESSAGE_TYPES.HELLO,
 		role: CHAT_ROLE,
-		conversationId: state.options.getConversationId(),
+		conversationId: getConversationId(),
+		...(isFollowing === true ? { follow: true } : {}),
 	});
 }
 

package/frontend-vue/app/chat/composables/useChatI18n.ts

@@ -0,0 +1,35 @@
+import { type InjectionKey, inject, type Ref, ref } from "vue";
+
+export type TranslateParams = Record<string, string | number>;
+
+/** `t` of the dashboard's vue-i18n: a key, named parameters, a plural count. */
+export type Translate = (
+	key: string,
+	params?: TranslateParams,
+	plural?: number,
+) => string;
+
+/**
+ * The chat's view of the dashboard's i18n. The plugin provides it from the DMS
+ * runtime, so the chat itself imports nothing of the DMS and stays testable on
+ * its own.
+ */
+export interface ChatI18n {
+	t: Translate;
+	/** The interface language, for dates and numbers. */
+	locale: Readonly<Ref<string>>;
+}
+
+export const CHAT_I18N_KEY: InjectionKey<ChatI18n> = Symbol("dms-ai:i18n");
+
+const FALLBACK_LOCALE = "en-GB";
+
+const keyOnly: ChatI18n = {
+	t: (key) => key,
+	locale: ref(FALLBACK_LOCALE),
+};
+
+/** The chat's translator: the dashboard's when provided, the bare keys otherwise. */
+export function useChatI18n(): ChatI18n {
+	return inject(CHAT_I18N_KEY, keyOnly);
+}

package/frontend-vue/app/chat/composables/useComposerAttachments.ts

@@ -0,0 +1,111 @@
+import { type Ref, ref } from "vue";
+import {
+	MAX_ATTACHMENT_MEGABYTES,
+	MAX_ATTACHMENTS,
+} from "../constants/attachments";
+import {
+	exceedsSizeLimit,
+	type PendingAttachment,
+	readFileAsAttachment,
+} from "../utils/attachments";
+import type { Translate } from "./useChatI18n";
+
+export interface UseComposerAttachmentsResult {
+	attachments: Ref<PendingAttachment[]>;
+	error: Ref<string>;
+	isDragging: Ref<boolean>;
+	add: (files: FileList | File[]) => Promise<void>;
+	remove: (id: string) => void;
+	clear: () => void;
+	onDragEnter: (event: DragEvent) => void;
+	onDragOver: (event: DragEvent) => void;
+	onDragLeave: () => void;
+	onDrop: (event: DragEvent) => void;
+}
+
+function hasFiles(event: DragEvent): boolean {
+	return event.dataTransfer?.types.includes("Files") ?? false;
+}
+
+/**
+ * The files staged in the composer: picked, pasted or dropped, within the
+ * sidecar's limits, each problem said in the user's language.
+ */
+export function useComposerAttachments(
+	t: Translate,
+	isDisabled: () => boolean,
+): UseComposerAttachmentsResult {
+	const attachments = ref<PendingAttachment[]>([]);
+	const error = ref("");
+	const isDragging = ref(false);
+	let dragDepth = 0;
+
+	async function readOne(file: File): Promise<void> {
+		if (exceedsSizeLimit(file)) {
+			error.value = t("dms_ai.panel.composer.file_too_large", {
+				name: file.name,
+				max: MAX_ATTACHMENT_MEGABYTES,
+			});
+			return;
+		}
+		try {
+			attachments.value = [
+				...attachments.value,
+				await readFileAsAttachment(file),
+			];
+		} catch {
+			error.value = t("dms_ai.panel.composer.file_unreadable", {
+				name: file.name,
+			});
+		}
+	}
+
+	async function add(files: FileList | File[]): Promise<void> {
+		error.value = "";
+		const incoming = Array.from(files);
+		const room = MAX_ATTACHMENTS - attachments.value.length;
+		if (incoming.length > room)
+			error.value = t("dms_ai.panel.composer.too_many_files", {
+				max: MAX_ATTACHMENTS,
+			});
+		for (const file of incoming.slice(0, Math.max(room, 0)))
+			await readOne(file);
+	}
+
+	function onDrop(event: DragEvent): void {
+		dragDepth = 0;
+		isDragging.value = false;
+		const files = event.dataTransfer?.files;
+		if (isDisabled() || files === undefined || files.length === 0) return;
+		event.preventDefault();
+		void add(files);
+	}
+
+	return {
+		attachments,
+		error,
+		isDragging,
+		add,
+		remove: (id) => {
+			attachments.value = attachments.value.filter((att) => att.id !== id);
+		},
+		clear: () => {
+			attachments.value = [];
+			error.value = "";
+		},
+		onDragEnter: (event) => {
+			if (isDisabled() || !hasFiles(event)) return;
+			dragDepth += 1;
+			isDragging.value = true;
+		},
+		onDragOver: (event) => {
+			if (!isDisabled() && hasFiles(event)) event.preventDefault();
+		},
+		onDragLeave: () => {
+			if (dragDepth === 0) return;
+			dragDepth -= 1;
+			if (dragDepth === 0) isDragging.value = false;
+		},
+		onDrop,
+	};
+}