@object-ui/app-shell 6.2.3 → 7.1.0

package/dist/console/ai/AiChatPage.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
 /**
  * AiChatPage — full-page ChatGPT-style AI surface.
@@ -13,16 +13,158 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * turns are appended to `ai_messages` automatically.
  */
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useNavigate, useParams } from 'react-router-dom';
+import { useNavigate, useParams, useSearchParams } from 'react-router-dom';
 import { useAuth } from '@object-ui/auth';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Button, ShareDialog, } from '@object-ui/components';
-import { Share2 } from 'lucide-react';
-import { ChatbotEnhanced, useAgents, useObjectChat, useHitlInChat, } from '@object-ui/plugin-chatbot';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { toast } from 'sonner';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Button, ShareDialog, Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle, cn, } from '@object-ui/components';
+import { PanelLeft, PanelLeftClose, PanelLeftOpen, Share2 } from 'lucide-react';
+import { ChatbotEnhanced, useAgents, useObjectChat, useHitlInChat, resolveDefaultAgentName, PLATFORM_DEFAULT_AGENT, agentRouteName, resolveAgentParam, isBuiltinAgentName, isBuildAgent, isAskAgent, publishHealthFromResponse, detectDraftResult, detectProposedPlan, buildProgressFromDraftReview, } from '@object-ui/plugin-chatbot';
 import { AppHeader } from '../../layout/AppHeader';
+import { fetchPendingDraftCount } from '../../preview/draftStatus';
+import { emitMetadataRefresh } from '../../assistant/assistantBus';
+import { getRuntimeConfig } from '../../runtime-config';
+import { cloudPricingDeepLink } from '../marketplace/marketplaceApi';
 import { useNavigationContext } from '../../context/NavigationContext';
-import { useChatConversation } from '../../hooks/useChatConversation';
+import { fetchConversation, sanitizeChatMessagesForCache, useChatConversation, writeConversationMessagesCache, } from '../../hooks/useChatConversation';
+import { useReconcileOnError } from '../../hooks/useReconcileOnError';
 import { ConversationsSidebar } from './ConversationsSidebar';
+import { LiveCanvas } from './LiveCanvas';
 const DEFAULT_AI_PATH = '/api/v1/ai';
+function partString(part, key) {
+    const value = part[key];
+    return typeof value === 'string' && value.length > 0 ? value : undefined;
+}
+function partToolState(part) {
+    const state = partString(part, 'state');
+    switch (state) {
+        // Hydrated history is never a live stream: the turn that drove these
+        // tools has ENDED, so a dangling mid-stream state means the terminal
+        // state was never snapshotted server-side — promote to Completed or a
+        // reloaded build conversation shows every tool "Running" forever (the
+        // same incident mapMessages fixed for the floating-chat path).
+        case 'input-streaming':
+        case 'input-available':
+            return 'output-available';
+        case 'approval-requested':
+        case 'approval-responded':
+        case 'output-available':
+        case 'output-error':
+        case 'output-denied':
+            return state;
+        default:
+            // No state at all: server-side conversations persist ModelMessage
+            // `tool-call` content entries, which carry no UI state — contentToParts
+            // passes them through as `tool-call` parts verbatim. In hydrated
+            // history that turn has ended too, so stateless ≡ completed; returning
+            // undefined here leaves the invocation state-less and the chip renders
+            // "Running" forever (the live-verified gap left by the first fix).
+            return 'output-available';
+    }
+}
+/** Exported for tests — maps persisted/cached history to renderable messages. */
+export function hydratedMessagesToChatMessages(messages) {
+    return messages.map((message) => {
+        const toolInvocations = [];
+        let buildProgress;
+        const content = message.parts
+            .filter((part) => part.type === 'text')
+            .map((part) => part.text ?? '')
+            .join('');
+        if (message.role === 'assistant') {
+            for (const part of message.parts) {
+                if (!part.type.startsWith('tool-'))
+                    continue;
+                const toolName = partString(part, 'toolName') ?? part.type.slice('tool-'.length);
+                const toolCallId = partString(part, 'toolCallId') ?? `${message.id}-${toolName}`;
+                const state = partToolState(part);
+                // The tool RESULT (merged onto the call part by toUIMessages from the
+                // separate `tool` row) carries the ADR-0033 draft envelope. Rebuild
+                // `draftReview` so the publish / preview / review affordances return,
+                // and synthesize the "Built X" panel so the blueprint summary survives
+                // a refresh (the live progress bar is transient and not persisted).
+                const result = part.output ?? part.result;
+                const draftReview = detectDraftResult(result);
+                // The pre-build PLAN (propose_blueprint → blueprint_proposed) rides the
+                // same merged tool result; lift it so the "Proposed plan" review card
+                // survives a reload on this surface, not just in the floating chat.
+                const proposedPlan = detectProposedPlan(result);
+                toolInvocations.push({
+                    toolCallId,
+                    toolName,
+                    ...(state ? { state } : {}),
+                    ...(result !== undefined ? { result } : {}),
+                    ...(draftReview ? { draftReview } : {}),
+                    ...(proposedPlan ? { proposedPlan } : {}),
+                    ...(part.errorText ? { errorText: String(part.errorText) } : {}),
+                });
+                if (!buildProgress) {
+                    const synthesized = buildProgressFromDraftReview(draftReview);
+                    if (synthesized)
+                        buildProgress = synthesized;
+                }
+            }
+        }
+        return {
+            id: message.id,
+            role: message.role,
+            content,
+            ...(toolInvocations.length > 0 ? { toolInvocations } : {}),
+            ...(buildProgress ? { buildProgress } : {}),
+        };
+    });
+}
+function firstUserMessageText(messages) {
+    const message = messages.find((item) => item.role === 'user');
+    const text = message?.parts
+        .filter((part) => part.type === 'text')
+        .map((part) => part.text ?? '')
+        .join('')
+        .trim();
+    return text || undefined;
+}
+// Keyed by the FRIENDLY agent name (alias-group head) so the new id, the legacy
+// id, and the route segment all localize to the same label.
+const PLATFORM_AGENT_LABEL_KEYS = {
+    ask: { key: 'console.ai.agentLabels.ask', defaultValue: 'Ask' },
+    build: { key: 'console.ai.agentLabels.build', defaultValue: 'Build' },
+};
+function localizeAgentLabel(t, agentName, fallback) {
+    const known = agentName ? PLATFORM_AGENT_LABEL_KEYS[agentRouteName(agentName)] : undefined;
+    if (!known)
+        return fallback;
+    return t(known.key, { defaultValue: known.defaultValue });
+}
+/**
+ * Per-surface empty-state branding. The split gives each assistant its own
+ * identity: the Build surface reads as authoring ("describe an app"), the Ask
+ * surface as data Q&A ("ask about your records"). Keyed by friendly name; falls
+ * back to the generic empty state for custom agents.
+ */
+function agentEmptyState(t, agentName) {
+    if (isBuildAgent(agentName)) {
+        return {
+            title: t('console.ai.empty.build.title', { defaultValue: 'Build with AI' }),
+            description: t('console.ai.empty.build.description', {
+                defaultValue: 'Describe an app or workflow in plain language — I draft the objects, screens and automations, then you review and publish.',
+            }),
+        };
+    }
+    if (isAskAgent(agentName)) {
+        return {
+            title: t('console.ai.empty.ask.title', { defaultValue: 'Ask your data' }),
+            description: t('console.ai.empty.ask.description', {
+                defaultValue: 'Ask questions about your records — counts, lists, and summaries across the data you can access.',
+            }),
+        };
+    }
+    return {
+        title: t('console.ai.emptyTitle', { defaultValue: 'Start a conversation' }),
+        description: t('console.ai.emptyDescription', {
+            defaultValue: 'Ask anything — the assistant has access to your current app context.',
+        }),
+    };
+}
 function resolveApiBase(explicit) {
     if (explicit)
         return explicit.replace(/\/$/, '');
@@ -33,10 +175,194 @@ function resolveApiBase(explicit) {
     const serverUrl = env.VITE_SERVER_URL ?? '';
     return `${serverUrl.replace(/\/$/, '')}${DEFAULT_AI_PATH}`;
 }
+const CHATS_COLLAPSED_STORAGE_KEY = 'ai-chats-collapsed';
+/**
+ * State for the collapsible desktop conversations list. Exported for tests.
+ *
+ * Two drivers, one rule — never fight the user:
+ *  - **Manual** `toggle()` flips it and PERSISTS the preference (localStorage),
+ *    and marks the user as having taken control.
+ *  - **Auto** `handleCanvasOpenChange(open)` tucks the list away when the Live
+ *    Canvas preview opens (the chat + preview split is tight) and restores it on
+ *    close — but ONLY if the auto-collapse is what hid it. A manual toggle (or a
+ *    list the user already collapsed) is never overridden, and auto-collapse is
+ *    transient (not persisted).
+ */
+export function useCollapsibleChatsList() {
+    const [collapsed, setCollapsed] = useState(() => {
+        try {
+            return localStorage.getItem(CHATS_COLLAPSED_STORAGE_KEY) === '1';
+        }
+        catch {
+            return false;
+        }
+    });
+    const autoCollapsedRef = useRef(false);
+    const toggle = useCallback(() => {
+        autoCollapsedRef.current = false; // an explicit toggle is the user taking control
+        setCollapsed((prev) => {
+            const next = !prev;
+            try {
+                localStorage.setItem(CHATS_COLLAPSED_STORAGE_KEY, next ? '1' : '0');
+            }
+            catch {
+                /* private mode / disabled storage — preference just won't persist */
+            }
+            return next;
+        });
+    }, []);
+    const handleCanvasOpenChange = useCallback((open) => {
+        if (open) {
+            setCollapsed((prev) => {
+                if (!prev) {
+                    autoCollapsedRef.current = true;
+                    return true;
+                }
+                return prev; // already collapsed (manual) — leave it, don't claim it
+            });
+        }
+        else if (autoCollapsedRef.current) {
+            autoCollapsedRef.current = false;
+            setCollapsed(false);
+        }
+    }, []);
+    return { collapsed, toggle, handleCanvasOpenChange };
+}
+const CHAT_PANE_WIDTH_STORAGE_KEY = 'ai-chat-pane-width';
+/** Default chat-column width (px) when the preview opens. */
+const CHAT_PANE_DEFAULT_WIDTH = 480;
+/** Chat column never narrower than this. */
+const CHAT_PANE_MIN_WIDTH = 360;
+/** Preview pane always keeps at least this much room (caps how wide chat can grow). */
+const CHAT_PREVIEW_MIN_WIDTH = 420;
+/** Keyboard resize step (px) when the divider is focused. */
+const CHAT_PANE_KEYBOARD_STEP = 24;
+/**
+ * Clamp a desired chat-column width so neither pane collapses: at least
+ * `min`, and never so wide that the preview drops below `previewMin`. Pure +
+ * exported for tests. `containerWidth <= 0` (unmeasured) skips the upper bound.
+ */
+export function clampChatPaneWidth(desired, opts) {
+    const upper = opts.containerWidth > 0 ? Math.max(opts.min, opts.containerWidth - opts.previewMin) : Infinity;
+    return Math.min(Math.max(desired, opts.min), upper);
+}
+/**
+ * Draggable width for the chat column when the Live Canvas preview is open
+ * (ChatGPT/Claude-style split). Width persists; drags and keyboard nudges are
+ * clamped against the live container so the preview always keeps room, and a
+ * ResizeObserver re-clamps when the window shrinks. All DOM reads happen in
+ * handlers/effects, never during render.
+ */
+export function useResizableChatPane(active) {
+    const containerRef = useRef(null);
+    const [width, setWidth] = useState(() => {
+        try {
+            const saved = Number(localStorage.getItem(CHAT_PANE_WIDTH_STORAGE_KEY));
+            return Number.isFinite(saved) && saved > 0 ? saved : CHAT_PANE_DEFAULT_WIDTH;
+        }
+        catch {
+            return CHAT_PANE_DEFAULT_WIDTH;
+        }
+    });
+    const [dragging, setDragging] = useState(false);
+    const clampToContainer = useCallback((desired) => clampChatPaneWidth(desired, {
+        min: CHAT_PANE_MIN_WIDTH,
+        previewMin: CHAT_PREVIEW_MIN_WIDTH,
+        containerWidth: containerRef.current?.clientWidth ?? 0,
+    }), []);
+    const persist = useCallback((w) => {
+        try {
+            localStorage.setItem(CHAT_PANE_WIDTH_STORAGE_KEY, String(Math.round(w)));
+        }
+        catch {
+            /* storage disabled — width just won't persist */
+        }
+    }, []);
+    // Re-clamp when the available width changes (window resize, sidebar collapse),
+    // so a previously-saved wide chat can't starve the preview.
+    useEffect(() => {
+        if (!active)
+            return;
+        const el = containerRef.current;
+        if (!el || typeof ResizeObserver === 'undefined')
+            return;
+        const ro = new ResizeObserver(() => setWidth((w) => clampToContainer(w)));
+        ro.observe(el);
+        return () => ro.disconnect();
+    }, [active, clampToContainer]);
+    const onHandlePointerDown = useCallback((e) => {
+        e.preventDefault();
+        const startX = e.clientX;
+        const startWidth = width; // state is the style source, so it == the rendered width
+        setDragging(true);
+        const onMove = (ev) => setWidth(clampToContainer(startWidth + (ev.clientX - startX)));
+        const onUp = (ev) => {
+            const final = clampToContainer(startWidth + (ev.clientX - startX));
+            setWidth(final);
+            persist(final);
+            setDragging(false);
+            window.removeEventListener('pointermove', onMove);
+            window.removeEventListener('pointerup', onUp);
+        };
+        window.addEventListener('pointermove', onMove);
+        window.addEventListener('pointerup', onUp);
+    }, [clampToContainer, persist, width]);
+    const onHandleKeyDown = useCallback((e) => {
+        const delta = e.key === 'ArrowLeft' ? -CHAT_PANE_KEYBOARD_STEP : e.key === 'ArrowRight' ? CHAT_PANE_KEYBOARD_STEP : 0;
+        if (!delta)
+            return;
+        e.preventDefault();
+        setWidth((w) => {
+            const next = clampToContainer(w + delta);
+            persist(next);
+            return next;
+        });
+    }, [clampToContainer, persist]);
+    const reset = useCallback(() => {
+        const next = clampToContainer(CHAT_PANE_DEFAULT_WIDTH);
+        setWidth(next);
+        persist(next);
+    }, [clampToContainer, persist]);
+    return { width, dragging, containerRef, onHandlePointerDown, onHandleKeyDown, reset };
+}
+/**
+ * Match a keydown to an AI-chat shortcut, mirroring ChatGPT/Claude:
+ *  - ⌘/Ctrl+Shift+O → new chat
+ *  - ⌘/Ctrl+Shift+S → toggle the conversations list
+ *
+ * Both use the ⌘/Ctrl+Shift modifier so they're safe to fire even while the
+ * composer is focused (they can't be produced by ordinary typing). Pure +
+ * exported for tests.
+ */
+export function matchAiChatShortcut(e) {
+    if (!(e.metaKey || e.ctrlKey) || !e.shiftKey || e.altKey)
+        return null;
+    switch (e.key.toLowerCase()) {
+        case 'o':
+            return 'new-chat';
+        case 's':
+            return 'toggle-list';
+        default:
+            return null;
+    }
+}
 export function AiChatPage({ apiBase: apiBaseProp, defaultAgent: defaultAgentProp } = {}) {
     const { user } = useAuth();
+    const { t } = useObjectTranslation();
     const userId = user?.id;
-    const { conversationId: urlConversationId } = useParams();
+    // The agent is BAKED INTO THE ROUTE now: `/ai/:agent[/:conversationId]`.
+    // Deriving it from the path param (resolved against the live catalog) removes
+    // the old `?agent=` query snapshot, which StrictMode's double-mount + the
+    // `/ai`→`/ai/:id` URL rewrite used to drop (the metadata_assistant deep-link
+    // bug). The dropdown is now a launcher that navigates between these routes.
+    const { agent: agentSegment, conversationId: urlConversationId } = useParams();
+    const [searchParams] = useSearchParams();
+    const searchString = searchParams.toString();
+    // Explicit new-conversation intent (`?new=1`, the sidebar's New button).
+    // Read LIVE (not snapshotted): the button can be clicked again later from an
+    // existing conversation, and the flag is stripped once the fresh id is
+    // mirrored into the URL.
+    const forceNewConversation = searchParams.get('new') !== null;
     const navigate = useNavigate();
     const { setContext } = useNavigationContext();
     useEffect(() => {
@@ -46,33 +372,191 @@ export function AiChatPage({ apiBase: apiBaseProp, defaultAgent: defaultAgentPro
     const env = import.meta.env ?? {};
     const envDefaultAgent = env.VITE_AI_DEFAULT_AGENT;
     const { agents, isLoading: agentsLoading, error: agentsError } = useAgents({ apiBase });
-    const [activeAgent, setActiveAgent] = useState(undefined);
-    useEffect(() => {
-        if (!activeAgent && agents.length > 0) {
-            const preferred = defaultAgentProp ?? envDefaultAgent;
-            const match = preferred ? agents.find((a) => a.name === preferred) : undefined;
-            setActiveAgent((match ?? agents[0]).name);
+    const catalogNames = useMemo(() => agents.map((a) => a.name), [agents]);
+    // Is the first path segment an agent? It is when it resolves to one (friendly
+    // alias / new id / legacy id). When it doesn't, it's a legacy bare
+    // `/ai/:conversationId` link (redirected below). `undefined` = catalog still
+    // loading, so we can't tell yet and redirects must wait.
+    const segmentIsAgent = useMemo(() => {
+        if (!agentSegment)
+            return false;
+        if (agents.length === 0)
+            return undefined;
+        return resolveAgentParam(agentSegment, catalogNames) !== undefined;
+    }, [agentSegment, agents.length, catalogNames]);
+    // Back-compat: the legacy deep-link `/ai?agent=metadata_assistant` (only
+    // meaningful on a bare `/ai`, before the agent moved into the path). Honored
+    // here, then stripped as the route is canonicalized to `/ai/:agent`.
+    const legacyAgentParam = !agentSegment ? searchParams.get('agent') ?? undefined : undefined;
+    // App/platform default — used for a bare `/ai` (respecting the legacy
+    // `?agent=`), and as the endpoint while a legacy bare-id link is being
+    // redirected to its real agent surface.
+    const fallbackAgent = useMemo(() => resolveDefaultAgentName(agents, legacyAgentParam ?? defaultAgentProp ?? envDefaultAgent), [agents, legacyAgentParam, defaultAgentProp, envDefaultAgent]);
+    // Resolved backend agent name for this surface (route agent wins; else default).
+    const activeAgent = useMemo(() => {
+        if (agents.length === 0)
+            return undefined;
+        if (agentSegment && segmentIsAgent) {
+            return resolveAgentParam(agentSegment, catalogNames);
         }
-    }, [agents, activeAgent, defaultAgentProp, envDefaultAgent]);
+        return fallbackAgent;
+    }, [agents.length, agentSegment, segmentIsAgent, catalogNames, fallbackAgent]);
+    const activeAgentRoute = activeAgent ? agentRouteName(activeAgent) : undefined;
+    // A KNOWN built-in agent (build/ask/…) that the live catalog doesn't serve —
+    // e.g. `/ai/build` on a deployment without the cloud AI Studio plugin. It's
+    // an unavailable AGENT, not a conversation id, so we fall back to the default
+    // surface instead of treating "build" as a chat to load.
+    const unavailableKnownAgent = Boolean(agentSegment && segmentIsAgent === false && isBuiltinAgentName(agentSegment));
+    // A first segment that ISN'T an agent and ISN'T a known (unavailable) agent
+    // name is a legacy bare conversation id.
+    const legacyConversationId = agentSegment && segmentIsAgent === false && !unavailableKnownAgent ? agentSegment : undefined;
     const chatApi = activeAgent
         ? `${apiBase}/agents/${encodeURIComponent(activeAgent)}/chat`
         : undefined;
-    const { conversationId, initialMessages, isLoading: convoLoading } = useChatConversation({
-        userId,
+    const { conversationId, conversationScope, initialMessages } = useChatConversation({
+        // Gate resolution on the agent being known: resolving while `activeAgent`
+        // is still undefined (catalog loading) would bind a SCOPELESS conversation
+        // that the per-(user,scope) guard then sticks with — so the agent surface
+        // would resume some other agent's last chat. Waiting one tick keys the
+        // conversation to the right agent from the first resolve.
+        userId: activeAgent ? userId : undefined,
         scope: activeAgent,
         apiBase,
-        activeId: urlConversationId,
+        activeId: urlConversationId ?? legacyConversationId,
+        forceNew: forceNewConversation,
     });
+    // ── Route canonicalization ──────────────────────────────────────────────
+    // Back-compat redirects (the agent is now in the path): bare `/ai` → the
+    // default agent surface (or the `?agent=` deep-link target); a legacy built-in
+    // id in the agent slot (`/ai/metadata_assistant`) → its friendly form
+    // (`/ai/build`). Custom agents already route by their own name and no-op here.
+    // The `?new=1` intent is preserved; the consumed legacy `agent` param is
+    // stripped so it doesn't linger in the canonical URL.
+    useEffect(() => {
+        if (agents.length === 0 || !activeAgent)
+            return;
+        const friendly = agentRouteName(activeAgent);
+        const preserved = new URLSearchParams(searchString);
+        preserved.delete('agent');
+        const preservedQuery = preserved.toString() ? `?${preserved.toString()}` : '';
+        if (!agentSegment) {
+            navigate(`/ai/${friendly}${preservedQuery}`, { replace: true });
+            return;
+        }
+        // A known agent that isn't deployed here (e.g. `/ai/build` with no cloud AI
+        // Studio): land cleanly on the default surface rather than treating the
+        // segment as a conversation id (which produced the junk `/ai/ask/build`).
+        if (unavailableKnownAgent) {
+            navigate(`/ai/${friendly}${preservedQuery}`, { replace: true });
+            return;
+        }
+        if (segmentIsAgent && agentSegment !== friendly) {
+            const tail = urlConversationId ? `/${encodeURIComponent(urlConversationId)}` : '';
+            navigate(`/ai/${friendly}${tail}${preservedQuery}`, { replace: true });
+        }
+    }, [agents.length, activeAgent, agentSegment, segmentIsAgent, unavailableKnownAgent, urlConversationId, searchString, navigate]);
+    // ── Legacy `/ai/:conversationId` (bare id) ──────────────────────────────
+    // Resolve the conversation's own agent and 301 to `/ai/:agent/:conversationId`
+    // so old bookmarks keep working under the agent-scoped routes.
+    useEffect(() => {
+        if (legacyConversationId === undefined)
+            return;
+        let cancelled = false;
+        (async () => {
+            let convAgent;
+            try {
+                const conv = await fetchConversation(apiBase, legacyConversationId);
+                convAgent = conv?.agentId ?? undefined;
+            }
+            catch {
+                /* gone / inaccessible — fall back to the default surface below */
+            }
+            if (cancelled)
+                return;
+            const resolved = resolveAgentParam(convAgent ?? '', catalogNames);
+            const friendly = agentRouteName(resolved ?? activeAgent ?? PLATFORM_DEFAULT_AGENT);
+            navigate(`/ai/${friendly}/${encodeURIComponent(legacyConversationId)}`, { replace: true });
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [legacyConversationId, apiBase, catalogNames, activeAgent, navigate]);
     const [refreshKey, setRefreshKey] = useState(0);
+    const [titleHints, setTitleHints] = useState({});
     const [shareOpen, setShareOpen] = useState(false);
-    const restApiBase = useMemo(() => apiBase.replace(/\/v1\/ai$/, '').replace(/\/ai$/, '') || '/api', [apiBase]);
-    // After the hook resolves a real id for a fresh `/ai` visit, mirror it into
-    // the URL so the sidebar's active-row + share/refresh both work.
+    const [mobileChatsOpen, setMobileChatsOpen] = useState(false);
+    const { collapsed: chatsCollapsed, toggle: toggleChatsCollapsed, handleCanvasOpenChange, } = useCollapsibleChatsList();
+    // Keyboard shortcuts (ChatGPT/Claude parity): ⌘⇧O new chat, ⌘⇧S toggle list.
     useEffect(() => {
-        if (!urlConversationId && conversationId) {
-            navigate(`/ai/${conversationId}`, { replace: true });
+        const onKeyDown = (e) => {
+            const action = matchAiChatShortcut(e);
+            if (!action)
+                return;
+            e.preventDefault();
+            if (action === 'toggle-list')
+                toggleChatsCollapsed();
+            else
+                navigate(activeAgentRoute ? `/ai/${activeAgentRoute}?new=1` : '/ai?new=1');
+        };
+        document.addEventListener('keydown', onKeyDown);
+        return () => document.removeEventListener('keydown', onKeyDown);
+    }, [toggleChatsCollapsed, navigate, activeAgentRoute]);
+    const restApiBase = useMemo(() => apiBase.replace(/\/v1\/ai$/, '').replace(/\/ai$/, '') || '/api', [apiBase]);
+    // Public share-link landing base. SharedRecordPage lives UNDER the console
+    // SPA basename (e.g. `/_console/s/:token`), so the ShareDialog default of
+    // `${origin}/s/:token` 404s for recipients. Derive the base from the SPA's
+    // BASE_URL so the copyable link points at the actually-served route.
+    const publicShareBase = useMemo(() => {
+        if (typeof window === 'undefined' || typeof document === 'undefined')
+            return undefined;
+        // Mirror the console's own basename resolution (App.tsx resolveBasename):
+        // the published SPA uses a relative Vite base, so the mount path is carried
+        // by the injected `<base href>` tag, NOT import.meta.env.BASE_URL.
+        let base = '';
+        try {
+            const href = document.querySelector('base')?.getAttribute('href');
+            if (href)
+                base = new URL(href, window.location.origin).pathname.replace(/\/+$/, '');
         }
-    }, [urlConversationId, conversationId, navigate]);
+        catch { /* no <base> → root-mounted SPA */ }
+        return `${window.location.origin}${base}/s`;
+    }, []);
+    // New-conversation race guard. On an IN-SPA `/ai?new=1` navigation the
+    // URL-mirroring effect below fires in the SAME commit as the hook's effect,
+    // with this render's (stale) `conversationId` still in its closure — the
+    // hook's setConversationId(undefined) hasn't re-rendered yet. Unguarded, it
+    // bounced straight back to `/ai/:oldId` and stripped the flag before the
+    // fresh conversation existed (the New button looked like a no-op; a full
+    // page load on the same URL worked because state starts empty). Snapshot
+    // the id visible when the flag appears — a RENDER-phase ref write, so it's
+    // set before any effect of this commit runs — and refuse to mirror that
+    // exact id while the flag is up. The fresh id differs, mirrors normally,
+    // and the navigation strips `?new=1`, which resets the snapshot.
+    const staleNewTargetRef = useRef(null);
+    if (forceNewConversation) {
+        if (staleNewTargetRef.current === null)
+            staleNewTargetRef.current = { id: conversationId };
+    }
+    else {
+        staleNewTargetRef.current = null;
+    }
+    // After the hook resolves a real id for a fresh agent-surface visit, mirror
+    // it into the URL (`/ai/:agent/:id`) so the sidebar's active-row + share +
+    // refresh all work. Only fires on a real agent surface that has no id yet —
+    // not while a bare `/ai` or a legacy bare id is still being redirected.
+    useEffect(() => {
+        if (!segmentIsAgent || urlConversationId || !conversationId || !activeAgentRoute)
+            return;
+        if (staleNewTargetRef.current && staleNewTargetRef.current.id === conversationId)
+            return;
+        // Don't mirror a conversation that belongs to the PREVIOUS agent: right
+        // after a launcher switch, `conversationId` still holds the old agent's id
+        // until the hook re-resolves under the new scope. Mirroring it would write
+        // it onto the new agent's URL and resume the wrong chat.
+        if (conversationScope !== activeAgent)
+            return;
+        navigate(`/ai/${activeAgentRoute}/${conversationId}`, { replace: true });
+    }, [segmentIsAgent, urlConversationId, conversationId, conversationScope, activeAgent, activeAgentRoute, navigate]);
     const titledRef = useRef(new Set());
     // A resumed conversation already has history; treat it as already-titled
     // so we don't clobber the original title on the next user turn.
@@ -81,9 +565,20 @@ export function AiChatPage({ apiBase: apiBaseProp, defaultAgent: defaultAgentPro
             titledRef.current.add(conversationId);
         }
     }, [conversationId, initialMessages.length]);
+    useEffect(() => {
+        if (!conversationId)
+            return;
+        const hint = firstUserMessageText(initialMessages);
+        if (!hint)
+            return;
+        setTitleHints((current) => current[conversationId] === hint ? current : { ...current, [conversationId]: hint });
+    }, [conversationId, initialMessages]);
     const handleSent = useCallback((firstUserMessage) => {
         // New user turn → bump sidebar list so the row's preview/timestamp refreshes.
         setRefreshKey((k) => k + 1);
+        if (firstUserMessage && conversationId) {
+            setTitleHints((current) => ({ ...current, [conversationId]: firstUserMessage }));
+        }
         // Server now generates a concise LLM-summarised title fire-and-forget
         // after the first assistant turn lands (see service-ai
         // `summarizeConversation`). We don't PATCH a truncated preview from the
@@ -103,32 +598,88 @@ export function AiChatPage({ apiBase: apiBaseProp, defaultAgent: defaultAgentPro
         void t1;
         void t2;
     }, [conversationId]);
-    return (_jsxs("div", { className: "flex h-svh w-full flex-col bg-background", "data-testid": "ai-chat-page", children: [_jsxs("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4", children: [_jsx(AppHeader, { variant: "home" }), _jsx("div", { className: "ml-auto flex items-center gap-2", children: _jsxs(Button, { variant: "outline", size: "sm", className: "h-8 gap-1.5", onClick: () => setShareOpen(true), disabled: !conversationId, "data-testid": "ai-chat-share-button", title: conversationId ? 'Share this conversation' : 'Start chatting to enable sharing', children: [_jsx(Share2, { className: "h-3.5 w-3.5" }), "Share"] }) })] }), conversationId && (_jsx(ShareDialog, { open: shareOpen, onOpenChange: setShareOpen, objectName: "ai_conversations", recordId: conversationId, recordLabel: "this conversation", apiBase: restApiBase })), _jsxs("div", { className: "flex flex-1 min-h-0 w-full", children: [_jsx(ConversationsSidebar, { userId: userId, apiBase: apiBase, refreshKey: refreshKey, className: "hidden w-72 shrink-0 border-r md:flex" }), _jsx("main", { className: "flex flex-1 min-w-0 flex-col", children: _jsx(ChatPane, { agents: agents, agentsLoading: agentsLoading, agentsError: agentsError, activeAgent: activeAgent, onAgentChange: setActiveAgent, chatApi: chatApi, apiBase: apiBase, conversationId: conversationId, initialMessages: initialMessages, hydrating: convoLoading, onSent: handleSent }, `${chatApi ?? 'local'}:${conversationId ?? 'pending'}`) })] })] }));
+    return (_jsxs("div", { className: "flex h-svh w-full flex-col bg-background", "data-testid": "ai-chat-page", children: [_jsxs("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background/95 px-2 backdrop-blur sm:px-4", children: [_jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 md:hidden", onClick: () => setMobileChatsOpen(true), "aria-label": t('console.ai.openChats'), "data-testid": "ai-chat-mobile-sidebar-trigger", children: _jsx(PanelLeft, { className: "h-4 w-4" }) }), _jsx(Button, { variant: "ghost", size: "icon", className: "hidden h-8 w-8 shrink-0 md:inline-flex", onClick: toggleChatsCollapsed, "aria-label": chatsCollapsed
+                            ? t('console.ai.showChats', { defaultValue: 'Show chats' })
+                            : t('console.ai.hideChats', { defaultValue: 'Hide chats' }), title: chatsCollapsed
+                            ? t('console.ai.showChats', { defaultValue: 'Show chats' })
+                            : t('console.ai.hideChats', { defaultValue: 'Hide chats' }), "data-testid": "ai-chat-collapse-sidebar-trigger", "aria-pressed": chatsCollapsed, children: chatsCollapsed ? _jsx(PanelLeftOpen, { className: "h-4 w-4" }) : _jsx(PanelLeftClose, { className: "h-4 w-4" }) }), _jsx("div", { className: "min-w-0 flex-1", children: _jsx(AppHeader, { variant: "home" }) })] }), _jsx(Sheet, { open: mobileChatsOpen, onOpenChange: setMobileChatsOpen, children: _jsxs(SheetContent, { side: "left", className: "w-[320px] p-0 sm:max-w-[360px]", "data-testid": "ai-chat-mobile-sidebar", children: [_jsxs(SheetHeader, { className: "sr-only", children: [_jsx(SheetTitle, { children: t('console.ai.chats') }), _jsx(SheetDescription, { children: t('console.ai.chatsDescription') })] }), _jsx(ConversationsSidebar, { userId: userId, apiBase: apiBase, activeAgent: activeAgent, refreshKey: refreshKey, titleHints: titleHints, className: "h-full border-r-0", onNavigate: () => setMobileChatsOpen(false) })] }) }), conversationId && (_jsx(ShareDialog, { open: shareOpen, onOpenChange: setShareOpen, objectName: "ai_conversations", recordId: conversationId, recordLabel: "this conversation", apiBase: restApiBase, publicBaseUrl: publicShareBase })), _jsxs("div", { className: "flex min-h-0 flex-1 w-full bg-muted/20", children: [!chatsCollapsed && (_jsx(ConversationsSidebar, { userId: userId, apiBase: apiBase, activeAgent: activeAgent, refreshKey: refreshKey, titleHints: titleHints, className: "hidden w-72 shrink-0 border-r md:flex" })), _jsx("main", { className: "flex min-w-0 flex-1 flex-col", children: _jsx(ChatPane, { agents: agents, agentsLoading: agentsLoading, agentsError: agentsError, activeAgent: activeAgent, chatApi: chatApi, apiBase: apiBase, conversationId: conversationId, initialMessages: initialMessages, onSent: handleSent, onShare: () => setShareOpen(true), onCanvasOpenChange: handleCanvasOpenChange }, `${chatApi ?? 'local'}:${conversationId ?? 'pending'}`) })] })] }));
 }
-function ChatPane({ agents, agentsLoading, agentsError, activeAgent, onAgentChange, chatApi, apiBase, conversationId, initialMessages, hydrating, onSent, }) {
+function ChatPane({ agents, agentsLoading, agentsError, activeAgent, chatApi, apiBase, conversationId, initialMessages, onSent, onShare, onCanvasOpenChange, }) {
+    const { t } = useObjectTranslation();
+    const navigate = useNavigate();
+    // The agent dropdown is a LAUNCHER now (not an in-surface mode toggle): it
+    // navigates to `/ai/:agent`, so it naturally lists custom agents and can stay
+    // always-available. Shown only when there's more than one agent to switch to.
+    const showAgentLauncher = agents.length > 1;
+    // ── ADR-0037 Live Canvas ────────────────────────────────────────────────
+    // When a build session drafts an `app`, open the split-view canvas: the
+    // drafted app rendered as-if-published (`?preview=draft`) beside the chat.
+    // Per-artifact signals coalesce (800 ms) into one pane refresh so a
+    // whole-app build doesn't trigger an invalidation storm.
+    const [canvasApp, setCanvasApp] = useState(null);
+    const [canvasRefreshKey, setCanvasRefreshKey] = useState(0);
+    const canvasTimerRef = useRef(null);
+    useEffect(() => () => {
+        if (canvasTimerRef.current)
+            window.clearTimeout(canvasTimerRef.current);
+    }, []);
+    // Tell the page when the preview pane opens/closes so it can tuck the chats
+    // list away for the (tight) chat + preview split, and restore it after.
+    const canvasOpen = canvasApp !== null;
+    useEffect(() => {
+        onCanvasOpenChange?.(canvasOpen);
+    }, [canvasOpen, onCanvasOpenChange]);
+    // Draggable chat ↔ preview split (active only while the preview is open).
+    const split = useResizableChatPane(canvasOpen);
+    const handleDraftArtifacts = useCallback((artifacts, appSegment) => {
+        const app = artifacts.find((a) => a.type === 'app');
+        // Route the preview on the app's package id (ADR-0048), not its name.
+        if (app)
+            setCanvasApp((prev) => prev ?? { name: app.name, segment: appSegment, materialized: false });
+        if (canvasTimerRef.current)
+            window.clearTimeout(canvasTimerRef.current);
+        canvasTimerRef.current = window.setTimeout(() => setCanvasRefreshKey((k) => k + 1), 800);
+    }, []);
+    // ADR-0045: the build finished and was materialized (real tables + data,
+    // app unlisted). Switch the open canvas from the draft overlay to the REAL
+    // app URL — the reload that follows shows live rows in every list.
+    const handleBuildMaterialized = useCallback((appName) => {
+        setCanvasApp((prev) => prev && prev.name === appName && !prev.materialized
+            ? { ...prev, materialized: true } // keep the package-id segment
+            : prev ?? { name: appName, materialized: true });
+    }, []);
+    // A different conversation is a different build session — close the pane.
+    useEffect(() => {
+        setCanvasApp(null);
+    }, [conversationId]);
     const activeAgentLabel = useMemo(() => {
         const found = agents.find((a) => a.name === activeAgent);
-        return found?.label ?? activeAgent ?? 'Assistant';
-    }, [agents, activeAgent]);
+        return localizeAgentLabel(t, activeAgent, found?.label ?? activeAgent ?? t('console.ai.assistant'));
+    }, [agents, activeAgent, t]);
     const hydrated = useMemo(() => {
-        return initialMessages.map((m) => ({
-            id: m.id,
-            role: m.role,
-            content: m.parts.map((p) => p.text).join(''),
-        }));
+        return hydratedMessagesToChatMessages(initialMessages);
     }, [initialMessages]);
     const suggestions = useMemo(() => {
         if (hydrated.length > 0)
             return undefined;
-        return buildAgentSuggestions(activeAgent, activeAgentLabel);
-    }, [hydrated.length, activeAgent, activeAgentLabel]);
-    const { messages, isLoading, error, sendMessage, stop, reload, clear, } = useObjectChat({
+        return buildAgentSuggestions(activeAgent, activeAgentLabel, t);
+    }, [hydrated.length, activeAgent, activeAgentLabel, t]);
+    // Per-surface empty-state branding (Build = authoring, Ask = data Q&A).
+    const emptyState = useMemo(() => agentEmptyState(t, activeAgent), [t, activeAgent]);
+    // ADR-0013 D2: reconcile a stream-transport failure instead of blindly
+    // retrying. Shared across chat surfaces — see useReconcileOnError.
+    const { errorSuppressed, handleChatError, setMessagesRef, resetSuppression } = useReconcileOnError({ chatApi, conversationId });
+    const { messages, isLoading, error, sendMessage, stop, reload, clear, setMessages, } = useObjectChat({
         api: chatApi,
         conversationId,
+        onError: handleChatError,
         body: {
             context: {
                 activeApp: 'AI',
                 agentName: activeAgent,
+                // Tell the agent the environment's publish posture so its narration
+                // matches reality (an auto-published build is live, not "to publish").
+                autoPublishAiBuilds: getRuntimeConfig().features.autoPublishAiBuilds,
             },
         },
         initialMessages: hydrated,
@@ -136,6 +687,25 @@ function ChatPane({ agents, agentsLoading, agentsError, activeAgent, onAgentChan
         autoResponseText: "Thanks for your message! I'm here to help.",
         autoResponseDelay: 600,
     });
+    useEffect(() => {
+        setMessagesRef.current = setMessages;
+    }, [setMessages]);
+    useEffect(() => {
+        writeConversationMessagesCache(conversationId, sanitizeChatMessagesForCache(messages));
+    }, [conversationId, messages]);
+    // ADR-0037: refresh the live preview when a turn finishes while the canvas is
+    // open. The per-artifact `onDraftArtifacts` signal covers a build streaming in,
+    // but an incremental edit (add a field, rename) can land without growing the
+    // de-duped artifact set — so its draft never reached the iframe and the pane
+    // (and its "Changes (N)" count) went stale until a manual reload. Bumping on
+    // the loading falling-edge guarantees the preview reflects every change.
+    const prevLoadingRef = useRef(false);
+    useEffect(() => {
+        if (prevLoadingRef.current && !isLoading && canvasApp) {
+            setCanvasRefreshKey((k) => k + 1);
+        }
+        prevLoadingRef.current = isLoading;
+    }, [isLoading, canvasApp]);
     const hitl = useHitlInChat({
         messages: messages,
         apiBase,
@@ -144,42 +714,153 @@ function ChatPane({ agents, agentsLoading, agentsError, activeAgent, onAgentChan
         },
     });
     const handleSend = useCallback((content, files) => {
+        resetSuppression();
         sendMessage(content, files);
         onSent(content);
     }, [sendMessage, onSent]);
-    const headerSlot = agents.length > 0 ? (_jsxs("div", { className: "flex flex-wrap items-center gap-2 px-4 py-2", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "Agent:" }), _jsxs(Select, { value: activeAgent, onValueChange: onAgentChange, disabled: agentsLoading, children: [_jsx(SelectTrigger, { className: "h-7 w-[220px] text-xs", "data-testid": "ai-chat-agent-picker", children: _jsx(SelectValue, { placeholder: "Choose agent..." }) }), _jsx(SelectContent, { align: "start", children: agents.map((agent) => (_jsxs(SelectItem, { value: agent.name, className: "text-xs", children: [_jsx("span", { className: "font-medium", children: agent.label }), agent.description ? (_jsx("span", { className: "block text-muted-foreground text-[10px] truncate max-w-[260px]", children: agent.description })) : null] }, agent.name))) })] }), hydrating ? (_jsx("span", { className: "text-[10px] text-muted-foreground", children: "Loading history\u2026" })) : null, agentsError ? (_jsx("span", { className: "text-[10px] text-amber-700 dark:text-amber-400", title: agentsError.message, children: "\u26A0 Offline demo mode \u2014 agent list unavailable" })) : null] })) : null;
-    return (_jsx(ChatbotEnhanced, { className: "flex-1 min-h-0 rounded-none border-0", maxHeight: "100%", headerSlot: headerSlot, messages: messages, placeholder: activeAgent
-            ? `Ask ${activeAgentLabel}…  (try “${(suggestions?.[0]) ?? 'How can you help?'}”)`
-            : agentsLoading
-                ? 'Loading agents…'
-                : 'Ask anything…', suggestions: suggestions, onSendMessage: handleSend, onClear: clear, onStop: isLoading ? stop : undefined, onReload: reload, isLoading: isLoading, error: error, enableMarkdown: true, onToolApprove: hitl.decide, toolDecisions: hitl.decisions, toolApproveLabel: "Approve & run", toolDenyLabel: "Reject", toolDenyReason: "Operator rejected from chat", "data-testid": "ai-chat-panel" }));
-}
-const AGENT_SUGGESTIONS = {
-    data_chat: [
-        '系统里有多少个用户？列出他们的邮箱。',
-        '帮我列出最近创建的 5 条记录。',
-        '统计每个对象的记录数。',
-    ],
-    metadata_assistant: [
-        '系统里注册了哪些对象类型？',
-        'sys_user 对象有哪些字段？',
-        '描述一下用户相关的对象关系。',
-    ],
-};
-const GENERIC_SUGGESTIONS = [
-    'What can you help me with?',
-    'List the available data objects.',
-    'Summarize my recent activity.',
-];
-function buildAgentSuggestions(agentName, agentLabel) {
-    if (agentName && AGENT_SUGGESTIONS[agentName]) {
-        return AGENT_SUGGESTIONS[agentName];
-    }
+    const headerSlot = (_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2 border-b border-border/50 px-4 pb-2 pt-3 sm:px-6", children: [_jsx("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: showAgentLauncher ? (_jsxs(Select, { value: activeAgent, onValueChange: (name) => navigate(`/ai/${agentRouteName(name)}`), disabled: agentsLoading, children: [_jsx(SelectTrigger, { className: "h-7 w-auto min-w-0 border-0 bg-transparent px-1.5 text-xs shadow-none hover:bg-accent focus:ring-0 focus:ring-offset-0 focus-visible:ring-1 focus-visible:ring-border/80 focus-visible:ring-offset-0 sm:min-w-[160px]", "data-testid": "ai-chat-agent-picker", "aria-label": t('console.ai.switchAssistant', { defaultValue: 'Switch assistant' }), children: _jsx(SelectValue, { placeholder: t('console.ai.chooseAgent', { defaultValue: 'Choose assistant…' }) }) }), _jsx(SelectContent, { align: "start", children: agents.map((agent) => (_jsxs(SelectItem, { value: agent.name, className: "text-xs", children: [_jsx("span", { className: "font-medium", children: localizeAgentLabel(t, agent.name, agent.label) }), agent.description ? (_jsx("span", { className: "block text-muted-foreground text-[10px] truncate max-w-[260px]", children: agent.description })) : null] }, agent.name))) })] })) : (_jsx("span", { className: "truncate text-xs font-medium text-foreground/85", children: activeAgentLabel })) }), _jsx("div", { className: "flex shrink-0 items-center gap-1", children: _jsx(Button, { variant: "ghost", size: "icon", className: "h-7 w-7 text-muted-foreground hover:text-foreground", onClick: onShare, disabled: !conversationId, "aria-label": t('console.ai.share'), "data-testid": "ai-chat-share-button", title: conversationId ? t('console.ai.shareTitle') : t('console.ai.shareDisabledTitle'), children: _jsx(Share2, { className: "h-3.5 w-3.5" }) }) }), agentsError ? (_jsx("span", { className: "basis-full text-[10px] text-amber-700 dark:text-amber-400", title: agentsError.message, children: t('console.ai.offlineDemoMode') })) : null] }));
+    return (_jsxs("div", { ref: split.containerRef, className: "relative flex min-h-0 flex-1 px-0", children: [_jsx("div", { "data-chat-column": true, className: canvasApp
+                    ? 'flex min-h-0 shrink-0 justify-center'
+                    : 'flex min-h-0 flex-1 justify-center', style: canvasApp ? { width: split.width } : undefined, children: _jsx(ChatbotEnhanced, { className: "min-h-0 flex-1 bg-background md:max-w-5xl", onUpgrade: () => window.open(cloudPricingDeepLink(), '_blank', 'noopener,noreferrer'), surface: "plain", maxHeight: "100%", headerSlot: headerSlot, messages: messages, placeholder: activeAgent
+                        ? t('console.ai.askAgent', { agent: activeAgentLabel })
+                        : agentsLoading
+                            ? t('console.ai.loadingAgents')
+                            : t('console.ai.askAnything'), labels: {
+                        emptyTitle: emptyState.title,
+                        emptyDescription: emptyState.description,
+                        clear: t('console.ai.clearConversation'),
+                        sendHint: t('console.ai.sendHint'),
+                        agentActivity: t('console.ai.agentActivity'),
+                        toolCompleted: t('console.ai.toolCompleted'),
+                        toolRunning: t('console.ai.toolRunning'),
+                        toolAwaitingApproval: t('console.ai.toolAwaitingApproval'),
+                        toolFailed: t('console.ai.toolFailed'),
+                        connectionWaiting: t('console.ai.connectionWaiting', { defaultValue: 'Waiting for server…' }),
+                        connectionStalledLabel: t('console.ai.connectionStalled', { defaultValue: 'Still working…' }),
+                        connectionOfflineLabel: t('console.ai.connectionOffline', { defaultValue: 'Connection lost — reconnecting…' }),
+                        toolDetailsHidden: t('console.ai.toolDetailsHidden'),
+                        copy: t('console.ai.copy'),
+                        copied: t('console.ai.copied'),
+                        regenerate: t('console.ai.regenerate'),
+                        model: t('console.ai.model'),
+                        submit: t('console.ai.submit'),
+                        uploadFiles: t('console.ai.uploadFiles'),
+                        stopResponse: t('console.ai.stopResponse'),
+                        trace: t('console.ai.trace'),
+                        viewTrace: t('console.ai.viewTrace'),
+                    }, suggestions: suggestions, onSendMessage: handleSend, onClear: clear, hideClearBar: true, onStop: isLoading ? stop : undefined, onReload: reload, isLoading: isLoading, error: errorSuppressed ? undefined : error, enableMarkdown: true, onToolApprove: hitl.decide, toolDecisions: hitl.decisions, toolApproveLabel: "Approve & run", toolDenyLabel: "Reject", toolDenyReason: "Operator rejected from chat", 
+                    // Build-tree "Open app": jump straight into the app the agent just built.
+                    onOpenBuiltApp: (appName, appSegment) => navigate(`/apps/${encodeURIComponent(appSegment ?? appName)}`), openBuiltAppLabel: t('console.ai.openBuiltApp', { defaultValue: 'Open app' }), 
+                    // Live lifecycle truth for draft cards: the server's pending count per
+                    // package, so reloaded conversations show Published/Publish honestly.
+                    fetchPendingDraftCount: fetchPendingDraftCount, onPublishDrafts: async (packageId) => {
+                        // Promote the conversation's staged drafts to live (ADR-0033 gate —
+                        // the human still clicks). Same call as the floating chat + PackagesPage.
+                        try {
+                            const res = await fetch(`/api/v1/packages/${encodeURIComponent(packageId)}/publish-drafts`, {
+                                method: 'POST',
+                                credentials: 'include',
+                                headers: { 'Content-Type': 'application/json', Accept: 'application/json' },
+                                body: '{}',
+                            });
+                            const payload = await res.json().catch(() => null);
+                            if (!res.ok || payload?.success === false) {
+                                throw new Error(payload?.error?.message || `HTTP ${res.status}`);
+                            }
+                            const failed = payload?.data?.failedCount ?? payload?.failedCount ?? 0;
+                            if (failed)
+                                throw new Error(String(failed));
+                            // Surface a seed-load problem (reported under `seedApplied`, never
+                            // thrown) so "Published!" can't hide silently empty tables.
+                            const seedApplied = payload?.data?.seedApplied ?? payload?.seedApplied;
+                            if (seedApplied && seedApplied.success === false) {
+                                toast.warning(t('console.ai.seedWarn', { defaultValue: 'Published, but some sample data failed to load.' }), {
+                                    description: seedApplied.error ??
+                                        (Array.isArray(seedApplied.errors) && seedApplied.errors.length
+                                            ? String(seedApplied.errors[0])
+                                            : undefined),
+                                });
+                            }
+                            else {
+                                toast.success(t('console.ai.publishOk', { defaultValue: 'Published — objects are now live.' }));
+                            }
+                            // The live registry just changed but the chat-card publish path
+                            // does not reload the page (unlike DraftPreviewBar). Pulse every
+                            // mounted MetadataProvider so open forms/views (incl. the canvas
+                            // preview) refetch the new schema instead of showing stale, empty
+                            // dropdowns until a manual reload.
+                            emitMetadataRefresh();
+                            // ADR-0038 L3 — hand the runtime verification (seedApplied +
+                            // probes) back to the chat so the Published card grows a
+                            // build-health line instead of claiming bare success.
+                            return { ok: true, health: publishHealthFromResponse(payload) };
+                        }
+                        catch (e) {
+                            toast.error(t('console.ai.publishFailed', { defaultValue: 'Publish failed' }), {
+                                description: e instanceof Error ? e.message : undefined,
+                            });
+                            return false;
+                        }
+                    }, publishDraftsLabel: t('console.ai.publishDrafts', { defaultValue: 'Publish' }), publishedLabel: t('console.ai.published', { defaultValue: 'Published' }), nextStepsLabel: t('console.ai.nextSteps', { defaultValue: "What's next" }), planTitleLabel: t('console.ai.planTitle', { defaultValue: 'Proposed plan' }), planQuestionsLabel: t('console.ai.planQuestions', { defaultValue: 'Confirm before building' }), planAssumptionsLabel: t('console.ai.planAssumptions', { defaultValue: 'Assumptions' }), planApproveHintLabel: t('console.ai.planApproveHint', {
+                        defaultValue: 'Reply to approve or adjust this plan.',
+                    }), planApproveLabel: t('console.ai.planApprove', { defaultValue: 'Build it' }), planAdjustLabel: t('console.ai.planAdjust', { defaultValue: 'Adjust' }), planBuiltLabel: t('console.ai.planBuilt', { defaultValue: 'Built' }), planApproveMessage: t('console.ai.planApproveMessage', {
+                        defaultValue: 'Looks good — build it as proposed.',
+                    }), planApproveDefaultsMessage: t('console.ai.planApproveDefaultsMessage', {
+                        defaultValue: 'Build it with your best assumptions; use sensible defaults for the open questions.',
+                    }), planAnswerMessage: (question, option) => t('console.ai.planAnswerMessage', {
+                        question,
+                        option,
+                        defaultValue: 'For "{{question}}", go with: {{option}}.',
+                    }), 
+                    // Self-use "magic moment": when the plan enables it, publish the drafted
+                    // app automatically the moment the agent finishes — no manual click; the
+                    // user refreshes and sees it live WITH data. Same governed endpoint.
+                    autoPublishDrafts: getRuntimeConfig().features.autoPublishAiBuilds, 
+                    // ADR-0037 Live Canvas: open/refresh the draft-preview pane as the
+                    // agent's artifacts land; Preview buttons deep-link the same route.
+                    onDraftArtifacts: handleDraftArtifacts, onPreviewDraftApp: (appName, opts) => setCanvasApp({ name: appName, segment: opts?.appSegment, materialized: opts?.materialized === true }), 
+                    // ADR-0045: build materialized → canvas leaves the draft overlay for
+                    // the real (unlisted) app; the reload shows live seed rows.
+                    onBuildMaterialized: handleBuildMaterialized, previewDraftLabel: t('console.ai.previewDraft', { defaultValue: 'Preview' }), "data-testid": "ai-chat-panel" }) }), canvasApp ? (_jsxs(_Fragment, { children: [_jsxs("div", { role: "separator", "aria-orientation": "vertical", "aria-label": t('console.ai.resizeSplit', { defaultValue: 'Resize chat and preview' }), tabIndex: 0, onPointerDown: split.onHandlePointerDown, onKeyDown: split.onHandleKeyDown, onDoubleClick: split.reset, "data-testid": "ai-chat-split-handle", className: cn('group relative hidden w-1.5 shrink-0 cursor-col-resize touch-none select-none md:block', 'focus:outline-none'), children: [_jsx("span", { "aria-hidden": true, className: "absolute inset-y-0 -left-1.5 -right-1.5" }), _jsx("span", { "aria-hidden": true, className: cn('absolute inset-y-0 left-1/2 w-px -translate-x-1/2 bg-border transition-colors', 'group-hover:bg-primary/60 group-focus-visible:bg-primary', split.dragging && 'bg-primary') })] }), _jsx(LiveCanvas, { appName: canvasApp.name, appSegment: canvasApp.segment, materialized: canvasApp.materialized, refreshKey: canvasRefreshKey, onClose: () => setCanvasApp(null) }), split.dragging ? _jsx("div", { className: "fixed inset-0 z-50 cursor-col-resize", "data-testid": "ai-chat-split-overlay" }) : null] })) : null] }));
+}
+function dataChatSuggestions(t) {
+    return [
+        t('console.ai.suggestions.dataChat.userCount', { defaultValue: 'How many users are in the system? List their emails.' }),
+        t('console.ai.suggestions.dataChat.recentRecords', { defaultValue: 'List the 5 most recently created records.' }),
+        t('console.ai.suggestions.dataChat.recordCounts', { defaultValue: 'Count records for each object.' }),
+    ];
+}
+function metadataAssistantSuggestions(t) {
+    // Creation-first starters: the authoring agent's job is to BUILD from a
+    // natural-language description (the magic moment), so the empty-state nudges
+    // toward "describe a system" rather than inspecting existing schema.
+    return [
+        t('console.ai.suggestions.metadataAssistant.buildCrm', { defaultValue: 'Build a sales CRM — customers, contacts, and a deal pipeline I can total by stage.' }),
+        t('console.ai.suggestions.metadataAssistant.buildApp', { defaultValue: 'Create a project tracker — projects, tasks with owners and due dates, and a board by status.' }),
+        t('console.ai.suggestions.metadataAssistant.buildFlow', { defaultValue: 'Design a support desk — tickets with priority, a status workflow, and customer links.' }),
+        t('console.ai.suggestions.metadataAssistant.buildInventory', { defaultValue: 'Build an inventory app — products, stock levels, suppliers, and low-stock visibility.' }),
+        t('console.ai.suggestions.metadataAssistant.buildRecruiting', { defaultValue: 'Make an applicant tracker — candidates, open roles, interview stages, and notes.' }),
+    ];
+}
+function genericSuggestions(t) {
+    return [
+        t('console.ai.suggestions.generic.help', { defaultValue: 'What can you help me with?' }),
+        t('console.ai.suggestions.generic.availableObjects', { defaultValue: 'List the available data objects.' }),
+        t('console.ai.suggestions.generic.recentActivity', { defaultValue: 'Summarize my recent activity.' }),
+    ];
+}
+function buildAgentSuggestions(agentName, agentLabel, t) {
+    // Alias-aware: `ask`/`data_chat` → data starters, `build`/`metadata_assistant`
+    // → authoring starters. Custom agents fall back to a name/label heuristic.
+    if (isAskAgent(agentName))
+        return dataChatSuggestions(t);
+    if (isBuildAgent(agentName))
+        return metadataAssistantSuggestions(t);
     const lower = (agentName ?? agentLabel).toLowerCase();
     if (lower.includes('data'))
-        return AGENT_SUGGESTIONS.data_chat;
+        return dataChatSuggestions(t);
     if (lower.includes('metadata'))
-        return AGENT_SUGGESTIONS.metadata_assistant;
-    return GENERIC_SUGGESTIONS;
+        return metadataAssistantSuggestions(t);
+    return genericSuggestions(t);
 }
 export default AiChatPage;