@agent-native/core 0.82.0 → 0.84.0

package/corpus/core/src/client/AssistantChat.tsx

@@ -91,6 +91,7 @@ import {
   getRepoMessage,
   shouldImportServerThreadData,
   dedupeRepoMessagesById,
+  dropEmptyAssistantMessages,
 } from "./chat/repo-helpers.js";
 import {
   BuilderSetupCard,
@@ -885,7 +886,7 @@ function ensureMessageMetadata(repo: any): any {
   // throws "performOp/link: A message with the same id already exists in the
   // parent tree" (Sentry AGENT-NATIVE-BROWSER-2Q) when fed repeated ids. No-op
   // for the normal no-duplicate case. See dedupeRepoMessagesById.
-  repo = dedupeRepoMessagesById(repo);
+  repo = dropEmptyAssistantMessages(dedupeRepoMessagesById(repo));
   if (!repo?.messages || !Array.isArray(repo.messages)) return repo;
   for (const entry of repo.messages) {
     // Handle both wrapped ({ message: { ... } }) and flat ({ role, ... }) formats
@@ -1347,6 +1348,7 @@ const AssistantChatInner = forwardRef<
   // True during the 250ms continuation window and startup of the next chunk
   // (adapter's auto-continue delay before POSTing the next chunk).
   const [isAutoResuming, setIsAutoResuming] = useState(false);
+  const [optimisticRunning, setOptimisticRunning] = useState(false);
   const [runningActivityLabel, setRunningActivityLabel] = useState<
     string | null
   >(null);
@@ -1379,7 +1381,8 @@ const AssistantChatInner = forwardRef<
   // Real running state — drives submission/queue gating. Treat reconnecting
   // to an active run the same as running, UNLESS the user has explicitly
   // clicked stop (forceStopped).
-  const isRunning = !forceStopped && (isRuntimeRunning || isReconnecting);
+  const isRunning =
+    !forceStopped && (isRuntimeRunning || isReconnecting || optimisticRunning);
   const textStreaming = isRunning || externalStreaming;
   // UI-only running state — drives the stop button and thinking indicator.
   const showRunningInUI = isRunning;
@@ -1402,6 +1405,16 @@ const AssistantChatInner = forwardRef<
   // a running turn without adding many unstable closure deps to its dep list.
   const stopActiveRunRef = useRef<() => void>(() => {});
 
+  const markOptimisticRunning = useCallback(() => {
+    setOptimisticRunning(true);
+    if (typeof window === "undefined") return;
+    window.dispatchEvent(
+      new CustomEvent("agentNative.chatRunning", {
+        detail: { isRunning: true, tabId: tabId || threadId },
+      }),
+    );
+  }, [tabId, threadId]);
+
   useEffect(() => {
     if (lastBroadcastRunningRef.current === isRunning) return;
     lastBroadcastRunningRef.current = isRunning;
@@ -1412,6 +1425,20 @@ const AssistantChatInner = forwardRef<
     );
   }, [isRunning, tabId, threadId]);
 
+  useEffect(() => {
+    if (!optimisticRunning) return;
+    if (!forceStopped && !isRuntimeRunning && !isReconnecting) return;
+    setOptimisticRunning(false);
+  }, [forceStopped, isReconnecting, isRuntimeRunning, optimisticRunning]);
+
+  useEffect(() => {
+    if (!optimisticRunning) return;
+    const timer = window.setTimeout(() => {
+      setOptimisticRunning(false);
+    }, 15_000);
+    return () => window.clearTimeout(timer);
+  }, [optimisticRunning]);
+
   // ─── Chat persistence ──────────────────────────────────────────────
   const hasRestoredRef = useRef(false);
   const [initialCachedThreadSnapshot] = useState(() =>
@@ -1468,6 +1495,7 @@ const AssistantChatInner = forwardRef<
       // re-evaluates against the runtime exactly as before instead of
       // short-circuiting to the rejected repo.
       let settled = true;
+      let settledRepo = repo;
       if (repo?.messages?.length > 0) {
         let shouldImport = true;
         try {
@@ -1482,7 +1510,9 @@ const AssistantChatInner = forwardRef<
           if (options?.markTitleGenerated) {
             titleGeneratedRef.current = true;
           }
-          threadRuntime.import(ensureMessageMetadata(repo));
+          const importRepo = ensureMessageMetadata(repo);
+          threadRuntime.import(importRepo);
+          settledRepo = importRepo;
         } else {
           settled = false;
         }
@@ -1503,7 +1533,7 @@ const AssistantChatInner = forwardRef<
       }
       if (settled && signature !== null) {
         lastImportedSignatureRef.current = signature;
-        lastImportedRepoRef.current = repo;
+        lastImportedRepoRef.current = settledRepo;
       }
       return repo;
     },
@@ -2594,6 +2624,7 @@ const AssistantChatInner = forwardRef<
   // all the stop-related state in its own dep array.
   const stopActiveRun = useCallback(() => {
     setForceStopped(true);
+    setOptimisticRunning(false);
     const activeRun = getActiveRun();
     const runIdToAbort = reconnectRunIdRef.current ?? activeRun?.runId;
     userStoppedRunRef.current = {
@@ -2834,19 +2865,25 @@ const AssistantChatInner = forwardRef<
           },
         ]);
       } else {
-        appendThreadMessage({
-          role: "user",
-          content: [{ type: "text", text: submittedText }],
-          ...(messageAttachments.length > 0
-            ? { attachments: messageAttachments }
-            : {}),
-          ...createUserMessageRunConfig(
-            references,
-            effectiveRequestMode,
-            recoveryAction,
-            trackInRunsTray,
-          ),
-        } as Parameters<typeof threadRuntime.append>[0]);
+        markOptimisticRunning();
+        try {
+          appendThreadMessage({
+            role: "user",
+            content: [{ type: "text", text: submittedText }],
+            ...(messageAttachments.length > 0
+              ? { attachments: messageAttachments }
+              : {}),
+            ...createUserMessageRunConfig(
+              references,
+              effectiveRequestMode,
+              recoveryAction,
+              trackInRunsTray,
+            ),
+          } as Parameters<typeof threadRuntime.append>[0]);
+        } catch (error) {
+          setOptimisticRunning(false);
+          throw error;
+        }
       }
       if (submitted.includesContext) {
         updateComposerContextItems(() => []);
@@ -2859,6 +2896,7 @@ const AssistantChatInner = forwardRef<
       execMode,
       isRunning,
       materializeFrozenReconnectContent,
+      markOptimisticRunning,
       appendThreadMessage,
       updateComposerContextItems,
     ],
@@ -2918,7 +2956,7 @@ const AssistantChatInner = forwardRef<
         addToQueue(text, images);
       },
       isRunning() {
-        return thread.isRunning;
+        return isRunning;
       },
       focusComposer() {
         tiptapRef.current?.focus();
@@ -2938,9 +2976,9 @@ const AssistantChatInner = forwardRef<
     [
       addToQueue,
       exportCleanThreadRepo,
+      isRunning,
       messages.length,
       stageComposerContextItem,
-      thread.isRunning,
     ],
   );
 
@@ -3110,6 +3148,12 @@ const AssistantChatInner = forwardRef<
     centeredEmptyState && !isRestoring && hasThreadFooterSlot;
   const showComposerSlot =
     Boolean(composerSlot) && (!centerComposerWhenEmpty || centeredEmptyState);
+  const compactMissingKeyEmptyState =
+    missingApiKeySetupAboveComposer &&
+    missingApiKey &&
+    !authError &&
+    showEmptyState &&
+    !isRestoring;
 
   // Clarifying-question surface: the `ask-question` action writes a
   // GuidedQuestionPayload to application_state under "guided-questions". The
@@ -3137,6 +3181,7 @@ const AssistantChatInner = forwardRef<
   const approvalCtx = useMemo<ApprovalContextValue>(
     () => ({
       onApprove: (approvalKey: string) => {
+        markOptimisticRunning();
         appendThreadMessage({
           role: "user",
           content: [
@@ -3159,7 +3204,7 @@ const AssistantChatInner = forwardRef<
         } as Parameters<typeof threadRuntime.append>[0]);
       },
     }),
-    [appendThreadMessage, execMode],
+    [appendThreadMessage, execMode, markOptimisticRunning],
   );
 
   return (
@@ -3170,7 +3215,11 @@ const AssistantChatInner = forwardRef<
             <TextStreamingContext.Provider value={textStreaming}>
               <div
                 data-agent-empty-state={
-                  centeredEmptyState ? "centered" : undefined
+                  centeredEmptyState
+                    ? "centered"
+                    : compactMissingKeyEmptyState
+                      ? "compact-setup"
+                      : undefined
                 }
                 className={cn(
                   "relative flex flex-1 flex-col h-full min-h-0 text-foreground",
@@ -3515,27 +3564,25 @@ const AssistantChatInner = forwardRef<
                   </div>
                 ) : null}
                 {guidedQuestions && guidedQuestions.length > 0 && (
-                  <div className="shrink-0 px-3 pb-2 pt-1">
-                    <div className="rounded-lg border border-border bg-card/60 shadow-sm">
-                      <GuidedQuestionFlow
-                        questions={guidedQuestions}
-                        onSubmit={handleGuidedQuestionsSubmit}
-                        onSkip={handleGuidedQuestionsSkip}
-                        {...(guidedQuestionsTitle
-                          ? { title: guidedQuestionsTitle }
-                          : {})}
-                        {...(guidedQuestionsDescription
-                          ? { description: guidedQuestionsDescription }
-                          : {})}
-                        {...(guidedQuestionsSkipLabel
-                          ? { skipLabel: guidedQuestionsSkipLabel }
-                          : {})}
-                        {...(guidedQuestionsSubmitLabel
-                          ? { submitLabel: guidedQuestionsSubmitLabel }
-                          : {})}
-                        className="h-auto items-stretch justify-stretch bg-transparent"
-                      />
-                    </div>
+                  <div className="shrink-0 px-3 pb-2">
+                    <GuidedQuestionFlow
+                      questions={guidedQuestions}
+                      onSubmit={handleGuidedQuestionsSubmit}
+                      onSkip={handleGuidedQuestionsSkip}
+                      {...(guidedQuestionsTitle
+                        ? { title: guidedQuestionsTitle }
+                        : {})}
+                      {...(guidedQuestionsDescription
+                        ? { description: guidedQuestionsDescription }
+                        : {})}
+                      {...(guidedQuestionsSkipLabel
+                        ? { skipLabel: guidedQuestionsSkipLabel }
+                        : {})}
+                      {...(guidedQuestionsSubmitLabel
+                        ? { submitLabel: guidedQuestionsSubmitLabel }
+                        : {})}
+                      className="h-auto items-stretch justify-stretch bg-transparent"
+                    />
                   </div>
                 )}
                 {showPlanModeCallout && (

package/corpus/core/src/client/CommandMenu.tsx

@@ -261,6 +261,8 @@ export interface CommandMenuProps {
   open: boolean;
   onOpenChange: (open: boolean) => void;
   children: ReactNode;
+  /** Render app-specific dynamic results from the current search value. */
+  renderResults?: (search: string) => ReactNode;
   /** Placeholder text for the search input */
   placeholder?: string;
   /** Text shown when no results match (before showing agent fallback) */
@@ -291,6 +293,7 @@ export function CommandMenu({
   open,
   onOpenChange,
   children,
+  renderResults,
   placeholder = "Type a command or ask AI...",
   emptyText: _emptyText = "No commands found.",
   showAgentFallback = true,
@@ -325,8 +328,15 @@ export function CommandMenu({
     setTimeout(() => setChangelogOpen(true), 50);
   }, [onOpenChange, markChangelogSeen]);
 
-  // Focus input when opening
+  // Focus input when opening; clear search while closed so reopen never renders
+  // dynamic results for the previous query.
   useEffect(() => {
+    if (!open) {
+      setSearch("");
+      setSelectedIndex(0);
+      return;
+    }
+
     if (open) {
       setSearch("");
       setSelectedIndex(0);
@@ -497,6 +507,8 @@ export function CommandMenu({
       React.isValidElement(child) &&
       (child.type === CommandGroup || child.type === CommandDocsGroup),
   );
+  const dynamicResults = open ? renderResults?.(search) : null;
+  const hasDynamicResults = Boolean(dynamicResults);
 
   return (
     <>
@@ -528,6 +540,7 @@ export function CommandMenu({
 
               {/* Command list */}
               <div className="max-h-[300px] overflow-y-auto overflow-x-hidden">
+                {dynamicResults}
                 {hasResults && filteredChildren}
 
                 {/* What's new — built-in changelog entry */}
@@ -567,7 +580,9 @@ export function CommandMenu({
                 {/* Ask AI — always visible at the bottom */}
                 {showAgentFallback && (
                   <>
-                    {(hasResults || showChangelogRow) && <CommandSeparator />}
+                    {(hasResults || showChangelogRow || hasDynamicResults) && (
+                      <CommandSeparator />
+                    )}
                     <div className="p-1">
                       <div
                         className="relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-2 text-sm outline-none"
@@ -658,16 +673,21 @@ CommandMenu.Separator = CommandSeparator;
 /**
  * Hook to handle Cmd+K (or Ctrl+K) to open the command menu
  */
-export function useCommandMenuShortcut(onOpen: () => void) {
+export function useCommandMenuShortcut(
+  onOpen: () => void,
+  options: { allowContentEditable?: boolean } = {},
+) {
   useEffect(() => {
     const handleKeyDown = (e: KeyboardEvent) => {
-      if ((e.metaKey || e.ctrlKey) && e.key === "k") {
-        // Don't trigger if user is typing in an input/textarea
-        const target = e.target as HTMLElement;
+      if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "k") {
+        // Don't trigger if user is typing in a native form control.
+        const target = e.target instanceof HTMLElement ? e.target : null;
+        const isContentEditable = target?.isContentEditable;
         if (
-          target.tagName === "INPUT" ||
-          target.tagName === "TEXTAREA" ||
-          target.isContentEditable
+          target?.tagName === "INPUT" ||
+          target?.tagName === "TEXTAREA" ||
+          target?.tagName === "SELECT" ||
+          (!options.allowContentEditable && isContentEditable)
         ) {
           return;
         }
@@ -675,9 +695,11 @@ export function useCommandMenuShortcut(onOpen: () => void) {
         onOpen();
       }
     };
-    document.addEventListener("keydown", handleKeyDown);
-    return () => document.removeEventListener("keydown", handleKeyDown);
-  }, [onOpen]);
+    const useCapture = Boolean(options.allowContentEditable);
+    document.addEventListener("keydown", handleKeyDown, useCapture);
+    return () =>
+      document.removeEventListener("keydown", handleKeyDown, useCapture);
+  }, [onOpen, options.allowContentEditable]);
 }
 
 export type {

package/corpus/core/src/client/DefaultSpinner.tsx

@@ -31,8 +31,15 @@ export function DefaultSpinner() {
       </svg>
       <style>{`
         @keyframes an-spin { to { transform: rotate(360deg) } }
+        html {
+          background: hsl(var(--background, 0 0% 100%));
+          color: hsl(var(--foreground, 240 10% 3.9%));
+        }
         @media (prefers-color-scheme: dark) {
-          html { background: #09090b; color: #fafafa }
+          html {
+            background: hsl(var(--background, 240 10% 3.9%));
+            color: hsl(var(--foreground, 0 0% 98%));
+          }
         }
       `}</style>
     </div>

package/corpus/core/src/client/chat/message-components.tsx

@@ -760,6 +760,46 @@ export function UserMessage() {
 
 // ─── AssistantMessage ─────────────────────────────────────────────────────────
 
+function assistantMessageHasRenderableContent(message: {
+  content?: unknown;
+}): boolean {
+  const content = message.content;
+  if (typeof content === "string") return content.trim().length > 0;
+  if (!Array.isArray(content)) return false;
+  return content.some((part) => {
+    if (!part || typeof part !== "object") return false;
+    const type = (part as { type?: unknown }).type;
+    if (type === "text") {
+      const text = (part as { text?: unknown }).text;
+      return typeof text === "string" && text.trim().length > 0;
+    }
+    return true;
+  });
+}
+
+function assistantMessageStatusIsTerminal(message: {
+  status?: { type?: unknown };
+}): boolean {
+  const statusType = message.status?.type;
+  return statusType === "complete" || statusType === "incomplete";
+}
+
+export function shouldShowAssistantMessageFooter({
+  isLast,
+  chatRunning,
+  hasRenderableContent,
+  statusIsTerminal,
+}: {
+  isLast: boolean;
+  chatRunning: boolean;
+  hasRenderableContent: boolean;
+  statusIsTerminal: boolean;
+}): boolean {
+  if (!hasRenderableContent) return false;
+  if (!isLast) return true;
+  return !chatRunning && statusIsTerminal;
+}
+
 export function AssistantMessage() {
   const [restoreState, setRestoreState] = useState<
     "idle" | "confirming" | "restoring"
@@ -772,7 +812,13 @@ export function AssistantMessage() {
   const isLast =
     thread.messages.length > 0 &&
     thread.messages[thread.messages.length - 1].id === msg.id;
-  const isComplete = !isLast || !chatRunning;
+  const hasRenderableContent = assistantMessageHasRenderableContent(msg);
+  const isComplete = shouldShowAssistantMessageFooter({
+    isLast,
+    chatRunning,
+    hasRenderableContent,
+    statusIsTerminal: assistantMessageStatusIsTerminal(msg),
+  });
   const cpCtx = React.useContext(CheckpointContext);
 
   const handleRestore = useCallback(async () => {
@@ -842,6 +888,8 @@ export function AssistantMessage() {
           p.structuredMeta.toolKind === "write"),
     );
 
+  if (!hasRenderableContent) return null;
+
   return (
     <div
       className="group relative"

package/corpus/core/src/client/chat/repo-helpers.ts

@@ -94,6 +94,77 @@ export function dedupeRepoMessagesById<T extends NormalizedRepo>(
   return { ...repo, messages: deduped };
 }
 
+function repoMessageContentIsEmpty(content: unknown): boolean {
+  if (typeof content === "string") return content.trim().length === 0;
+  if (!Array.isArray(content)) return true;
+  return !content.some((part) => {
+    if (!part || typeof part !== "object") return false;
+    const type = (part as { type?: unknown }).type;
+    if (type === "text") {
+      const text = (part as { text?: unknown }).text;
+      return typeof text === "string" && text.trim().length > 0;
+    }
+    return true;
+  });
+}
+
+function entryWithParentId(
+  entry: RepoEntry,
+  parentId: string | null,
+): RepoEntry {
+  return { ...entry, parentId };
+}
+
+function repairRepoLinks<T extends NormalizedRepo>(
+  repo: T,
+  entries: RepoEntry[],
+): T {
+  const seenIds = new Set<string>();
+  let previousId: string | null = null;
+  const repaired: RepoEntry[] = [];
+
+  for (const entry of entries) {
+    const id = getRepoMessage(entry)?.id;
+    if (typeof id !== "string" || !id) continue;
+    const requestedParentId = entry.parentId;
+    const parentId =
+      requestedParentId === null
+        ? null
+        : typeof requestedParentId === "string" &&
+            seenIds.has(requestedParentId)
+          ? requestedParentId
+          : previousId;
+    repaired.push(entryWithParentId(entry, parentId));
+    seenIds.add(id);
+    previousId = id;
+  }
+
+  const headId =
+    typeof repo.headId === "string" && seenIds.has(repo.headId)
+      ? repo.headId
+      : previousId;
+  return { ...repo, messages: repaired, headId: headId ?? undefined };
+}
+
+export function dropEmptyAssistantMessages<T extends NormalizedRepo>(
+  repo: T | null | undefined,
+): T | null | undefined {
+  if (!repo || !Array.isArray(repo.messages)) return repo;
+
+  let changed = false;
+  const messages = repo.messages.filter((entry) => {
+    const message = getRepoMessage(entry);
+    const drop =
+      message?.role === "assistant" &&
+      repoMessageContentIsEmpty(message.content);
+    if (drop) changed = true;
+    return !drop;
+  });
+
+  if (!changed) return repo;
+  return repairRepoLinks(repo, messages);
+}
+
 export function isAssistantMessageTerminal(
   message: RepoMessage | null,
 ): boolean {

package/corpus/core/src/client/chat/run-recovery.tsx

@@ -436,14 +436,24 @@ export function BuilderSetupCard({
         "agent-builder-setup-card",
         sidebarLayout && "agent-builder-setup-card--sidebar",
         fullWidth
-          ? "w-full pb-2"
+          ? "w-full px-3 pb-2"
           : sidebarLayout
             ? "mx-auto w-full max-w-[42rem] px-3 pb-2"
             : "mx-auto w-full max-w-[42rem] px-3 pb-2 sm:w-fit",
       )}
     >
-      <div className="rounded-lg border border-border/80 bg-background/80 p-3 shadow-sm backdrop-blur">
-        <div className="agent-builder-setup-card__content flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
+      <div
+        className={cn(
+          "agent-builder-setup-card__panel rounded-lg border border-border/80 bg-background/80 shadow-sm backdrop-blur",
+          sidebarLayout ? "p-2.5" : "p-3",
+        )}
+      >
+        <div
+          className={cn(
+            "agent-builder-setup-card__content flex flex-col sm:flex-row sm:items-center sm:justify-between",
+            sidebarLayout ? "gap-2" : "gap-3",
+          )}
+        >
           <div className="agent-builder-setup-card__copy min-w-0">
             <h3 className="text-[13px] font-medium text-foreground">
               Connect AI
@@ -456,7 +466,7 @@ export function BuilderSetupCard({
             className={cn(
               "agent-builder-setup-card__actions flex shrink-0",
               sidebarLayout
-                ? "flex-col items-start gap-0 sm:items-center"
+                ? "flex-col items-start gap-1 sm:items-center"
                 : "flex-nowrap items-center gap-2",
             )}
           >
@@ -472,7 +482,7 @@ export function BuilderSetupCard({
               )}
               aria-expanded={keyOpen}
             >
-              {sidebarLayout ? "Or, use API key" : "Use API key"}
+              Use API key
             </button>
           </div>
         </div>

package/corpus/core/src/client/components/ApiKeySettings.tsx

@@ -228,7 +228,7 @@ const styles: Record<string, React.CSSProperties> = {
     marginTop: "8px",
     padding: "6px 12px",
     fontSize: "13px",
-    border: "1px solid rgba(255,255,255,0.15)",
+    border: "1px solid hsl(var(--border))",
     borderRadius: "6px",
     background: "transparent",
     color: "inherit",
@@ -242,8 +242,8 @@ const styles: Record<string, React.CSSProperties> = {
   keyCard: {
     padding: "10px 12px",
     borderRadius: "8px",
-    border: "1px solid rgba(255,255,255,0.08)",
-    background: "rgba(255,255,255,0.03)",
+    border: "1px solid hsl(var(--border))",
+    background: "hsl(var(--card))",
   },
   keyHeader: {
     display: "flex",
@@ -268,7 +268,7 @@ const styles: Record<string, React.CSSProperties> = {
     fontSize: "14px",
   },
   unconfiguredDot: {
-    color: "rgba(255,255,255,0.25)",
+    color: "hsl(var(--muted-foreground) / 0.55)",
     fontSize: "8px",
   },
   requiredBadge: {
@@ -285,8 +285,8 @@ const styles: Record<string, React.CSSProperties> = {
     padding: "7px 10px",
     fontSize: "13px",
     borderRadius: "6px",
-    border: "1px solid rgba(255,255,255,0.12)",
-    background: "rgba(0,0,0,0.2)",
+    border: "1px solid hsl(var(--input))",
+    background: "hsl(var(--background))",
     color: "inherit",
     outline: "none",
     boxSizing: "border-box" as const,
@@ -302,8 +302,8 @@ const styles: Record<string, React.CSSProperties> = {
     fontWeight: 500,
     borderRadius: "6px",
     border: "none",
-    background: "#3b82f6",
-    color: "#fff",
+    background: "hsl(var(--primary))",
+    color: "hsl(var(--primary-foreground))",
     cursor: "pointer",
   },
 };