@saadnvd1/agent-os 0.3.548 → 0.3.550

package/app/api/pair/claim/route.ts

@@ -7,10 +7,12 @@ import { MAX_CLAIM_BYTES, readCapped } from "@/lib/security/read-capped";
 import {
   claimResponseBody,
   claimSetsCookie,
+  isNativeClaim,
 } from "@/lib/security/claim-response";
 
 // POST /api/pair/claim - reachable without a token; trades a code for one.
-// A client that isn't a browser sends `token: true` to get it in the body too.
+// A client that isn't a browser sends `token: true` to get it in the body too,
+// and starts with Can approve: it held a one-time code, as a browser does.
 export async function POST(request: NextRequest) {
   const raw = await readCapped(request, MAX_CLAIM_BYTES);
   if (raw === null)
@@ -23,6 +25,10 @@ export async function POST(request: NextRequest) {
   }
   if (!body.code)
     return NextResponse.json({ error: "code required" }, { status: 400 });
+  const native = isNativeClaim({
+    wantsToken: body.token,
+    origin: request.headers.get("origin"),
+  });
   const result = claimPairing({
     code: body.code,
     name: body.name ?? "",
@@ -31,6 +37,7 @@ export async function POST(request: NextRequest) {
       request.headers.get(REMOTE_HEADER),
       request.headers.get("x-forwarded-for")
     ),
+    native,
   });
   if (!result.ok) {
     const status = result.error === "rate_limited" ? 429 : 400;

package/components/SessionList/QuickChangeRow.tsx

@@ -4,6 +4,8 @@ import { GitPullRequest } from "lucide-react";
 import type { SidebarRow } from "@/lib/sidebar/shelves";
 import { TASK_STATE } from "@/components/Tasks/task-state-labels";
 import { cn } from "@/lib/utils";
+import { RowShell } from "./RowShell";
+import { SessionRowMenu } from "./SessionRowMenu";
 
 // One of an orchestrator's quick changes, under it: its name, its PR and
 // where CI stands. It has no agent to open, so the row opens its PR.
@@ -14,45 +16,50 @@ export function QuickChangeRow({ row }: { row: SidebarRow }) {
   const label = !session.pr_number
     ? "Editing, no PR yet"
     : `PR #${session.pr_number}${state ? ` · ${state.label}` : ""}`;
+  const leading = (
+    <GitPullRequest
+      aria-hidden
+      className={cn(
+        "h-3.5 w-3.5 shrink-0",
+        state?.tone ?? "text-muted-foreground"
+      )}
+    />
+  );
   const body = (
     <>
-      <GitPullRequest
-        aria-hidden
+      <span className="text-foreground truncate text-[13px]">
+        {session.name}
+      </span>
+      <span
         className={cn(
-          "h-3.5 w-3.5 shrink-0",
-          state?.tone ?? "text-muted-foreground"
+          "mt-0.5 truncate text-xs",
+          session.pr_number && state ? state.tone : "text-muted-foreground"
         )}
-      />
-      <span className="flex min-w-0 flex-1 flex-col leading-tight">
-        <span className="text-foreground truncate text-[13px]">
-          {session.name}
-        </span>
-        <span
-          className={cn(
-            "mt-0.5 truncate text-xs",
-            session.pr_number && state ? state.tone : "text-muted-foreground"
-          )}
-        >
-          {label}
-        </span>
+      >
+        {label}
       </span>
     </>
   );
-  const frame =
-    "ml-5 flex min-h-11 items-center gap-2 rounded-md px-2.5 py-1 md:min-h-9";
-  return pr ? (
-    <a
-      href={pr}
-      target="_blank"
-      rel="noreferrer"
-      title={`Quick change: ${session.name}\n${label}`}
-      className={cn(frame, "hover:bg-muted/60 transition-colors")}
-    >
-      {body}
-    </a>
-  ) : (
-    <div title={`Quick change: ${session.name}\n${label}`} className={frame}>
-      {body}
+  const openPr = pr ? () => window.open(pr, "_blank") : undefined;
+  return (
+    <div className="ml-5">
+      <RowShell
+        title={`Quick change: ${session.name}\n${label}`}
+        onActivate={openPr}
+        onClick={openPr}
+        leading={leading}
+        menu={(kind) => (
+          <SessionRowMenu
+            session={session}
+            row={row}
+            kind={kind}
+            onRename={() => {}}
+          />
+        )}
+        menuLabel="Quick change actions"
+      >
+        {body}
+      </RowShell>
     </div>
   );
 }

package/components/SessionList/SessionRowMenu.test.ts

@@ -0,0 +1,152 @@
+import "@/components/Chat/composer/test-dom";
+import { act, createElement } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import type { Session } from "@/lib/db/types";
+import type { SidebarRow } from "@/lib/sidebar/shelves";
+import { RowProvider, type RowContextValue } from "./RowContext";
+import { SessionRowMenu } from "./SessionRowMenu";
+
+// Radix's focus handling needs a real browser; plain elements show what the
+// menu offers.
+vi.mock("@/components/ui/dropdown-menu", async (importOriginal) => {
+  const { createElement: h } = await import("react");
+  const part = (props: { children?: unknown; onClick?: () => void }) =>
+    h("div", { onClick: props.onClick }, props.children as never);
+  return {
+    ...(await importOriginal<object>()),
+    DropdownMenuItem: part,
+    DropdownMenuSeparator: part,
+    DropdownMenuSub: part,
+    DropdownMenuSubTrigger: part,
+    DropdownMenuSubContent: part,
+  };
+});
+
+(
+  globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }
+).IS_REACT_ACT_ENVIRONMENT = true;
+
+let root: Root;
+let host: HTMLElement;
+beforeEach(() => {
+  host = document.createElement("div");
+  document.body.append(host);
+  root = createRoot(host);
+});
+afterEach(() => {
+  act(() => root.unmount());
+  host.remove();
+});
+
+const ctx: RowContextValue = {
+  summarizingSessionId: null,
+  projects: [],
+  projectNames: new Map(),
+  workspaceNames: new Map(),
+  orchestrators: [],
+  runningByWorkspace: new Map(),
+  queuedByWorkspace: new Map(),
+  rollups: new Map(),
+  orchestratorNames: new Map(),
+  orderedIds: () => [],
+  cardUrl: () => null,
+  onSelect: vi.fn(),
+  onRename: vi.fn(),
+  onFork: vi.fn(),
+  onSummarize: vi.fn(),
+  onDelete: vi.fn(),
+  onMoveToProject: vi.fn(),
+  onPin: vi.fn(),
+  onFresh: vi.fn(),
+};
+
+async function menuText(session: Partial<Session>) {
+  const full = { id: "s1", name: "Fix typo", ...session } as Session;
+  const row: SidebarRow = {
+    session: full,
+    status: undefined,
+    need: null,
+    unread: false,
+    working: false,
+    activeAt: 0,
+    workers: [],
+  };
+  await act(async () =>
+    root.render(
+      createElement(
+        QueryClientProvider,
+        { client: new QueryClient() },
+        createElement(
+          RowProvider,
+          { value: ctx },
+          createElement(SessionRowMenu, {
+            session: full,
+            row,
+            kind: "dropdown",
+            onRename: () => {},
+          })
+        )
+      )
+    )
+  );
+  return document.body.textContent ?? "";
+}
+
+describe("SessionRowMenu", () => {
+  it("gives a quick change Done, Archive and Delete", async () => {
+    const text = await menuText({
+      quick_of: "o1",
+      task_status: "running",
+      role: null,
+    });
+    expect(text).toContain("Done");
+    expect(text).toContain("Archive");
+    expect(text).toContain("Delete session");
+  });
+
+  it("gives an orchestrator neither Done nor Archive", async () => {
+    const text = await menuText({ role: "orchestrator" });
+    expect(text).not.toContain("Done");
+    expect(text).not.toContain("Archive");
+  });
+});
+
+describe("QuickChangeRow", () => {
+  it("has a row menu to finish it from", async () => {
+    const { QuickChangeRow } = await import("./QuickChangeRow");
+    const session = {
+      id: "q1",
+      name: "Fix typo",
+      quick_of: "o1",
+      task_status: "running",
+    } as Session;
+    await act(async () =>
+      root.render(
+        createElement(
+          QueryClientProvider,
+          { client: new QueryClient() },
+          createElement(
+            RowProvider,
+            { value: ctx },
+            createElement(QuickChangeRow, {
+              row: {
+                session,
+                status: undefined,
+                need: null,
+                unread: false,
+                working: false,
+                activeAt: 0,
+                workers: [],
+              },
+            })
+          )
+        )
+      )
+    );
+    expect(
+      host.querySelector('[aria-label="Quick change actions"]')
+    ).not.toBeNull();
+  });
+});

package/components/SessionList/SessionRowMenu.tsx

@@ -148,6 +148,28 @@ export function SessionRowMenu({
     ctx.projects.find((p) => p.id === session.project_id)?.workspace_id ??
     null;
 
+  // A quick change has no agent: no fork, fresh start, snooze or move, just
+  // its PR and the ways to finish it.
+  if (session.quick_of)
+    return (
+      <>
+        {session.pr_url && (
+          <Item onClick={() => window.open(session.pr_url!, "_blank")}>
+            <GitPullRequest className={icon} />
+            Open PR #{session.pr_number}
+          </Item>
+        )}
+        <FinishItems session={session} plain={plain} Item={Item} />
+        <Item
+          onClick={() => ctx.onDelete(session.id)}
+          className="text-red-500 focus:text-red-500"
+        >
+          <Trash2 className={icon} />
+          Delete session
+        </Item>
+      </>
+    );
+
   return (
     <>
       {session.branch_name && (

package/lib/db/migrations.ts

@@ -1994,6 +1994,22 @@ const migrations: Migration[] = [
       );
     },
   },
+  {
+    id: 83,
+    name: "native_devices_can_approve",
+    up: (db) => {
+      // New native pairings start with Can approve; this gives it once to the
+      // ones paired before. The claim wasn't recorded, so the app is known by
+      // its user agent (`AgentOS/<build> CFNetwork/...` on iOS) or by an
+      // app push token. It only ever turns the flag on.
+      db.exec(
+        `UPDATE devices SET can_approve = 1
+         WHERE revoked_at IS NULL AND can_approve = 0
+           AND (user_agent LIKE 'AgentOS/% CFNetwork/%'
+                OR push_platform IN ('ios', 'android'))`
+      );
+    },
+  },
 ];
 
 // `upTo`: stop after this id (tests that start from an older database).

package/lib/security/approver.ts

@@ -1,6 +1,7 @@
 /**
  * Who may answer the orchestrator's asks or pause it: this machine, the
- * tailnet, or a paired device Saad has let approve (off by default). This
+ * tailnet, or a paired device with Can approve (the native app gets it at
+ * pairing; Saad can turn it off or on in Devices). This
  * is the coarse gate; approvals that matter also need a passkey (presence).
  */
 

package/lib/security/claim-response.ts

@@ -11,13 +11,19 @@ export interface ClaimBody {
   token?: string;
 }
 
+// The native app asks for its token and sends no Origin; a browser always
+// sends one on a POST, so a page can't pass for the app.
+export const isNativeClaim = (request: {
+  wantsToken?: unknown;
+  origin: string | null;
+}) => request.wantsToken === true && !request.origin;
+
 export function claimResponseBody(
   device: { id: string; name: string },
   token: string,
   request: { wantsToken?: unknown; origin: string | null }
 ): ClaimBody {
-  const native = request.wantsToken === true && !request.origin;
-  return { device, ...(native ? { token } : {}) };
+  return { device, ...(isNativeClaim(request) ? { token } : {}) };
 }
 
 // Whether the reply also sets the device cookie: only for a browser. A

package/lib/security/devices.ts

@@ -20,7 +20,8 @@ export interface Device {
   last_seen_at: string | null;
   last_address: string | null;
   revoked_at: string | null;
-  // Saad let it answer the orchestrator's asks (off by default).
+  // It may answer the orchestrator's asks: on for the native app at
+  // pairing, off for a browser; Saad can flip it either way in Devices.
   can_approve: number;
 }
 
@@ -32,19 +33,22 @@ export const hashToken = (token: string) =>
 
 export function mintDevice(
   name: string,
-  userAgent?: string | null
+  userAgent?: string | null,
+  canApprove = false
 ): { device: Device; token: string } {
   const id = crypto.randomUUID();
   const token = TOKEN_PREFIX + crypto.randomBytes(32).toString("base64url");
   getDb()
     .prepare(
-      `INSERT INTO devices (id, name, token_hash, user_agent) VALUES (?, ?, ?, ?)`
+      `INSERT INTO devices (id, name, token_hash, user_agent, can_approve)
+       VALUES (?, ?, ?, ?, ?)`
     )
     .run(
       id,
       name.trim().slice(0, 80) || "Device",
       hashToken(token),
-      userAgent ?? null
+      userAgent ?? null,
+      canApprove ? 1 : 0
     );
   return { device: getDevice(id)!, token };
 }

package/lib/security/pairing.ts

@@ -82,6 +82,8 @@ export function claimPairing(
     name: string;
     userAgent?: string | null;
     address: string;
+    // The native app (claimResponseBody's test): it may approve from the start.
+    native?: boolean;
   },
   now = Date.now()
 ): ClaimResult {
@@ -103,7 +105,11 @@ export function claimPairing(
   const p = state.codes.get(normalizeCode(input.code));
   if (!p || p.claimed || p.expiresAt < now)
     return { ok: false, error: "invalid" };
-  const { device, token } = mintDevice(input.name, input.userAgent);
+  const { device, token } = mintDevice(
+    input.name,
+    input.userAgent,
+    input.native === true
+  );
   p.claimed = { deviceId: device.id, name: device.name };
   return { ok: true, device, token };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saadnvd1/agent-os",
-  "version": "0.3.548",
+  "version": "0.3.550",
   "description": "Self-hosted web UI for managing Claude Code sessions",
   "bin": {
     "agent-os": "scripts/agent-os"