@saadnvd1/agent-os 0.3.715 → 0.3.723

package/components/Models/ModelBadges.tsx

@@ -0,0 +1,48 @@
+import type { Availability } from "@/lib/models/availability";
+import type { Locality } from "@/lib/models/locality";
+import { cn } from "@/lib/utils";
+
+// Whether a model runs on this machine's own networks or in the cloud.
+export function LocalityBadge({ locality }: { locality: Locality }) {
+  return (
+    <span
+      className={cn(
+        "inline-flex h-5 shrink-0 items-center rounded-full px-2 text-[11px] font-medium",
+        locality === "local"
+          ? "bg-emerald-500/15 text-emerald-700 dark:text-emerald-400"
+          : "bg-muted text-muted-foreground ring-border ring-1 ring-inset"
+      )}
+    >
+      {locality === "local" ? "Local" : "Cloud"}
+    </span>
+  );
+}
+
+const DOT = {
+  up: "bg-emerald-500",
+  down: "bg-destructive",
+  unknown: "bg-muted-foreground/50",
+} as const;
+
+const TITLE = {
+  up: "Answering",
+  down: "Not answering",
+  unknown: "Not checked",
+} as const;
+
+// The last availability check: green answering, red not, grey not checked.
+export function AvailabilityDot({
+  availability,
+}: {
+  availability: Pick<Availability, "state"> | undefined;
+}) {
+  const state = availability?.state ?? "unknown";
+  return (
+    <span
+      role="img"
+      aria-label={TITLE[state]}
+      title={TITLE[state]}
+      className={cn("inline-block h-2 w-2 shrink-0 rounded-full", DOT[state])}
+    />
+  );
+}

package/components/Models/ModelsSection.tsx

@@ -11,6 +11,7 @@ import {
   type ModelProvider,
 } from "@/lib/models/providers";
 import { SubagentModels } from "./SubagentModels";
+import { INTERNAL_MODEL_ROLES } from "@/lib/models/agent-roles";
 import { MODEL_ROLES, ROLE_LABELS } from "@/lib/models/roles";
 import { ModelSelect } from "./ModelSelect";
 import { ProviderCard } from "./ProviderCard";
@@ -58,11 +59,12 @@ export function ModelsSection() {
     <div className="space-y-6">
       <section className="space-y-2">
         <p className="text-muted-foreground text-sm">
-          Which model each kind of work runs on. A workspace can set its own
+          Which model each kind of work runs on. Developer, Analyst, Reviewer
+          and Supervisor are in Agent roles. A workspace can set its own
           (Settings › Workspaces), and a task its own when it starts or resumes.
         </p>
         <ul className="space-y-2">
-          {MODEL_ROLES.map((role) => (
+          {INTERNAL_MODEL_ROLES(MODEL_ROLES).map((role) => (
             <li
               key={role}
               className="bg-muted/40 space-y-1.5 rounded-lg px-3 py-2.5"

package/components/Models/RoleModelSelect.tsx

@@ -0,0 +1,87 @@
+"use client";
+
+import {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+import { useModelChoices } from "@/data/models";
+import type { ModelChoice } from "@/lib/models/catalog";
+import { AvailabilityDot, LocalityBadge } from "./ModelBadges";
+
+const INHERIT = "__inherit";
+
+function Row({ choice }: { choice: ModelChoice }) {
+  return (
+    <span className="flex min-w-0 flex-1 items-center gap-2">
+      <AvailabilityDot availability={choice.availability} />
+      <span className="truncate">{choice.label}</span>
+      <LocalityBadge locality={choice.locality} />
+    </span>
+  );
+}
+
+// A model picker over the server's list: grouped by provider, each model
+// labelled Local or Cloud with whether its server answers. `claudeOnly`
+// leaves out the models that run through Pi.
+export function RoleModelSelect({
+  id,
+  value,
+  inheritLabel,
+  claudeOnly,
+  gateOnly,
+  disabled,
+  onChange,
+}: {
+  id?: string;
+  value: string | null;
+  inheritLabel: string;
+  claudeOnly?: boolean;
+  // Only models that can serve a merge gate are selectable.
+  gateOnly?: boolean;
+  disabled?: boolean;
+  onChange: (ref: string | null) => void;
+}) {
+  const { data } = useModelChoices();
+  const choices = (data ?? []).filter((c) => !claudeOnly || c.agent !== "pi");
+  const groups = [...new Set(choices.map((c) => c.group))];
+  const current = value ? choices.find((c) => c.ref === value) : undefined;
+  return (
+    <Select
+      value={value ?? INHERIT}
+      onValueChange={(v) => onChange(v === INHERIT ? null : v)}
+      disabled={disabled}
+    >
+      <SelectTrigger id={id} className="h-11 md:h-9">
+        <SelectValue>
+          {current ? <Row choice={current} /> : (value ?? inheritLabel)}
+        </SelectValue>
+      </SelectTrigger>
+      <SelectContent>
+        <SelectItem value={INHERIT}>{inheritLabel}</SelectItem>
+        {value && !current && <SelectItem value={value}>{value}</SelectItem>}
+        {groups.map((g) => (
+          <SelectGroup key={g}>
+            <SelectLabel>{g}</SelectLabel>
+            {choices
+              .filter((c) => c.group === g)
+              .map((c) => (
+                <SelectItem
+                  key={c.ref}
+                  value={c.ref}
+                  disabled={gateOnly && !c.gateCapable}
+                  className="min-h-11 md:min-h-0"
+                >
+                  <Row choice={c} />
+                </SelectItem>
+              ))}
+          </SelectGroup>
+        ))}
+      </SelectContent>
+    </Select>
+  );
+}

package/components/Pane/DesktopTabBar.tsx

@@ -15,6 +15,7 @@ import type { Session } from "@/lib/db";
 import { PaneViewToggle } from "./PaneViewToggle";
 import { PaneMenu } from "./PaneMenu";
 import { HostBadge } from "@/components/Hosts/HostBadge";
+import { RolePill } from "@/components/Sessions/RolePill";
 import { usePaneBarSlots } from "./PaneBarSlots";
 import { ChatBookmarksButton } from "@/components/Bookmarks/ChatBookmarksButton";
 import type { ViewMode } from "@/contexts/PaneContext";
@@ -161,6 +162,7 @@ export function DesktopTabBar({
       </div>
 
       <div className="flex shrink-0 items-center gap-1.5">
+        <RolePill session={session} paneId={paneId} />
         <HostBadge hostId={session?.host_id} />
         <ContextMeter sessionId={session?.id} />
         <SessionPrStage sessionId={session?.id} />

package/components/Pane/MobileTabBar.tsx

@@ -24,6 +24,7 @@ import {
   Search,
   Star,
   Share2,
+  Download,
   TextSearch,
 } from "lucide-react";
 import { cn } from "@/lib/utils";
@@ -31,8 +32,10 @@ import { useAwayQuery } from "@/data/away";
 import { awayUntil } from "@/components/Away/time";
 import type { Session, Project } from "@/lib/db";
 import { HostBadge } from "@/components/Hosts/HostBadge";
+import { RolePill } from "@/components/Sessions/RolePill";
 import { bookmarksUiActions } from "@/stores/bookmarksUi";
 import { shareUiActions } from "@/stores/shareUi";
+import { exportUiActions } from "@/stores/exportUi";
 import { MoveMenuItems } from "@/components/Tasks/MoveMenuItems";
 import { ChatBookmarksButton } from "@/components/Bookmarks/ChatBookmarksButton";
 import type { ViewMode } from "@/contexts/PaneContext";
@@ -219,6 +222,14 @@ export function MobileTabBar({
                   <Share2 className="h-4 w-4" />
                   Share…
                 </DropdownMenuItem>
+                <DropdownMenuItem
+                  onSelect={() =>
+                    exportUiActions.open(session.id, session.name)
+                  }
+                >
+                  <Download className="h-4 w-4" />
+                  Export for AI…
+                </DropdownMenuItem>
                 <DropdownMenuSeparator />
               </>
             )}
@@ -270,6 +281,7 @@ export function MobileTabBar({
         </button>
       </div>
 
+      <RolePill session={session} compact />
       {bookmarksSessionId && (
         <ChatBookmarksButton
           sessionId={bookmarksSessionId}

package/components/Pane/PaneMenu.tsx

@@ -8,6 +8,7 @@ import {
   Link,
   MoreHorizontal,
   Share2,
+  Download,
   SplitSquareHorizontal,
   SplitSquareVertical,
   Star,
@@ -27,6 +28,7 @@ import {
 import { copySessionLink, writeClipboard } from "@/hooks/useCopyToClipboard";
 import type { Session } from "@/lib/db";
 import { shareUiActions } from "@/stores/shareUi";
+import { exportUiActions } from "@/stores/exportUi";
 import { useSessionBookmarks } from "@/data/bookmarks";
 import { useDocsWorkspace } from "@/data/lumifyhub/docs";
 import { bookmarksUiActions } from "@/stores/bookmarksUi";
@@ -117,6 +119,14 @@ export function PaneMenu({
                 Share…
               </DropdownMenuItem>
             )}
+            {session.view === "chat" && (
+              <DropdownMenuItem
+                onSelect={() => exportUiActions.open(session.id, session.name)}
+              >
+                <Download className="h-4 w-4" />
+                Export for AI…
+              </DropdownMenuItem>
+            )}
             <DropdownMenuSeparator />
             <MoveMenuItems
               session={session}

package/components/SessionList/SessionRow.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { AGENT_ROLE_DEFS, isAgentRole } from "@/lib/models/agent-roles";
 import { isFork } from "@/lib/sessions/fork";
 import { memo, useState } from "react";
 import { useSnapshot } from "valtio";
@@ -126,14 +127,24 @@ export const SessionRow = memo(function SessionRow({
             }}
           />
         ) : (
-          <span
-            className={cn(
-              "truncate text-sm",
-              muted && !active ? "text-muted-foreground" : "text-foreground",
-              active && "font-medium"
+          <span className="flex min-w-0 items-center gap-1.5">
+            {isAgentRole(session.agent_role) && (
+              <span
+                title={AGENT_ROLE_DEFS[session.agent_role].label}
+                className="bg-accent text-primary grid h-4 w-4 shrink-0 place-items-center rounded text-[10px] font-semibold"
+              >
+                {AGENT_ROLE_DEFS[session.agent_role].label[0]}
+              </span>
             )}
-          >
-            {session.name}
+            <span
+              className={cn(
+                "truncate text-sm",
+                muted && !active ? "text-muted-foreground" : "text-foreground",
+                active && "font-medium"
+              )}
+            >
+              {session.name}
+            </span>
           </span>
         )}
         <RowSubtitle

package/components/SessionList/SessionRowMenu.tsx

@@ -15,6 +15,7 @@ import {
   KanbanSquare,
   Link,
   Share2,
+  Download,
   Loader2,
   Pencil,
   Pin,
@@ -49,6 +50,7 @@ import type { SidebarRow } from "@/lib/sidebar/shelves";
 import { useRowContext } from "./RowContext";
 import { MoveMenuItems } from "@/components/Tasks/MoveMenuItems";
 import { shareUiActions } from "@/stores/shareUi";
+import { exportUiActions } from "@/stores/exportUi";
 import { copySessionLink } from "@/hooks/useCopyToClipboard";
 import { useLinkedHostNames } from "@/data/hosts";
 import { remoteBlocks, remoteNote } from "@/lib/hosts/remote-menu";
@@ -196,6 +198,10 @@ export function SessionRowMenu({
             title: session.name,
           })
         );
+      case "export":
+        return item("Export for AI…", Download, () =>
+          exportUiActions.open(session.id, session.name)
+        );
       case "fork":
         return item("Fork session", Copy, () => ctx.onFork(session.id));
       case "fresh-start":

package/components/Sessions/RolePill.tsx

@@ -0,0 +1,196 @@
+"use client";
+
+import { useState } from "react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import {
+  AvailabilityDot,
+  LocalityBadge,
+} from "@/components/Models/ModelBadges";
+import { RoleModelSelect } from "@/components/Models/RoleModelSelect";
+import { useCrewQuery, useSwitchSessionModel } from "@/data/models";
+import { useLaunchSession } from "@/data/sessions";
+import { usePanes } from "@/contexts/PaneContext";
+import type { Session } from "@/lib/db";
+import {
+  AGENT_ROLES,
+  AGENT_ROLE_DEFS,
+  isAgentRole,
+} from "@/lib/models/agent-roles";
+import { cn } from "@/lib/utils";
+import { uuid } from "@/lib/uuid";
+
+const modelName = (ref: string | null) =>
+  ref ? ref.split("/").slice(1).join("/") : "model";
+
+// The role a running session was started in and the model it runs on, with
+// its crew: the sessions it works with, by @name. Nothing for a session
+// started without a role. `compact` is a phone's small button.
+export function RolePill({
+  session,
+  paneId,
+  compact,
+}: {
+  session: Session | null | undefined;
+  paneId?: string;
+  compact?: boolean;
+}) {
+  const [open, setOpen] = useState(false);
+  const role = isAgentRole(session?.agent_role) ? session.agent_role : null;
+  const crew = useCrewQuery(session?.id, !!role);
+  const switchModel = useSwitchSessionModel(session?.id ?? "");
+  const launch = useLaunchSession();
+  const { attachSession } = usePanes();
+  if (!session || !role) return null;
+  const me = crew.data?.members.find((m) => m.id === session.id);
+  const down = me?.availability === "down";
+  const label = AGENT_ROLE_DEFS[role].label;
+  const others = crew.data?.members.filter((m) => m.id !== session.id) ?? [];
+
+  const add = async (next: (typeof AGENT_ROLES)[number]) => {
+    try {
+      const { session: made } = await launch.mutateAsync({
+        id: uuid(),
+        projectId: session.project_id,
+        agentType: "claude",
+        model: "",
+        access: "full",
+        useWorktree: false,
+        baseBranch: null,
+        prompt: "",
+        agentRole: next,
+        crewId: session.crew_id ?? session.id,
+      });
+      if (paneId) attachSession(paneId, made.id, made.tmux_name ?? "");
+      setOpen(false);
+    } catch (error) {
+      toast.error(error instanceof Error ? error.message : String(error));
+    }
+  };
+
+  return (
+    <>
+      <button
+        type="button"
+        onClick={(e) => {
+          e.stopPropagation();
+          setOpen(true);
+        }}
+        aria-label={`${label}, ${modelName(me?.ref ?? null)}${down ? ", model not answering" : ""}`}
+        className={cn(
+          "ring-border/70 flex shrink-0 items-center gap-1.5 rounded-full text-xs ring-1 ring-inset",
+          down
+            ? "bg-amber-500/10 text-amber-600 dark:text-amber-400"
+            : "bg-muted/60",
+          compact
+            ? "-my-1.5 h-11 w-11 justify-center rounded-lg ring-0"
+            : "h-7 max-w-64 px-2.5"
+        )}
+      >
+        <span className="bg-accent text-primary grid h-4 w-4 shrink-0 place-items-center rounded text-[10px] font-semibold">
+          {label[0]}
+        </span>
+        {!compact && (
+          <>
+            <span className="truncate">
+              {label}
+              {me?.ref ? ` · ${modelName(me.ref)}` : ""}
+            </span>
+            {me && !down && <LocalityBadge locality={me.locality} />}
+            {down && <span className="shrink-0">unreachable</span>}
+          </>
+        )}
+        {compact && down && (
+          <span className="bg-destructive absolute h-2 w-2 translate-x-3 -translate-y-3 rounded-full" />
+        )}
+      </button>
+      <Dialog open={open} onOpenChange={setOpen}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>{label} · role and crew</DialogTitle>
+            <DialogDescription>
+              {AGENT_ROLE_DEFS[role].purpose}
+            </DialogDescription>
+          </DialogHeader>
+          <div className="bg-muted/40 space-y-2 rounded-xl p-3">
+            <div className="flex items-center justify-between gap-2">
+              <span className="flex min-w-0 items-center gap-2 text-sm font-medium">
+                <AvailabilityDot
+                  availability={{ state: me?.availability ?? "unknown" }}
+                />
+                <span className="truncate">{modelName(me?.ref ?? null)}</span>
+              </span>
+              {me && <LocalityBadge locality={me.locality} />}
+            </div>
+            {down && (
+              <p role="alert" className="text-destructive text-xs">
+                This model&apos;s server isn&apos;t answering. Your conversation
+                is kept: switch to another model to carry on.
+              </p>
+            )}
+            <RoleModelSelect
+              value={me?.ref ?? null}
+              inheritLabel="Switch model…"
+              disabled={switchModel.isPending}
+              onChange={(ref) =>
+                ref &&
+                switchModel.mutate(ref, {
+                  onError: (e) => toast.error(e.message),
+                  onSuccess: () => toast.success("Switched model"),
+                })
+              }
+            />
+          </div>
+          <div className="space-y-1.5">
+            <h3 className="text-muted-foreground text-xs font-medium uppercase">
+              Crew
+            </h3>
+            {others.length === 0 && (
+              <p className="text-muted-foreground text-sm">
+                Nobody else yet. Add a role to work with this session.
+              </p>
+            )}
+            {others.map((m) => (
+              <div key={m.id} className="flex items-center gap-2 text-sm">
+                <span className="min-w-0 flex-1">
+                  <span className="block truncate">{m.name}</span>
+                  <span className="text-muted-foreground block truncate font-mono text-xs">
+                    {m.agentRole ? `@${m.agentRole}` : "no role"} ·{" "}
+                    {modelName(m.ref)}
+                  </span>
+                </span>
+                <AvailabilityDot availability={{ state: m.availability }} />
+                <LocalityBadge locality={m.locality} />
+              </div>
+            ))}
+          </div>
+          <div className="flex flex-wrap gap-2">
+            {AGENT_ROLES.filter(
+              (r) =>
+                r !== role &&
+                r !== "supervisor" &&
+                !others.some((m) => m.agentRole === r)
+            ).map((r) => (
+              <Button
+                key={r}
+                variant="outline"
+                className="h-11 md:h-9"
+                disabled={launch.isPending}
+                onClick={() => void add(r)}
+              >
+                Add {AGENT_ROLE_DEFS[r].label}
+              </Button>
+            ))}
+          </div>
+        </DialogContent>
+      </Dialog>
+    </>
+  );
+}

package/components/Settings/SettingsDialog.tsx

@@ -19,6 +19,7 @@ import {
   FlaskConical,
   RefreshCw,
   Smartphone,
+  Users,
   X,
   type LucideIcon,
 } from "lucide-react";
@@ -34,6 +35,7 @@ import { AuditsPanel } from "@/components/Audits/AuditsPanel";
 import { HealthPanel } from "@/components/Health/HealthPanel";
 import { DevicesPanel } from "@/components/Devices";
 import { GlobalMergeSection } from "@/components/Merge/GlobalMergeSection";
+import { AgentRolesSection } from "@/components/Models/AgentRolesSection";
 import { ModelsSection } from "@/components/Models/ModelsSection";
 import { SharedLinksPanel } from "@/components/Shares/SharedLinksPanel";
 import { SchedulesPanel } from "@/components/Schedules";
@@ -87,6 +89,11 @@ export const SECTION_INFO: Record<
     hint: "Which model each kind of work runs on, and providers",
     icon: Cpu,
   },
+  "agent-roles": {
+    label: "Agent roles",
+    hint: "Developer, Analyst, Reviewer and Supervisor: a model each, local or cloud",
+    icon: Users,
+  },
   notifications: {
     label: "Notifications",
     hint: "Sound, browser alerts, your phone",
@@ -145,6 +152,8 @@ function SectionBody({
       return <WorkspaceSettings />;
     case "models":
       return <ModelsSection />;
+    case "agent-roles":
+      return <AgentRolesSection />;
     case "devices":
       return <DevicesPanel />;
     case "shares":

package/components/Share/ShareDialog.tsx

@@ -28,6 +28,7 @@ import {
   type SharePreview,
 } from "@/data/shares";
 import { shareUi, shareUiActions } from "@/stores/shareUi";
+import { exportUiActions } from "@/stores/exportUi";
 import {
   DEFAULT_EXPIRY,
   EXPIRIES,
@@ -271,6 +272,18 @@ function ShareBody({
           {error && preview && (
             <p className="text-destructive text-sm">{error}</p>
           )}
+          {kind === "chat" && sessionId && (
+            <button
+              type="button"
+              onClick={() => {
+                shareUiActions.close();
+                exportUiActions.open(sessionId, target.title);
+              }}
+              className="text-muted-foreground hover:text-foreground min-h-11 self-start text-xs underline underline-offset-2"
+            >
+              Export for AI instead…
+            </button>
+          )}
         </div>
       </div>
 

package/data/analyst/index.ts

@@ -0,0 +1,3 @@
+export { analystKeys } from "./keys";
+export { useAnalystLink, useSessionAnalyst } from "./queries";
+export * from "./mutations";

package/data/analyst/keys.ts

@@ -0,0 +1,6 @@
+export const analystKeys = {
+  all: ["analyst"] as const,
+  link: (id: string) => [...analystKeys.all, "link", id] as const,
+  ofSession: (sessionId: string) =>
+    [...analystKeys.all, "session", sessionId] as const,
+};