@saadnvd1/agent-os 0.3.700 → 0.3.715

package/components/Claims/ClaimRow.tsx

@@ -0,0 +1,82 @@
+"use client";
+
+import { useState } from "react";
+import { ChevronRight, ExternalLink, GitBranch } from "lucide-react";
+import { cn } from "@/lib/utils";
+import type { Claim } from "@/lib/claims/types";
+import { ClaimFiles } from "./ClaimFiles";
+import { startedText } from "./format";
+
+// One piece of claimed work: what, where, since when; its files fold open.
+export function ClaimRow({
+  claim,
+  here,
+  now,
+  shared,
+}: {
+  claim: Claim;
+  here: boolean;
+  now: number;
+  shared: ReadonlySet<string>;
+}) {
+  const [open, setOpen] = useState(false);
+  const count = claim.files.length + claim.filesMore;
+  return (
+    <li className="bg-muted/40 rounded-xl" data-claim={claim.id}>
+      <button
+        type="button"
+        onClick={() => setOpen((v) => !v)}
+        aria-expanded={open}
+        className="flex min-h-11 w-full items-start gap-2 rounded-xl p-3 text-left"
+      >
+        <ChevronRight
+          aria-hidden
+          className={cn(
+            "text-muted-foreground mt-0.5 h-4 w-4 shrink-0 transition-transform",
+            open && "rotate-90"
+          )}
+        />
+        <span className="min-w-0 flex-1">
+          <span className="block text-sm font-medium break-words">
+            {claim.goal}
+          </span>
+          <span className="text-muted-foreground mt-0.5 flex flex-wrap items-center gap-x-2 gap-y-0.5 text-xs">
+            <span>
+              {here ? `${claim.originName} (here)` : claim.originName}
+            </span>
+            {claim.branch && (
+              <span className="flex min-w-0 items-center gap-1">
+                <GitBranch aria-hidden className="h-3 w-3 shrink-0" />
+                <span className="truncate">{claim.branch}</span>
+              </span>
+            )}
+            <span>{startedText(claim, now)}</span>
+            <span>
+              {count} file{count === 1 ? "" : "s"}
+            </span>
+          </span>
+        </span>
+      </button>
+      {claim.prUrl && (
+        <a
+          href={claim.prUrl}
+          target="_blank"
+          rel="noreferrer"
+          className="text-primary flex min-h-11 items-center gap-1 px-3 pb-2 pl-9 text-xs hover:underline"
+        >
+          <ExternalLink aria-hidden className="h-3 w-3" />
+          Pull request
+        </a>
+      )}
+      {open && (
+        <div className="px-3 pb-3 pl-9">
+          <ClaimFiles
+            files={claim.files}
+            more={claim.filesMore}
+            shared={shared}
+          />
+        </div>
+      )}
+    </li>
+  );
+}

package/components/Claims/ClaimsSheet.tsx

@@ -0,0 +1,176 @@
+"use client";
+
+import { useMemo } from "react";
+import { useSnapshot } from "valtio";
+import { GitCompareArrows } from "lucide-react";
+import { StatusPill } from "@/components/ui/status-pill";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { useNow } from "@/components/Chat/useNow";
+import { useClaims } from "@/data/claims";
+import { claimsUi, claimsUiActions } from "@/stores/claimsUi";
+import { cn } from "@/lib/utils";
+import { ClaimRow } from "./ClaimRow";
+import { QUIET_MS, focusView, groupByRepo, lastHeardText } from "./format";
+
+const Skeleton = () => (
+  <div className="space-y-2" aria-label="Loading claims">
+    {[0, 1, 2].map((i) => (
+      <div key={i} className="bg-muted/40 h-16 animate-pulse rounded-xl" />
+    ))}
+  </div>
+);
+
+// Work across machines: what each linked machine's sessions are on, the
+// overlaps first, and when each machine was last heard from.
+export function ClaimsSheet() {
+  const snap = useSnapshot(claimsUi);
+  const { data, isPending, isError, dataUpdatedAt } = useClaims({
+    enabled: snap.open,
+  });
+  const tick = useNow(snap.open);
+  const now = tick + (data ? data.now - dataUpdatedAt : 0);
+  const view = useMemo(
+    () => (data ? focusView(data, snap.focus ? [...snap.focus] : null) : null),
+    [data, snap.focus]
+  );
+  const byId = useMemo(
+    () => new Map((view?.claims ?? []).map((c) => [c.id, c])),
+    [view]
+  );
+  const sharedOf = (id: string) =>
+    new Set(
+      (view?.overlaps ?? [])
+        .filter((o) => o.a === id || o.b === id)
+        .flatMap((o) => o.shared)
+    );
+  const here = data?.machine.id;
+
+  return (
+    <Dialog open={snap.open} onOpenChange={claimsUiActions.setOpen}>
+      <DialogContent className="max-h-[90vh] max-w-xl overflow-y-auto [&>*]:min-w-0">
+        <DialogHeader>
+          <DialogTitle>Work across machines</DialogTitle>
+          <DialogDescription className="sr-only">
+            What sessions on this and linked machines are working on, and where
+            the work overlaps.
+          </DialogDescription>
+        </DialogHeader>
+        {isPending && <Skeleton />}
+        {isError && (
+          <p className="text-destructive text-sm">Couldn’t load claims.</p>
+        )}
+        {data && view && (
+          <div className="space-y-4">
+            <ul className="flex flex-wrap gap-2" aria-label="Machines">
+              {data.machines.map((m) => {
+                const quiet =
+                  !m.self &&
+                  (m.lastHeardAt === null || now - m.lastHeardAt > QUIET_MS);
+                return (
+                  <li
+                    key={m.id}
+                    className="bg-muted/40 flex items-center gap-2 rounded-lg px-3 py-2 text-xs"
+                  >
+                    <span className="font-medium">{m.name}</span>
+                    <span
+                      className={cn(
+                        "text-muted-foreground",
+                        quiet && "text-amber-700 dark:text-amber-400"
+                      )}
+                    >
+                      {lastHeardText(m.lastHeardAt, now)}
+                    </span>
+                  </li>
+                );
+              })}
+            </ul>
+            {snap.focus && (
+              <button
+                type="button"
+                onClick={claimsUiActions.showAll}
+                className="text-primary min-h-11 text-sm"
+              >
+                Showing one pair. Show all work
+              </button>
+            )}
+            {view.overlaps.length > 0 && (
+              <section className="space-y-2" aria-label="Overlaps">
+                <h3 className="text-muted-foreground text-xs font-semibold tracking-wide uppercase">
+                  Overlaps
+                </h3>
+                <ul className="space-y-2">
+                  {view.overlaps.map((o) => {
+                    const a = byId.get(o.a);
+                    const b = byId.get(o.b);
+                    if (!a || !b) return null;
+                    return (
+                      <li
+                        key={`${o.a}|${o.b}`}
+                        className="bg-muted/40 flex items-start gap-2 rounded-xl p-3 text-sm"
+                      >
+                        <StatusPill
+                          tone={o.strength === "strong" ? "amber" : "muted"}
+                        >
+                          <GitCompareArrows
+                            aria-hidden
+                            className="h-2.5 w-2.5"
+                          />
+                          {o.strength}
+                        </StatusPill>
+                        <span className="min-w-0 flex-1 break-words">
+                          {a.goal} on {a.originName} and {b.goal} on{" "}
+                          {b.originName}
+                          <span className="text-muted-foreground block text-xs">
+                            {[
+                              o.kinds.join(" + "),
+                              o.shared.length
+                                ? `${o.shared.length} shared file${o.shared.length === 1 ? "" : "s"}`
+                                : null,
+                            ]
+                              .filter(Boolean)
+                              .join(" · ")}
+                          </span>
+                        </span>
+                      </li>
+                    );
+                  })}
+                </ul>
+              </section>
+            )}
+            {view.claims.length === 0 ? (
+              <p className="text-muted-foreground py-6 text-center text-sm">
+                Nothing is claimed right now. Work shows up here while a session
+                has changes in a repository.
+              </p>
+            ) : (
+              groupByRepo(view.claims).map((g) => (
+                <section key={g.repo} className="space-y-2" aria-label={g.repo}>
+                  <h3 className="text-muted-foreground truncate text-xs font-semibold">
+                    {g.repo}
+                  </h3>
+                  <ul className="space-y-2">
+                    {g.claims.map((c) => (
+                      <ClaimRow
+                        key={c.id}
+                        claim={c}
+                        here={c.origin === here}
+                        now={now}
+                        shared={sharedOf(c.id)}
+                      />
+                    ))}
+                  </ul>
+                </section>
+              ))
+            )}
+          </div>
+        )}
+      </DialogContent>
+    </Dialog>
+  );
+}

package/components/Claims/OverlapPill.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import { GitCompareArrows } from "lucide-react";
+import { StatusPill } from "@/components/ui/status-pill";
+import type { Session } from "@/lib/db";
+import { claimsUiActions } from "@/stores/claimsUi";
+
+// "Overlaps: box" on a session row: amber when the overlap is strong, muted
+// when weak. Tapping opens the claims sheet on that pair.
+export function OverlapPill({
+  overlap,
+}: {
+  overlap: NonNullable<Session["overlap"]>;
+}) {
+  const strong = overlap.strength === "strong";
+  const files = overlap.shared
+    ? ` · ${overlap.shared} shared file${overlap.shared === 1 ? "" : "s"}`
+    : "";
+  return (
+    <StatusPill
+      tone={strong ? "amber" : "muted"}
+      data-tip={`${strong ? "Strong" : "Weak"} overlap with "${overlap.goal}" on ${overlap.machine}${files}. Tap to see both.`}
+      aria-label={`Overlaps with ${overlap.machine}`}
+      data-overlap={overlap.strength}
+      onClick={() => claimsUiActions.open([overlap.mineId, overlap.claimId])}
+    >
+      <GitCompareArrows aria-hidden className="h-2.5 w-2.5 shrink-0" />
+      <span className="truncate">Overlaps: {overlap.machine}</span>
+    </StatusPill>
+  );
+}

package/components/Claims/StartClaimsNotice.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import { Notice } from "@/components/ui/notice";
+import type { StartWarning } from "@/lib/claims/startWarning";
+
+// Above the composer when a person's task start overlaps claimed work. They
+// choose: start anyway, queue it behind that work, or go back and edit.
+export function StartClaimsNotice({
+  warnings,
+  busy,
+  onStart,
+  onDismiss,
+}: {
+  warnings: StartWarning[];
+  busy: boolean;
+  onStart: (after?: string) => void;
+  onDismiss: () => void;
+}) {
+  const top = warnings[0];
+  if (!top) return null;
+  const files = top.shared.slice(0, 3).join(", ");
+  return (
+    <Notice
+      tone="warning"
+      action={
+        <div className="flex flex-wrap gap-2">
+          <Button
+            size="sm"
+            variant="outline"
+            className="min-h-11 md:min-h-8"
+            disabled={busy}
+            onClick={() => onStart()}
+          >
+            Start anyway
+          </Button>
+          <Button
+            size="sm"
+            className="min-h-11 md:min-h-8"
+            disabled={busy}
+            onClick={() => onStart(`claim:${top.claim.id}`)}
+          >
+            Start after it
+          </Button>
+          <Button
+            size="sm"
+            variant="ghost"
+            className="min-h-11 md:min-h-8"
+            disabled={busy}
+            onClick={onDismiss}
+          >
+            Edit
+          </Button>
+        </div>
+      }
+    >
+      <p className="font-medium">
+        {top.strength === "strong"
+          ? "Someone is already on this"
+          : "This may overlap"}
+        {warnings.length > 1 ? ` (${warnings.length} claims)` : ""}
+      </p>
+      <p className="text-muted-foreground text-xs break-words">
+        “{top.claim.goal}” on {top.claim.machine}
+        {top.claim.branch ? ` (${top.claim.branch})` : ""}
+        {files ? ` touches ${files}` : ""}
+      </p>
+    </Notice>
+  );
+}

package/components/Claims/claims-ui.test.ts

@@ -0,0 +1,161 @@
+import { createElement } from "react";
+import { renderToStaticMarkup } from "react-dom/server";
+import { beforeEach, describe, expect, it } from "vitest";
+import { claimKeys } from "@/data/claims/keys";
+import { claimsUi, claimsUiActions } from "@/stores/claimsUi";
+import { ClaimFiles } from "./ClaimFiles";
+import { OverlapPill } from "./OverlapPill";
+import { StartClaimsNotice } from "./StartClaimsNotice";
+import { focusView, groupByRepo, lastHeardText, startedText } from "./format";
+import type { Claim } from "@/lib/claims/types";
+
+const overlap = {
+  strength: "strong" as const,
+  machine: "box",
+  goal: "Rework login",
+  shared: 3,
+  claimId: "r-1",
+  mineId: "s-1",
+};
+
+beforeEach(() => claimsUiActions.setOpen(false));
+
+describe("OverlapPill", () => {
+  it("reads Overlaps: <machine>, amber when strong", () => {
+    const html = renderToStaticMarkup(createElement(OverlapPill, { overlap }));
+    expect(html).toContain("Overlaps: box");
+    expect(html).toContain("text-amber-700");
+    expect(html).toContain('data-overlap="strong"');
+  });
+
+  it("is muted when weak", () => {
+    const html = renderToStaticMarkup(
+      createElement(OverlapPill, { overlap: { ...overlap, strength: "weak" } })
+    );
+    expect(html).toContain("text-muted-foreground");
+    expect(html).not.toContain("text-amber-700");
+  });
+
+  it("opens the claims sheet on that pair when tapped", () => {
+    const el = OverlapPill({ overlap }) as { props: { onClick: () => void } };
+    el.props.onClick();
+    expect(claimsUi.open).toBe(true);
+    expect([...(claimsUi.focus ?? [])]).toEqual(["s-1", "r-1"]);
+    claimsUiActions.showAll();
+    expect(claimsUi.focus).toBeNull();
+  });
+});
+
+describe("StartClaimsNotice", () => {
+  const warnings = [
+    {
+      strength: "strong" as const,
+      kinds: ["files" as const],
+      shared: ["a.ts", "b.ts"],
+      claim: {
+        id: "r-1",
+        goal: "Rework login",
+        machine: "box",
+        branch: "feature/login",
+        sessionName: null,
+      },
+    },
+  ];
+  const html = renderToStaticMarkup(
+    createElement(StartClaimsNotice, {
+      warnings,
+      busy: false,
+      onStart: () => {},
+      onDismiss: () => {},
+    })
+  );
+
+  it("names the work and offers both choices", () => {
+    expect(html).toContain("Rework login");
+    expect(html).toContain("on box");
+    expect(html).toContain("a.ts, b.ts");
+    expect(html).toContain("Start anyway");
+    expect(html).toContain("Start after it");
+  });
+
+  it("renders nothing without a warning", () => {
+    expect(
+      renderToStaticMarkup(
+        createElement(StartClaimsNotice, {
+          warnings: [],
+          busy: false,
+          onStart: () => {},
+          onDismiss: () => {},
+        })
+      )
+    ).toBe("");
+  });
+});
+
+describe("claims keys and helpers", () => {
+  it("keys the list by project", () => {
+    expect(claimKeys.list()).toEqual(["claims", "list", ""]);
+    expect(claimKeys.list("p1")).toEqual(["claims", "list", "p1"]);
+    expect(claimKeys.list("p1").slice(0, 1)).toEqual(claimKeys.all);
+  });
+
+  it("words ages and last heard", () => {
+    expect(startedText({ startedAt: 0 }, 12 * 60_000)).toBe("started 12m ago");
+    expect(startedText({ startedAt: 0 }, 5_000)).toBe("just started");
+    expect(lastHeardText(0, 6 * 60_000)).toBe("last heard 6m ago");
+    expect(lastHeardText(null, 0)).toBe("this machine");
+  });
+
+  const c = (id: string, repo: string, startedAt: number) =>
+    ({ id, repo, startedAt, files: [], filesMore: 0 }) as unknown as Claim;
+
+  it("groups by repo, oldest work first", () => {
+    const groups = groupByRepo([
+      c("a", "r2", 5),
+      c("b", "r1", 9),
+      c("c", "r2", 1),
+    ]);
+    expect(groups.map((g) => [g.repo, g.claims.map((x) => x.id)])).toEqual([
+      ["r2", ["c", "a"]],
+      ["r1", ["b"]],
+    ]);
+  });
+
+  it("narrows to one pair", () => {
+    const view = {
+      claims: [c("a", "r", 1), c("b", "r", 2), c("z", "r", 3)],
+      overlaps: [
+        {
+          a: "a",
+          b: "b",
+          kinds: ["files" as const],
+          shared: [],
+          strength: "weak" as const,
+        },
+        {
+          a: "b",
+          b: "z",
+          kinds: ["files" as const],
+          shared: [],
+          strength: "weak" as const,
+        },
+      ],
+    };
+    const f = focusView(view, ["a", "b"]);
+    expect(f.claims.map((x) => x.id)).toEqual(["a", "b"]);
+    expect(f.overlaps).toHaveLength(1);
+    expect(focusView(view, null)).toBe(view);
+  });
+
+  it("marks shared files in a claim's list", () => {
+    const html = renderToStaticMarkup(
+      createElement(ClaimFiles, {
+        files: ["a.ts", "b.ts"],
+        more: 2,
+        shared: new Set(["a.ts"]),
+      })
+    );
+    expect(html).toContain("and 2 more");
+    expect(html.match(/text-amber-700/g)).toHaveLength(1);
+  });
+});

package/components/Claims/format.ts

@@ -0,0 +1,57 @@
+import type { Claim } from "@/lib/claims/types";
+import type { ClaimsView } from "@/lib/claims/view";
+
+const span = (ms: number) => {
+  const mins = Math.floor(Math.max(0, ms) / 60_000);
+  if (mins < 1) return "under a minute";
+  if (mins < 60) return `${mins}m`;
+  if (mins < 24 * 60) return `${Math.floor(mins / 60)}h`;
+  return `${Math.floor(mins / (24 * 60))}d`;
+};
+
+/** "started 12m ago". */
+export const startedText = (c: Pick<Claim, "startedAt">, now: number) => {
+  const s = span(now - c.startedAt);
+  return s === "under a minute" ? "just started" : `started ${s} ago`;
+};
+
+/** "last heard 6m ago". */
+export const lastHeardText = (at: number | null, now: number) => {
+  if (at === null) return "this machine";
+  const s = span(now - at);
+  return s === "under a minute" ? "heard just now" : `last heard ${s} ago`;
+};
+
+/** A machine not heard from for this long is shown as quiet. */
+export const QUIET_MS = 3 * 60_000;
+
+export interface RepoGroup {
+  repo: string;
+  claims: Claim[];
+}
+
+/** Claims by repository, the repository with the oldest work first. */
+export function groupByRepo(claims: Claim[]): RepoGroup[] {
+  const byRepo = new Map<string, Claim[]>();
+  for (const c of claims)
+    byRepo.set(c.repo, [...(byRepo.get(c.repo) ?? []), c]);
+  return [...byRepo]
+    .map(([repo, list]) => ({
+      repo,
+      claims: [...list].sort((a, b) => a.startedAt - b.startedAt),
+    }))
+    .sort((a, b) => a.claims[0].startedAt - b.claims[0].startedAt);
+}
+
+/** The claims and overlaps of one pair, or everything when no pair is set. */
+export function focusView(
+  view: Pick<ClaimsView, "claims" | "overlaps">,
+  focus: string[] | null
+) {
+  if (!focus) return view;
+  const ids = new Set(focus);
+  return {
+    claims: view.claims.filter((c) => ids.has(c.id)),
+    overlaps: view.overlaps.filter((o) => ids.has(o.a) && ids.has(o.b)),
+  };
+}

package/components/Claims/index.ts

@@ -0,0 +1,3 @@
+export { ClaimsSheet } from "./ClaimsSheet";
+export { OverlapPill } from "./OverlapPill";
+export { StartClaimsNotice } from "./StartClaimsNotice";

package/components/Draft/DraftPanel.tsx

@@ -15,6 +15,9 @@ import { useGitCheck } from "@/data/git/queries";
 import { useSelectedWorkspace } from "@/hooks/useSelectedWorkspace";
 import { useLaunchSession } from "@/data/sessions";
 import { useCreateTask } from "@/data/tasks";
+import { useCheckStart } from "@/data/claims";
+import { StartClaimsNotice } from "@/components/Claims";
+import type { StartWarning } from "@/lib/claims/startWarning";
 import { usePanes } from "@/contexts/PaneContext";
 import { setPendingPrompt } from "@/stores/initialPrompt";
 import { draftsActions, draftsStore, newDraft } from "@/stores/drafts";
@@ -53,8 +56,15 @@ export function DraftPanel({
   const launch = useLaunchSession();
   const { workspace } = useSelectedWorkspace();
   const createTask = useCreateTask();
+  const checkStart = useCheckStart();
   const [prefill, setPrefill] = useState<{ text: string; at: number }>();
-  const pending = launch.isPending || createTask.isPending;
+  // A task start that overlaps claimed work waits here for the person's choice.
+  const [held, setHeld] = useState<{
+    text: string;
+    warnings: StartWarning[];
+  } | null>(null);
+  const pending =
+    launch.isPending || createTask.isPending || checkStart.isPending;
 
   if (!hydrated) return null;
   if (!draft)
@@ -67,15 +77,32 @@ export function DraftPanel({
       </div>
     );
 
-  const send = async (text: string, images: ChatImage[], files: ChatFile[]) => {
+  const send = async (
+    text: string,
+    images: ChatImage[],
+    files: ChatFile[],
+    claim?: { after?: string }
+  ) => {
     try {
       if (draft.openPr) {
         if (!project) throw new Error("Pick a project for a task");
         if (images.length || files.length)
           throw new Error("A task takes text only");
+        if (!claim && draft.hostId === project.host_id) {
+          const warnings = await checkStart.mutateAsync({
+            projectId: project.id,
+            prompt: text,
+          });
+          if (warnings.length) {
+            setHeld({ text, warnings });
+            return;
+          }
+        }
+        setHeld(null);
         const { session, queued } = await createTask.mutateAsync({
           projectId: project.id,
           prompt: text,
+          after: claim?.after,
           model: draft.taskModel ?? undefined,
           priority: draft.taskPriority,
           baseBranch: draft.baseBranch ?? undefined,
@@ -145,6 +172,17 @@ export function DraftPanel({
           git={git}
           onChange={(patch) => draftsActions.update(draft.id, patch)}
         />
+        {held && (
+          <StartClaimsNotice
+            warnings={held.warnings}
+            busy={pending}
+            onStart={(after) => void send(held.text, [], [], { after })}
+            onDismiss={() => {
+              setPrefill({ text: held.text, at: Date.now() });
+              setHeld(null);
+            }}
+          />
+        )}
         <Composer
           draftKey={draftComposerKey(draft.id)}
           attachScope="draft"