@antelopejs/dms-ai 0.6.1 → 0.8.0

package/frontend-vue/app/chat/components/ProviderNotice.vue

@@ -0,0 +1,77 @@
+<script setup lang="ts">
+import { useChatI18n } from "../composables/useChatI18n";
+
+interface Props {
+	agentName: string;
+	/** Why the provider cannot run, as the sidecar reported it. */
+	reason: string;
+}
+
+interface Emits {
+	openSettings: [];
+}
+
+defineProps<Props>();
+const emit = defineEmits<Emits>();
+const { t } = useChatI18n();
+</script>
+
+<template>
+	<div class="chat-view-provider">
+		<div class="cb-provider" role="alert">
+			<UIcon name="i-ph-key" class="cb-provider__icon" />
+			<div>
+				<b>
+					{{ t("dms_ai.panel.errors.agent_cant_run", { agent: agentName }) }}
+				</b>
+				{{ reason }}
+				{{ t("dms_ai.panel.errors.agent_no_fallback") }}
+				<div class="cb-provider__row">
+					<UButton
+						size="xs"
+						color="neutral"
+						variant="outline"
+						icon="i-ph-gear-six"
+						:label="t('dms_ai.panel.errors.open_settings')"
+						@click="emit('openSettings')"
+					/>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<style scoped>
+.chat-view-provider {
+	padding: 0 14px 16px;
+}
+
+.cb-provider {
+	display: flex;
+	gap: 10px;
+	padding: 10px 12px;
+	border: 1px solid var(--dms-error-line);
+	border-radius: var(--ai-radius-md);
+	background: var(--dms-error-tint);
+	font-size: 12.5px;
+	line-height: 1.5;
+	color: var(--ui-text-toned);
+}
+
+.cb-provider__icon {
+	width: 16px;
+	height: 16px;
+	flex: none;
+	margin-top: 1px;
+	color: var(--ui-error);
+}
+
+.cb-provider b {
+	font-weight: 600;
+	color: var(--ui-text-highlighted);
+}
+
+.cb-provider__row {
+	margin-top: 8px;
+}
+</style>

package/frontend-vue/app/chat/components/UndoConflictModal.vue

@@ -0,0 +1,98 @@
+<script setup lang="ts">
+import type { PendingUndo } from "../composables/useChangeSetActions";
+import { useChatI18n } from "../composables/useChatI18n";
+
+interface Props {
+	/** The undo waiting on the user; the modal is open while there is one. */
+	pending: PendingUndo | null;
+}
+
+interface Emits {
+	confirm: [includeLater: boolean];
+	cancel: [];
+}
+
+defineProps<Props>();
+const emit = defineEmits<Emits>();
+const { t } = useChatI18n();
+
+function onOpenChange(isOpen: boolean): void {
+	if (!isOpen) emit("cancel");
+}
+</script>
+
+<template>
+	<UModal
+		:open="pending !== null"
+		:title="t('dms_ai.panel.change.conflict_title')"
+		@update:open="onOpenChange"
+	>
+		<template #body>
+			<p class="chat-view-conflict">
+				{{
+					t("dms_ai.panel.change.conflict_text", {
+						number: pending?.number ?? 0,
+					})
+				}}
+			</p>
+			<ul class="chat-view-conflicts">
+				<li
+					v-for="conflict in pending?.conflicts ?? []"
+					:key="conflict.changeSetId"
+				>
+					<b>#{{ conflict.number }}</b>
+					{{ conflict.title }}
+					<span>{{ conflict.files.join(", ") }}</span>
+				</li>
+			</ul>
+		</template>
+		<template #footer>
+			<div class="chat-view-conflict-foot">
+				<UButton
+					color="neutral"
+					variant="ghost"
+					:label="t('dms_ai.panel.change.undo_only')"
+					@click="emit('confirm', false)"
+				/>
+				<UButton
+					color="secondary"
+					:label="t('dms_ai.panel.change.undo_together')"
+					@click="emit('confirm', true)"
+				/>
+			</div>
+		</template>
+	</UModal>
+</template>
+
+<style scoped>
+.chat-view-conflict {
+	margin: 0 0 10px;
+	font-size: 13px;
+	line-height: 1.5;
+	color: var(--ui-text-muted);
+}
+
+.chat-view-conflicts {
+	display: grid;
+	gap: 6px;
+	margin: 0;
+	padding: 0;
+	list-style: none;
+	font-size: 12.5px;
+}
+
+.chat-view-conflicts span {
+	display: block;
+	font-family: var(--ai-font-mono, ui-monospace, monospace);
+	font-size: 11px;
+	color: var(--ui-text-muted);
+	overflow-wrap: anywhere;
+}
+
+.chat-view-conflict-foot {
+	display: flex;
+	justify-content: flex-end;
+	gap: 8px;
+	width: 100%;
+}
+</style>

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

@@ -20,7 +20,7 @@ interface UndoPreview {
 }
 
 /** An undo waiting on the user: later sets touch the same files. */
-interface PendingUndo {
+export interface PendingUndo {
 	changeSetId: string;
 	number: number;
 	conflicts: UndoConflict[];

package/frontend-vue/app/components/SkillDetail.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { Tone } from "#dms-ui/app/types/tone";
+import type { Tone } from "#dms-core/app/types/tone";
 import { computed } from "vue";
 import { renderDocument } from "../chat/utils/markdown";
 import { useAssistant } from "../views/composables/useAssistant";

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

@@ -26,6 +26,10 @@ import {
 	paletteAssistant,
 	paletteSource,
 } from "../runtime/assistant-commands";
+import {
+	ASSISTANT_ACTIONS_KEY,
+	publicAssistantActions,
+} from "../runtime/assistant-actions";
 import { installAssistantNotifications } from "../runtime/assistant-notifications";
 import {
 	ASSISTANT_SESSION_KEY,
@@ -264,8 +268,8 @@ function createSession(parts: SessionParts): AssistantSession {
 			intents.push({ kind: "open", conversationId });
 			panel.open();
 		},
-		startConversation: (prompt) => {
-			intents.push({ kind: "start", prompt });
+		startConversation: (prompt, mode) => {
+			intents.push({ kind: "start", prompt, mode });
 			panel.open();
 		},
 		holdStream: parts.holds.hold,
@@ -502,6 +506,10 @@ export default defineDmsPlugin((context) => {
 		i18n: createChatI18n(context.$i18n),
 	};
 	context.vueApp.provide(ASSISTANT_SESSION_KEY, provided.session);
+	context.vueApp.provide(
+		ASSISTANT_ACTIONS_KEY,
+		publicAssistantActions(provided.session),
+	);
 	context.vueApp.provide(CHAT_I18N_KEY, provided.i18n);
 	const appMounted = new Promise<void>((resolve) =>
 		context.hook("app:mounted", resolve),

package/frontend-vue/app/runtime/assistant-actions.ts

@@ -0,0 +1,41 @@
+import type {
+	AssistantSessionRef,
+	ConversationStartMode,
+} from "./assistant-session";
+
+/**
+ * The assistant as another module's layer may use it, without depending on dms-ai: injected under
+ * {@link ASSISTANT_ACTIONS_KEY} with a `null` default, which is what a project without dms-ai, or
+ * outside development, answers.
+ */
+export interface PublicAssistantActions {
+	/** The assistant runs in this tab, so a button that starts a conversation can be offered. Reactive. */
+	readonly isAvailable: boolean;
+	/**
+	 * Opens the assistant panel on a new conversation with `prompt` in the composer, unsent. With
+	 * `mode`, the conversation is set to it first: `plan` makes the agent end with a plan to approve.
+	 */
+	startConversation: (
+		prompt: string,
+		options?: { mode?: ConversationStartMode },
+	) => void;
+}
+
+/**
+ * The global key of {@link PublicAssistantActions}: `Symbol.for` resolves to the same symbol in
+ * every layer, so another module's layer injects it without importing dms-ai.
+ */
+export const ASSISTANT_ACTIONS_KEY = Symbol.for("dms-ai:assistant-actions");
+
+/** The public actions over the tab's assistant session, which may not run yet, or ever. */
+export function publicAssistantActions(
+	session: AssistantSessionRef,
+): PublicAssistantActions {
+	return {
+		get isAvailable() {
+			return session.value !== null;
+		},
+		startConversation: (prompt, options) =>
+			session.value?.startConversation(prompt, options?.mode),
+	};
+}

package/frontend-vue/app/runtime/assistant-session.ts

@@ -17,6 +17,9 @@ export interface ChatPanelState {
 	toggle: () => void;
 }
 
+/** The approval modes a conversation can be started in from outside the panel. */
+export type ConversationStartMode = "plan" | "normal";
+
 /**
  * The tab's assistant, as the plugin that owns it hands it to the panel, the
  * command palette's answer and the workspace pages: the sidecar's
@@ -31,8 +34,11 @@ export interface AssistantSession {
 	navigate: (path: string) => void;
 	/** Opens the panel on that conversation. */
 	openConversation: (conversationId: string) => void;
-	/** Opens the panel on a new conversation, the composer optionally prefilled. */
-	startConversation: (prompt?: string) => void;
+	/**
+	 * Opens the panel on a new conversation, the composer optionally prefilled, and the
+	 * conversation set to `mode` first when one is given.
+	 */
+	startConversation: (prompt?: string, mode?: ConversationStartMode) => void;
 	/**
 	 * Keeps the tab's stream open while the panel is closed, until the returned
 	 * function releases it: the command palette's answer streams through it.

package/frontend-vue/app/runtime/panel-intents.ts

@@ -1,4 +1,5 @@
 import { type Ref, ref } from "vue";
+import type { ConversationStartMode } from "./assistant-session";
 
 /** Opens the panel on a stored conversation. */
 interface OpenConversationIntent {
@@ -6,10 +7,11 @@ interface OpenConversationIntent {
 	conversationId: string;
 }
 
-/** Opens the panel on a new conversation, the composer optionally prefilled. */
+/** Opens the panel on a new conversation, the composer optionally prefilled, in `mode` when given. */
 interface StartConversationIntent {
 	kind: "start";
 	prompt?: string;
+	mode?: ConversationStartMode;
 }
 
 /** Puts the caret in the composer of the current conversation. */

package/frontend-vue/app/views/ChangeSetPanel.vue

@@ -7,7 +7,7 @@ import { useAssistant } from "./composables/useAssistant";
 import { useChangeSetActions } from "./composables/useChangeSetActions";
 import { useViewFormat } from "./composables/useViewFormat";
 import { AI_ROUTES } from "./constants";
-import type { Tone } from "#dms-ui/app/types/tone";
+import type { Tone } from "#dms-core/app/types/tone";
 import type {
 	ChangeSetDetail,
 	ChangeSetSummary,

package/frontend-vue/app/views/composables/useAiData.ts

@@ -40,16 +40,10 @@ interface FetchErrorResponse {
 	status?: number;
 }
 
-interface FetchErrorBody {
-	message?: unknown;
-}
-
 interface FetchErrorLike {
 	status?: number;
 	statusCode?: number;
 	response?: FetchErrorResponse;
-	data?: FetchErrorBody;
-	message?: string;
 }
 
 /** The HTTP status of a `$authFetch` rejection, if it got an answer. */
@@ -60,14 +54,6 @@ function errorStatus(error: unknown): number | undefined {
 	);
 }
 
-/** The server's `{ message }`, else the error's own text. */
-export function errorMessage(error: unknown): string {
-	const candidate = error as FetchErrorLike | null;
-	const serverMessage = candidate?.data?.message;
-	if (typeof serverMessage === "string") return serverMessage;
-	return candidate?.message ?? String(error);
-}
-
 export function classifyFailure(error: unknown): RequestFailure {
 	return errorStatus(error) === HTTP_SERVICE_UNAVAILABLE
 		? "unavailable"
@@ -80,15 +66,21 @@ export function classifyFailure(error: unknown): RequestFailure {
  * whether the assistant isn't running (503) rather than an error.
  */
 function describeFailure(result: FailingRead): FailureDescription {
+	const { resolveError } = useApiErrorPresenter();
+	const notice = computed(() =>
+		result.error.value
+			? resolveError(result.error.value, {
+					fallbackKey: `dms_ai.views.${classifyFailure(result.error.value)}.description`,
+				})
+			: null,
+	);
 	return {
 		failure: computed(() =>
-			result.error.value && result.status.value !== "pending"
+			notice.value && result.status.value !== "pending"
 				? classifyFailure(result.error.value)
 				: null,
 		),
-		message: computed(() =>
-			result.error.value ? errorMessage(result.error.value) : "",
-		),
+		message: computed(() => notice.value?.message ?? ""),
 	};
 }
 

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

@@ -1,7 +1,7 @@
 import { ref, type Ref } from "vue";
 import { AI_ROUTES } from "../constants";
 import type { ChangeSetSummary } from "../types";
-import { classifyFailure, errorMessage } from "./useAiData";
+import { classifyFailure } from "./useAiData";
 
 export interface ChangeSetActions {
 	isBusy: Ref<boolean>;
@@ -28,23 +28,11 @@ function changeSetPath(changeSetId: string, action: string): string {
 export function useChangeSetActions(): ChangeSetActions {
 	const { t } = useI18n();
 	const toast = useToast();
+	const { presentError } = useApiErrorPresenter();
 	const { $authFetch } = useAuthFetch();
 	const { confirmFrom } = useConfirmFrom();
 	const isBusy = ref(false);
 
-	function failureToast(error: unknown): void {
-		const failure = classifyFailure(error);
-		toast.add({
-			title: t(`dms_ai.views.${failure}.title`),
-			description:
-				failure === "error"
-					? errorMessage(error)
-					: t("dms_ai.views.unavailable.description"),
-			color: "error",
-			icon: "i-ph-warning-circle",
-		});
-	}
-
 	async function redo(changeSet: ChangeSetSummary): Promise<void> {
 		isBusy.value = true;
 		try {
@@ -59,7 +47,9 @@ export function useChangeSetActions(): ChangeSetActions {
 			});
 			await refreshPageBlocks();
 		} catch (error) {
-			failureToast(error);
+			presentError(error, {
+				fallbackKey: `dms_ai.views.${classifyFailure(error)}.description`,
+			});
 		} finally {
 			isBusy.value = false;
 		}

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

@@ -1,5 +1,5 @@
 import type { ActivityResult, AllowedBy } from "./types";
-import type { Tone } from "#dms-ui/app/types/tone";
+import type { Tone } from "#dms-core/app/types/tone";
 
 export const AI_ROUTES = {
 	status: "/ai/status",

package/frontend-vue/app/views/types.ts

@@ -1,4 +1,4 @@
-import type { Tone } from "#dms-ui/app/types/tone";
+import type { Tone } from "#dms-core/app/types/tone";
 
 type AgentId = "claude" | "codex";
 export type ScopeId = "safe" | "vibe";

package/frontend-vue/build/backend-boundary.ts

@@ -0,0 +1,122 @@
+import { existsSync, readFileSync, realpathSync } from "node:fs";
+import { dirname, isAbsolute, join, relative, sep } from "node:path";
+import type { DmsVitePluginEntry } from "#dms/frontend-build";
+
+type VitePlugin = Extract<DmsVitePluginEntry, { name: string }>;
+
+const BACKEND_PACKAGE = "@antelopejs/dms-ai";
+const BACKEND_SOURCE = "src";
+const QUERY_OR_HASH = /[?#].*$/;
+
+const backendRoots = new Map<string, string | null>();
+
+/** Whether a parsed manifest names its package. */
+function isNamedManifest(value: unknown): value is { name: string } {
+	return (
+		typeof value === "object" &&
+		value !== null &&
+		"name" in value &&
+		typeof value.name === "string"
+	);
+}
+
+/** The package name a `package.json` declares, or `undefined`. */
+function packageName(manifest: string): string | undefined {
+	try {
+		const parsed: unknown = JSON.parse(readFileSync(manifest, "utf8"));
+		return isNamedManifest(parsed) ? parsed.name : undefined;
+	} catch {
+		return undefined;
+	}
+}
+
+/** The directory of the backend package that holds `directory`, or null. */
+function backendRoot(directory: string): string | null {
+	const known = backendRoots.get(directory);
+	if (known !== undefined) {
+		return known;
+	}
+	const manifest = join(directory, "package.json");
+	const parent = dirname(directory);
+	let root: string | null = null;
+	if (existsSync(manifest)) {
+		root = packageName(manifest) === BACKEND_PACKAGE ? directory : null;
+	} else if (parent !== directory) {
+		root = backendRoot(parent);
+	}
+	backendRoots.set(directory, root);
+	return root;
+}
+
+/**
+ * The real path of a resolved module id when it lies under the `src`
+ * directory of the backend package, or `undefined`. The package that owns the
+ * file decides, not a path, so the answer is the same in the repository and in
+ * the build workspace. Virtual ids and ids that are not files are ignored.
+ */
+function backendSourceFile(id: string): string | undefined {
+	const path = id.replace(QUERY_OR_HASH, "");
+	if (!isAbsolute(path)) {
+		return undefined;
+	}
+	let real: string;
+	try {
+		real = realpathSync(path);
+	} catch {
+		return undefined;
+	}
+	const root = backendRoot(dirname(real));
+	if (root === null) {
+		return undefined;
+	}
+	return relative(root, real).split(sep)[0] === BACKEND_SOURCE
+		? real
+		: undefined;
+}
+
+/**
+ * Fails the build and the dev server when a module of the frontend resolves to
+ * a file under the `src` of the backend package: the browser reaches the
+ * backend only through its HTTP interface. It checks what the whole resolution
+ * chain returns, an id marked external included, so an alias is seen through
+ * and a symlink the resolver returns is followed to its real path, and it runs
+ * before the other plugins (`enforce: "pre"`). Vite builds workers with their
+ * own plugin list, so the plugin adds itself there too.
+ *
+ * antelopejs-sync writes this file from `@antelopejs/tooling-configs` and
+ * restores it on every run: change the plugin in the pack, not here.
+ */
+export function backendBoundary(): VitePlugin {
+	return {
+		...boundaryCheck(),
+		config: () => ({ worker: { plugins: () => [boundaryCheck()] } }),
+	};
+}
+
+/** The check alone, as a worker build runs it. */
+function boundaryCheck(): VitePlugin {
+	return {
+		name: `${BACKEND_PACKAGE}:backend-boundary`,
+		enforce: "pre",
+		async resolveId(source, importer, options) {
+			const resolved = await this.resolve(source, importer, {
+				...options,
+				skipSelf: true,
+			});
+			if (resolved === null) {
+				return resolved;
+			}
+			const file = backendSourceFile(resolved.id);
+			if (file === undefined) {
+				return resolved;
+			}
+			const from =
+				importer === undefined
+					? "an entry point"
+					: importer.replace(QUERY_OR_HASH, "");
+			return this.error(
+				`Backend boundary: ${from} imports ${file}, which is under the src of ${BACKEND_PACKAGE}. The frontend reaches the backend only through its HTTP interface.`,
+			);
+		},
+	};
+}

package/frontend-vue/dms.frontend.build.ts

@@ -0,0 +1,6 @@
+import { defineDmsFrontendBuild } from "#dms/frontend-build";
+import { backendBoundary } from "./build/backend-boundary.ts";
+
+export default defineDmsFrontendBuild((build) => {
+	build.registerVitePlugins(() => [backendBoundary()]);
+});

package/frontend-vue/package.json

@@ -6,7 +6,7 @@
 	"license": "Apache-2.0",
 	"packageManager": "pnpm@10.6.5",
 	"engines": {
-		"@antelopejs/dms-frontend": ">=0.9.0 <0.10.0"
+		"@antelopejs/dms-frontend": ">=0.9.1 <0.10.0"
 	},
 	"scripts": {
 		"build": "pnpm --dir \"${DMS_FRONTEND_WORKSPACE:?Set DMS_FRONTEND_WORKSPACE to the generated Inertia workspace}\" build",
@@ -37,6 +37,7 @@
 		"prettier-plugin-tailwindcss": "^0.6.11",
 		"typescript": "^5.8.2",
 		"typescript-eslint": "^8.0.0",
+		"vite": "^7.3.2",
 		"vitest": "^4.1.5",
 		"vue-tsc": "^3.1.1"
 	}

package/frontend-vue/pnpm-lock.yaml

@@ -60,6 +60,9 @@ importers:
       typescript-eslint:
         specifier: ^8.0.0
         version: 8.70.0(eslint@9.39.4(jiti@2.7.0))(typescript@5.9.3)
+      vite:
+        specifier: ^7.3.2
+        version: 7.3.2(jiti@2.7.0)(terser@5.46.2)(yaml@2.8.4)
       vitest:
         specifier: ^4.1.5
         version: 4.1.5(jsdom@29.1.1)(vite@7.3.2(jiti@2.7.0)(terser@5.46.2)(yaml@2.8.4))

package/frontend-vue/tests/assistant-actions.test.ts

@@ -0,0 +1,72 @@
+// @vitest-environment jsdom
+import { flushPromises } from "@vue/test-utils";
+import { afterEach, describe, expect, it } from "vitest";
+import { shallowRef } from "vue";
+import { publicAssistantActions } from "../app/runtime/assistant-actions";
+import {
+	createHarness,
+	openPanel,
+	sentOfType,
+	unmountPanel,
+} from "./support/panel-harness";
+
+afterEach(() => {
+	unmountPanel();
+});
+
+const PROMPT =
+	"Use dms-external-database on connection roaster, module builder-db-roaster-tables.";
+
+describe("the assistant actions another module's layer injects", () => {
+	it("start a new conversation with the composer prefilled and nothing sent", async () => {
+		const harness = createHarness();
+		const panel = await openPanel(harness);
+		const actions = publicAssistantActions(shallowRef(harness.session));
+		expect(actions.isAvailable).toBe(true);
+		actions.startConversation(PROMPT);
+		await flushPromises();
+		expect((panel.find("textarea").element as HTMLTextAreaElement).value).toBe(
+			PROMPT,
+		);
+		expect(sentOfType(harness, "user_message")).toEqual([]);
+		expect(sentOfType(harness, "set_conversation_mode")).toEqual([]);
+	});
+
+	it("set the new conversation to plan mode before prefilling it, when asked", async () => {
+		const harness = createHarness();
+		const panel = await openPanel(harness);
+		const actions = publicAssistantActions(shallowRef(harness.session));
+		actions.startConversation(PROMPT, { mode: "plan" });
+		await flushPromises();
+		const started = sentOfType(harness, "hello").at(-1)?.conversationId;
+		expect(sentOfType(harness, "set_conversation_mode")).toEqual([
+			expect.objectContaining({ conversationId: started, mode: "plan" }),
+		]);
+		expect((panel.find("textarea").element as HTMLTextAreaElement).value).toBe(
+			PROMPT,
+		);
+	});
+
+	it("set plan mode once the stream is up, when the panel opens before it", async () => {
+		const harness = createHarness();
+		await openPanel(harness);
+		harness.setChannelStatus("disconnected");
+		publicAssistantActions(shallowRef(harness.session)).startConversation(
+			PROMPT,
+			{ mode: "plan" },
+		);
+		await flushPromises();
+		expect(sentOfType(harness, "set_conversation_mode")).toEqual([]);
+		harness.setChannelStatus("connected");
+		await flushPromises();
+		expect(sentOfType(harness, "set_conversation_mode")).toEqual([
+			expect.objectContaining({ mode: "plan" }),
+		]);
+	});
+
+	it("are unavailable without a session, and starting then does nothing", () => {
+		const actions = publicAssistantActions(shallowRef(null));
+		expect(actions.isAvailable).toBe(false);
+		expect(() => actions.startConversation(PROMPT)).not.toThrow();
+	});
+});