@saadnvd1/agent-os 0.3.715 → 0.3.728

package/components/Analyst/pair.ts

@@ -0,0 +1,81 @@
+"use client";
+
+import { useCallback } from "react";
+import { toast } from "sonner";
+import { usePanes } from "@/contexts/PaneContext";
+import {
+  useSessionAnalyst,
+  useStartAnalyst,
+  type StartAnalystInput,
+} from "@/data/analyst";
+import type { Session } from "@/lib/db";
+import type { AnalystLinkView, PaneSession } from "@/lib/analyst/types";
+
+// A chat's tmux name: `<agent>-<id>`, as every chat tab attaches.
+export const paneTmux = (s: PaneSession) => `${s.agentType}-${s.id}`;
+
+export type PairStatus = "paused" | "reviewing" | "recommendation" | "watching";
+
+export function pairStatus(link: AnalystLinkView): PairStatus {
+  if (link.paused) return "paused";
+  if (link.pendingDigestId) return "reviewing";
+  if (link.recommendations.some((r) => r.state === "open"))
+    return "recommendation";
+  return "watching";
+}
+
+export const PAIR_STATUS_LABEL: Record<PairStatus, string> = {
+  paused: "Paused",
+  reviewing: "Reviewing",
+  recommendation: "Prompt ready",
+  watching: "Watching",
+};
+
+// The side of a pairing a session isn't.
+export function partnerOf(link: AnalystLinkView, sessionId: string) {
+  return link.coder.id === sessionId ? link.analyst : link.coder;
+}
+
+// Starts an analyst for a chat and shows it beside the coder's pane: the
+// one given, else one showing the coder, else the focused one.
+export function useStartAnalystBeside() {
+  const start = useStartAnalyst();
+  const { openBeside, state, focusedPaneId } = usePanes();
+  const run = useCallback(
+    async (input: StartAnalystInput, paneId?: string) => {
+      try {
+        const link = await start.mutateAsync(input);
+        const showing = Object.entries(state.panes).find(([, p]) =>
+          p.tabs.some(
+            (t) => t.id === p.activeTabId && t.sessionId === link.coder.id
+          )
+        )?.[0];
+        openBeside(paneId ?? showing ?? focusedPaneId, {
+          sessionId: link.analyst.id,
+          tmux: paneTmux(link.analyst),
+        });
+        return link;
+      } catch (error) {
+        toast.error(error instanceof Error ? error.message : String(error));
+        return null;
+      }
+    },
+    [start, openBeside, state.panes, focusedPaneId]
+  );
+  return { run, isPending: start.isPending };
+}
+
+// Whether a session can be given an analyst here: a local chat that isn't
+// an orchestrator, an analyst or already paired. The server checks again.
+export function useCanAddAnalyst(session: Session | null | undefined) {
+  const chat = session?.view === "chat" ? session : null;
+  const paired = useSessionAnalyst(chat?.id).data;
+  return (
+    !!chat &&
+    !chat.role &&
+    !chat.archived_at &&
+    (chat.host_id || "local") === "local" &&
+    chat.agent_role !== "analyst" &&
+    !paired
+  );
+}

package/components/Chat/Code.tsx

@@ -12,6 +12,8 @@ import oneDark from "react-syntax-highlighter/dist/esm/styles/prism/one-dark";
 import oneLight from "react-syntax-highlighter/dist/esm/styles/prism/one-light";
 import { CopyButton } from "./CopyButton";
 import { Mermaid } from "./Mermaid";
+import { ReviewCard } from "@/components/Analyst/ReviewCard";
+import { REVIEW_FENCE } from "@/lib/analyst/parseReview";
 
 const ALIASES: Record<string, string> = {
   sh: "bash",
@@ -117,6 +119,7 @@ export function CodeBlock({
   language?: string;
 }) {
   if (language === "mermaid") return <Mermaid code={code} />;
+  if (language === REVIEW_FENCE) return <ReviewCard code={code} />;
   return (
     <div className="bg-foreground/[0.04] not-prose my-3 overflow-hidden rounded-xl">
       <div

package/components/Chat/Messages.tsx

@@ -1,9 +1,11 @@
 "use client";
 
 import { memo } from "react";
+import { useSnapshot } from "valtio";
 import {
   Check,
   ChevronRight,
+  Download,
   Circle,
   CircleDot,
   Quote,
@@ -24,6 +26,9 @@ import { Markdown } from "./Markdown";
 import { openSessionLink } from "./session-link";
 import { UndoButton } from "./Undo";
 import { useRowState } from "./rowState";
+import { useBookmarkChat } from "@/components/Bookmarks/context";
+import { ChatItemContext } from "./itemContext";
+import { exportUi, exportUiActions, pickedRange } from "@/stores/exportUi";
 import {
   BookmarkButton,
   TurnBookmark,
@@ -153,6 +158,71 @@ function SendStatus({ pending }: { pending: PendingStatus }) {
   );
 }
 
+// The turn this message begins, while turns are being picked for an export.
+function useExportTurn(itemId: string): number | null {
+  const ui = useSnapshot(exportUi);
+  if (!ui.selecting) return null;
+  return ui.turns.find((t) => t.id === itemId)?.n ?? null;
+}
+
+// A tick in the gutter and a tinted row: tap anywhere on it to pick the turn.
+function TurnTick({
+  turn,
+  children,
+}: {
+  turn: number;
+  children: React.ReactNode;
+}) {
+  const { pick } = useSnapshot(exportUi);
+  const range = pickedRange(pick);
+  const on = !!range && turn >= range.from && turn <= range.to;
+  return (
+    <div
+      className={cn(
+        "-mx-2 flex items-start gap-2 rounded-xl px-2",
+        on && "bg-primary/10"
+      )}
+    >
+      <button
+        type="button"
+        role="checkbox"
+        aria-checked={on}
+        aria-label={`Turn ${turn}`}
+        onClick={() => exportUiActions.tap(turn)}
+        className={cn(
+          "mt-1 flex h-11 min-w-11 shrink-0 flex-col items-center justify-center rounded-md border text-[11px]",
+          on
+            ? "border-primary bg-primary text-primary-foreground"
+            : "text-muted-foreground"
+        )}
+      >
+        {on ? <Check className="h-4 w-4" /> : turn}
+      </button>
+      <div className="min-w-0 flex-1">{children}</div>
+    </div>
+  );
+}
+
+// Export this message's turn and everything after it.
+function ExportFromHere({ itemId }: { itemId: string }) {
+  const chat = useBookmarkChat();
+  if (!chat) return null;
+  return (
+    <button
+      type="button"
+      aria-label="Export from here"
+      title="Export from here"
+      onClick={(e) => {
+        e.stopPropagation();
+        exportUiActions.open(chat.sessionId, "", itemId);
+      }}
+      className="text-muted-foreground hover:text-foreground hover:bg-foreground/[0.06] flex h-11 w-11 shrink-0 items-center justify-center rounded-md opacity-40 group-hover:opacity-100 focus-visible:opacity-100 md:h-7 md:w-7 md:opacity-0"
+    >
+      <Download className="h-3.5 w-3.5" />
+    </button>
+  );
+}
+
 export function UserMessage({
   item,
   onUndo,
@@ -162,6 +232,7 @@ export function UserMessage({
   onUndo?: () => void;
   pending?: PendingStatus;
 }) {
+  const turn = useExportTurn(item.id);
   const message = (
     <div className="group flex flex-col items-end gap-1">
       {item.from && (
@@ -204,6 +275,7 @@ export function UserMessage({
       ) : (
         <div className="-mr-1.5 flex items-center">
           {onUndo && <UndoButton onClick={onUndo} />}
+          <ExportFromHere itemId={item.id} />
           <BookmarkButton itemId={item.id} />
         </div>
       )}
@@ -211,7 +283,8 @@ export function UserMessage({
   );
   // Not in the chat yet: nothing to star.
   if (pending) return message;
-  return <BookmarkPress itemId={item.id}>{message}</BookmarkPress>;
+  const row = <BookmarkPress itemId={item.id}>{message}</BookmarkPress>;
+  return turn ? <TurnTick turn={turn}>{row}</TurnTick> : row;
 }
 
 export function AssistantMessage({
@@ -221,11 +294,17 @@ export function AssistantMessage({
   item: Of<"assistant">;
   onQuote?: (text: string) => void;
 }) {
+  // A reply whose only content was a tool call AgentOS ran for it.
+  if (!item.streaming && !item.text.trim()) return null;
   return (
     <BookmarkPress itemId={item.id}>
       <div className="group">
         <div data-quotable className={cn(item.streaming && "streaming-cursor")}>
-          <Markdown text={item.text} streaming={item.streaming} />
+          <ChatItemContext.Provider
+            value={{ itemId: item.id, streaming: !!item.streaming }}
+          >
+            <Markdown text={item.text} streaming={item.streaming} />
+          </ChatItemContext.Provider>
         </div>
         {!item.streaming && (
           <div className="-ml-1.5 flex items-center">
@@ -300,18 +379,38 @@ export function Todos({ item }: { item: Of<"todos"> }) {
 
 export function TurnEnd({ item }: { item: Of<"turn_end"> }) {
   const secs = item.durationMs ? Math.round(item.durationMs / 1000) : null;
+  const early = !item.interrupted && item.ended;
   const label = item.interrupted
     ? "Stopped"
-    : secs !== null
-      ? `Done in ${secs}s`
-      : "Done";
+    : early
+      ? secs !== null
+        ? `Ended early in ${secs}s`
+        : "Ended early"
+      : secs !== null
+        ? `Done in ${secs}s`
+        : "Done";
   return (
-    <div className="group text-muted-foreground/60 flex items-center gap-3 font-mono text-[11px]">
-      <span className="bg-foreground/[0.06] h-px flex-1" />
-      {label}
-      <TurnBookmark turnEndId={item.id} />
-      <span className="bg-foreground/[0.06] h-px flex-1" />
-    </div>
+    <>
+      {early && (
+        <div
+          role="status"
+          className="rounded-xl bg-amber-500/10 px-3.5 py-2.5 text-sm text-amber-700 dark:text-amber-300"
+        >
+          {early.notice}
+          {item.finishReason && (
+            <span className="mt-1 block font-mono text-[11px] opacity-80">
+              finish reason: {item.finishReason}
+            </span>
+          )}
+        </div>
+      )}
+      <div className="group text-muted-foreground/60 flex items-center gap-3 font-mono text-[11px]">
+        <span className="bg-foreground/[0.06] h-px flex-1" />
+        {label}
+        <TurnBookmark turnEndId={item.id} />
+        <span className="bg-foreground/[0.06] h-px flex-1" />
+      </div>
+    </>
   );
 }
 

package/components/Chat/itemContext.ts

@@ -0,0 +1,14 @@
+"use client";
+
+import { createContext, useContext } from "react";
+
+// The message a rendered block belongs to, for blocks that act on it (a
+// review card finds its stored recommendation by the item's id).
+export interface ChatItemRef {
+  itemId: string;
+  streaming: boolean;
+}
+
+export const ChatItemContext = createContext<ChatItemRef | null>(null);
+
+export const useChatItem = () => useContext(ChatItemContext);

package/components/Draft/DraftChips.tsx

@@ -4,6 +4,7 @@ import { useEffect } from "react";
 import {
   Bot,
   Cpu,
+  Eye,
   FolderGit2,
   GitBranch,
   Flag,
@@ -21,6 +22,7 @@ import { useAgentStatusQuery } from "@/data/agents";
 import { useProjectMachinesQuery } from "@/data/projects";
 import { modelChoices, useModelsQuery } from "@/data/models";
 import type { AgentProbe } from "@/lib/agents/probe";
+import { RoleChips } from "./RoleChips";
 import { ChipHeading, ChipItem, ChipMenu, ChipToggle } from "./Chip";
 import {
   DEFAULT_PRIORITY,
@@ -168,7 +170,7 @@ export function DraftChips({
         </ChipMenu>
       )}
 
-      {!draft.openPr && (
+      {!draft.openPr && !draft.agentRole && (
         <ChipMenu icon={Bot} name="Agent" label={agentLabel(draft.agentType)}>
           {AGENT_OPTIONS.map((o) => (
             <ChipItem
@@ -189,6 +191,10 @@ export function DraftChips({
         </ChipMenu>
       )}
 
+      {!draft.openPr && local && (
+        <RoleChips draft={draft} onChange={onChange} />
+      )}
+
       {project && local && git?.isGitRepo && (
         <ChipMenu
           icon={GitBranch}
@@ -247,6 +253,15 @@ export function DraftChips({
           onChange={(openPr) => onChange({ openPr })}
         />
       )}
+      {project && !draft.openPr && local && draft.agentRole !== "analyst" && (
+        <ChipToggle
+          icon={Eye}
+          label="With analyst"
+          on={!!draft.withAnalyst}
+          title="A second chat reviews each turn and drafts the next prompt for you to send"
+          onChange={(withAnalyst) => onChange({ withAnalyst })}
+        />
+      )}
       {project && draft.openPr && local && (
         <ChipMenu
           icon={Cpu}

package/components/Draft/DraftPanel.tsx

@@ -14,6 +14,8 @@ import { useHostsQuery } from "@/data/hosts";
 import { useGitCheck } from "@/data/git/queries";
 import { useSelectedWorkspace } from "@/hooks/useSelectedWorkspace";
 import { useLaunchSession } from "@/data/sessions";
+import { ModelUnavailableError } from "@/data/sessions/queries";
+import { isAgentRole } from "@/lib/models/agent-roles";
 import { useCreateTask } from "@/data/tasks";
 import { useCheckStart } from "@/data/claims";
 import { StartClaimsNotice } from "@/components/Claims";
@@ -21,8 +23,10 @@ import type { StartWarning } from "@/lib/claims/startWarning";
 import { usePanes } from "@/contexts/PaneContext";
 import { setPendingPrompt } from "@/stores/initialPrompt";
 import { draftsActions, draftsStore, newDraft } from "@/stores/drafts";
+import { useStartAnalystBeside } from "@/components/Analyst/pair";
 import { DraftChips } from "./DraftChips";
 import { DraftHeading } from "./DraftHeading";
+import { ModelUnavailableDialog } from "./ModelUnavailableDialog";
 import { draftModels } from "./draftModels";
 
 // A new session before its first send: choices on top, a composer below.
@@ -54,6 +58,7 @@ export function DraftPanel({
     discovers
   );
   const launch = useLaunchSession();
+  const startAnalyst = useStartAnalystBeside();
   const { workspace } = useSelectedWorkspace();
   const createTask = useCreateTask();
   const checkStart = useCheckStart();
@@ -63,6 +68,13 @@ export function DraftPanel({
     text: string;
     warnings: StartWarning[];
   } | null>(null);
+  // A role's model server that didn't answer, with what was being sent.
+  const [down, setDown] = useState<{
+    error: ModelUnavailableError;
+    text: string;
+    images: ChatImage[];
+    files: ChatFile[];
+  } | null>(null);
   const pending =
     launch.isPending || createTask.isPending || checkStart.isPending;
 
@@ -81,7 +93,7 @@ export function DraftPanel({
     text: string,
     images: ChatImage[],
     files: ChatFile[],
-    claim?: { after?: string }
+    claim?: { after?: string; onUnavailable?: "fallback" }
   ) => {
     try {
       if (draft.openPr) {
@@ -129,7 +141,17 @@ export function DraftPanel({
             ? draft.hostId
             : undefined,
         agentType: draft.agentType,
-        model: draft.model,
+        model: isAgentRole(draft.agentRole)
+          ? (draft.roleModel ?? "")
+          : draft.model,
+        ...(isAgentRole(draft.agentRole)
+          ? {
+              agentRole: draft.agentRole,
+              ...(claim?.onUnavailable && {
+                onUnavailable: claim.onUnavailable,
+              }),
+            }
+          : {}),
         access: draft.access,
         useWorktree: draft.useWorktree && !!git?.isGitRepo,
         baseBranch: draft.baseBranch,
@@ -152,7 +174,16 @@ export function DraftPanel({
         session.tmux_name ?? "",
         session.host_id
       );
+      if (draft.withAnalyst && project && draft.hostId === "local") {
+        if (session.view === "chat")
+          void startAnalyst.run({ coderSessionId: session.id }, paneId);
+        else toast("An analyst reviews chats: this session runs in a terminal");
+      }
     } catch (error) {
+      if (error instanceof ModelUnavailableError) {
+        setDown({ error, text, images, files });
+        return;
+      }
       setPrefill({ text, at: Date.now() });
       toast.error(error instanceof Error ? error.message : String(error));
     }
@@ -172,6 +203,31 @@ export function DraftPanel({
           git={git}
           onChange={(patch) => draftsActions.update(draft.id, patch)}
         />
+        <ModelUnavailableDialog
+          error={down?.error ?? null}
+          busy={pending}
+          onClose={() => {
+            if (down) setPrefill({ text: down.text, at: Date.now() });
+            setDown(null);
+          }}
+          onRetry={() => {
+            const d = down;
+            setDown(null);
+            if (d) void send(d.text, d.images, d.files);
+          }}
+          onFallback={() => {
+            const d = down;
+            setDown(null);
+            if (d)
+              void send(d.text, d.images, d.files, {
+                onUnavailable: "fallback",
+              });
+          }}
+          onPick={() => {
+            if (down) setPrefill({ text: down.text, at: Date.now() });
+            setDown(null);
+          }}
+        />
         {held && (
           <StartClaimsNotice
             warnings={held.warnings}

package/components/Draft/ModelUnavailableDialog.tsx

@@ -0,0 +1,78 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { AGENT_ROLE_DEFS, isAgentRole } from "@/lib/models/agent-roles";
+import type { ModelUnavailableError } from "@/data/sessions/queries";
+
+// A session in a role couldn't start: its model's server isn't answering.
+// A local model never turns into a cloud one on its own: starting on the
+// role's fallback is a choice made here.
+export function ModelUnavailableDialog({
+  error,
+  busy,
+  onRetry,
+  onFallback,
+  onPick,
+  onClose,
+}: {
+  error: ModelUnavailableError | null;
+  busy: boolean;
+  onRetry: () => void;
+  onFallback: () => void;
+  onPick: () => void;
+  onClose: () => void;
+}) {
+  const role =
+    error && isAgentRole(error.role)
+      ? AGENT_ROLE_DEFS[error.role].label
+      : "role";
+  const name = (ref: string) => ref.split("/").slice(1).join("/");
+  return (
+    <Dialog open={!!error} onOpenChange={(o) => !o && onClose()}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>Can&apos;t start the {role}</DialogTitle>
+          <DialogDescription>
+            {error ? `${name(error.ref)}'s server isn't answering.` : ""}
+          </DialogDescription>
+        </DialogHeader>
+        {error && (
+          <p className="bg-muted/60 text-muted-foreground rounded-lg px-3 py-2 font-mono text-xs break-words">
+            {error.message}
+          </p>
+        )}
+        <div className="flex flex-col gap-2">
+          <Button className="h-11" disabled={busy} onClick={onRetry}>
+            Retry
+          </Button>
+          {error?.fallback && (
+            <Button
+              variant="outline"
+              className="h-11"
+              disabled={busy}
+              onClick={onFallback}
+            >
+              Start on {name(error.fallback)}
+            </Button>
+          )}
+          <Button variant="outline" className="h-11" onClick={onPick}>
+            Pick another model
+          </Button>
+        </div>
+        {error?.fallback && (
+          <p className="text-muted-foreground text-xs">
+            Starting on the fallback sends your code to wherever that model
+            runs.
+          </p>
+        )}
+      </DialogContent>
+    </Dialog>
+  );
+}

package/components/Draft/RoleChips.tsx

@@ -0,0 +1,110 @@
+"use client";
+
+import { Cpu, Users } from "lucide-react";
+import {
+  AvailabilityDot,
+  LocalityBadge,
+} from "@/components/Models/ModelBadges";
+import { useAgentRolesQuery, useModelChoices } from "@/data/models";
+import type { Draft } from "@/lib/drafts";
+import {
+  AGENT_ROLES,
+  AGENT_ROLE_DEFS,
+  isAgentRole,
+} from "@/lib/models/agent-roles";
+import { ChipItem, ChipMenu } from "./Chip";
+
+// A draft's role and the model it runs on. The role's binding gives the
+// model (Settings > Agent roles); the model chip overrides it for this
+// session. Both lists come from the server.
+export function RoleChips({
+  draft,
+  onChange,
+}: {
+  draft: Draft;
+  onChange: (patch: Partial<Draft>) => void;
+}) {
+  const roles = useAgentRolesQuery("settings");
+  const { data: choices = [] } = useModelChoices(!!draft.agentRole);
+  const role = isAgentRole(draft.agentRole) ? draft.agentRole : null;
+  const bound = roles.data?.roles.find((r) => r.id === role);
+  const override = draft.roleModel
+    ? choices.find((c) => c.ref === draft.roleModel)
+    : undefined;
+  const current = override ?? bound?.choice ?? null;
+  const modelName = (ref: string | undefined | null) =>
+    ref ? ref.split("/").slice(1).join("/") : "…";
+  return (
+    <>
+      <ChipMenu
+        icon={Users}
+        name="Role"
+        label={role ? AGENT_ROLE_DEFS[role].label : "No role"}
+      >
+        <ChipItem
+          checked={!role}
+          onSelect={() => onChange({ agentRole: null, roleModel: null })}
+          hint="A plain session on the interactive model"
+        >
+          No role
+        </ChipItem>
+        {AGENT_ROLES.map((r) => {
+          const view = roles.data?.roles.find((x) => x.id === r);
+          return (
+            <ChipItem
+              key={r}
+              checked={r === role}
+              onSelect={() =>
+                onChange({ agentRole: r, roleModel: null, openPr: false })
+              }
+              hint={`${AGENT_ROLE_DEFS[r].purpose}${view?.binding ? ` · ${modelName(view.binding.ref)}` : ""}`}
+            >
+              {AGENT_ROLE_DEFS[r].label}
+            </ChipItem>
+          );
+        })}
+      </ChipMenu>
+      {role && (
+        <ChipMenu
+          icon={Cpu}
+          name="Model"
+          label={
+            draft.roleModel
+              ? modelName(draft.roleModel)
+              : `Role model: ${modelName(bound?.binding?.ref)}`
+          }
+        >
+          <ChipItem
+            checked={!draft.roleModel}
+            onSelect={() => onChange({ roleModel: null })}
+            hint={bound?.binding ? modelName(bound.binding.ref) : undefined}
+          >
+            Role model
+          </ChipItem>
+          {choices.map((c) => (
+            <ChipItem
+              key={c.ref}
+              checked={c.ref === draft.roleModel}
+              onSelect={() => onChange({ roleModel: c.ref })}
+              hint={c.group}
+            >
+              <span className="flex items-center gap-1.5">
+                <AvailabilityDot availability={c.availability} />
+                {c.label}
+                <LocalityBadge locality={c.locality} />
+              </span>
+            </ChipItem>
+          ))}
+        </ChipMenu>
+      )}
+      {role && current?.availability.state === "down" && (
+        <span
+          role="status"
+          className="text-destructive flex h-11 items-center text-xs md:h-8"
+        >
+          {modelName(current.ref)} isn&apos;t answering
+        </span>
+      )}
+    </>
+  );
+}