@saadnvd1/agent-os 0.3.608 → 0.3.610

package/components/ui/dropdown-menu.tsx

@@ -34,6 +34,7 @@ function DropdownMenuTrigger({
 function DropdownMenuContent({
   className,
   sideOffset = 4,
+  collisionPadding = 8,
   ...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {
   return (
@@ -41,8 +42,9 @@ function DropdownMenuContent({
       <DropdownMenuPrimitive.Content
         data-slot="dropdown-menu-content"
         sideOffset={sideOffset}
+        collisionPadding={collisionPadding}
         className={cn(
-          "popover-surface text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-xl p-1.5",
+          "popover-surface text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto overscroll-contain rounded-xl p-1.5",
           className
         )}
         {...props}
@@ -229,8 +231,9 @@ function DropdownMenuSubContent({
   return (
     <DropdownMenuPrimitive.SubContent
       data-slot="dropdown-menu-sub-content"
+      collisionPadding={8}
       className={cn(
-        "popover-surface text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-xl p-1.5",
+        "popover-surface text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto overscroll-contain rounded-xl p-1.5",
         className
       )}
       {...props}

package/components/ui/menu-fit.test.ts

@@ -0,0 +1,36 @@
+import { readFileSync } from "node:fs";
+import { describe, expect, it } from "vitest";
+
+// Where a menu opens (flip, shift, the 8px gap) is floating-ui's job inside
+// Radix, and Radix can't mount in the suite's fake DOM. What is ours is that
+// every menu surface hands its height to the room left on screen and scrolls
+// past it instead of clipping, so that is what this pins. The geometry itself
+// is checked in a browser.
+const surfaces = (file: string) =>
+  readFileSync(new URL(file, import.meta.url), "utf8")
+    .split("\n")
+    .filter((l) => l.includes("popover-surface"));
+
+describe.each([
+  ["./dropdown-menu.tsx", "dropdown-menu"],
+  ["./context-menu.tsx", "context-menu"],
+])("%s", (file, name) => {
+  const lines = surfaces(file);
+
+  it("has a menu and a submenu surface", () => {
+    expect(lines).toHaveLength(2);
+  });
+
+  it.each([0, 1])("caps surface %i to the space available and scrolls", (i) => {
+    expect(lines[i]).toContain(
+      `max-h-(--radix-${name}-content-available-height)`
+    );
+    expect(lines[i]).toContain("overflow-y-auto");
+    expect(lines[i]).not.toContain("overflow-hidden");
+  });
+
+  it("keeps menus off the window edge", () => {
+    const src = readFileSync(new URL(file, import.meta.url), "utf8");
+    expect(src.match(/collisionPadding/g)?.length).toBeGreaterThanOrEqual(2);
+  });
+});

package/hooks/useCompactMenu.ts

@@ -0,0 +1,9 @@
+"use client";
+
+import { useMediaQuery } from "./useMediaQuery";
+
+// A phone or a touch screen: menus use one scrolling list with sections that
+// open in place, not flyouts a finger can't hold open.
+export function useCompactMenu(): boolean {
+  return useMediaQuery("(max-width: 767px), (pointer: coarse)");
+}

package/hooks/useMediaQuery.ts

@@ -0,0 +1,20 @@
+"use client";
+
+import { useSyncExternalStore } from "react";
+
+const supported = () =>
+  typeof window !== "undefined" && typeof window.matchMedia === "function";
+
+// Whether a CSS media query matches now, and stays in step as it changes.
+export function useMediaQuery(query: string): boolean {
+  return useSyncExternalStore(
+    (listener) => {
+      if (!supported()) return () => {};
+      const mq = window.matchMedia(query);
+      mq.addEventListener("change", listener);
+      return () => mq.removeEventListener("change", listener);
+    },
+    () => supported() && window.matchMedia(query).matches,
+    () => false
+  );
+}

package/lib/hosts/remote-menu.ts

@@ -13,6 +13,10 @@ export const REMOTE_UNSUPPORTED = {
   schedule: (host: string) => `Check-ins can't message ${host} yet`,
 };
 
+// The one line that replaces the hidden items.
+export const remoteNote = (host: string) =>
+  `Runs on ${host}: fork, fresh start, project moves and check-ins happen there`;
+
 export type RemoteAction = keyof typeof REMOTE_UNSUPPORTED;
 
 /**

package/lib/load/alert.ts

@@ -18,9 +18,14 @@ export function alertText(view: LoadView): string {
       : "";
     return `${s.name} ${s.cores.toFixed(1)} cores, ${gb(s.rssBytes)}${heavy}`;
   });
+  const others = (view.unattributed ?? []).map(
+    (g) =>
+      `${g.name}${g.count > 1 ? ` ×${g.count}` : ""} ${g.cores.toFixed(1)} cores, ${gb(g.rssBytes)}`
+  );
   return [
     `Machine load red for 2+ minutes: ${view.load1} on ${view.cores} cores${memory}.`,
     top.length ? `Top: ${top.join("; ")}.` : "",
+    others.length ? `Not from a session: ${others.join("; ")}.` : "",
   ]
     .filter(Boolean)
     .join(" ");

package/lib/load/attribute.ts

@@ -0,0 +1,217 @@
+// Who is using the machine: every process goes to the session whose tree it
+// is in, or, for a heavy one that left its tree (a build daemon reparented to
+// init), to the session whose worktree it runs in. What's left is grouped by
+// name so the orchestrator can tell its tasks from everything else.
+import { execFile } from "child_process";
+import { existsSync } from "fs";
+import { readlink } from "fs/promises";
+import path from "path";
+import type { ProcRow } from "../process-table";
+import { workerTmuxName } from "../chat/worker/protocol";
+import { claimTrees, type Usage } from "./usage";
+
+// A row shows its usage, and a group is listed, from here up.
+export const BUSY_CORES = 0.5;
+const HOT_PCPU = 20;
+const MAX_LOOKUPS = 40;
+const MAX_HOT = 20;
+const MAX_GROUPS = 3;
+const BIG_RSS = 2 ** 30;
+
+export interface SessionLoad extends Usage {
+  sessionId: string;
+  name: string;
+  heavy: string[];
+}
+
+export interface ProcGroup {
+  name: string;
+  count: number;
+  cores: number;
+  rssBytes: number;
+}
+
+export interface SessionRow {
+  id: string;
+  name: string;
+  tmux_name: string;
+  worktree_path: string | null;
+  working_directory: string;
+}
+
+const round1 = (n: number) => Math.round(n * 10) / 10;
+const baseName = (comm: string) =>
+  comm.split("/").pop()?.replace(/^-/, "") || comm;
+
+// Each session's own tmux session, plus its chat worker's.
+export function claimSessions(
+  procs: ProcRow[],
+  panes: { tmux: string; pid: number }[],
+  rows: SessionRow[]
+): Map<number, string> {
+  const roots: { key: string; pid: number }[] = [];
+  for (const row of rows)
+    for (const p of panes)
+      if (p.tmux === row.tmux_name || p.tmux === workerTmuxName(row.id))
+        roots.push({ key: row.id, pid: p.pid });
+  return claimTrees(procs, roots);
+}
+
+// The directories a process's cwd can place it by, longest first. The
+// worktree when there is one; otherwise the working directory, but only when
+// it is specific to the session.
+export function sessionPaths(
+  rows: SessionRow[],
+  home: string
+): { sessionId: string; path: string }[] {
+  const count = new Map<string, number>();
+  for (const r of rows)
+    count.set(r.working_directory, (count.get(r.working_directory) ?? 0) + 1);
+  const out: { sessionId: string; path: string }[] = [];
+  for (const r of rows) {
+    let dir = r.worktree_path;
+    if (!dir) {
+      dir = r.working_directory.replace(/^~(?=$|\/)/, home);
+      if (
+        !path.isAbsolute(dir) ||
+        dir === "/" ||
+        dir === home ||
+        count.get(r.working_directory)! > 1
+      )
+        continue;
+    }
+    out.push({ sessionId: r.id, path: dir.replace(/\/+$/, "") });
+  }
+  return out.sort((a, b) => b.path.length - a.path.length);
+}
+
+export function matchSession(
+  cwd: string,
+  paths: { sessionId: string; path: string }[]
+): string | null {
+  const hit = paths.find((p) => cwd === p.path || cwd.startsWith(p.path + "/"));
+  return hit?.sessionId ?? null;
+}
+
+// The heavy processes no session owns, and their unowned ancestors (the
+// daemon that spawned the workers), whose cwd is worth looking up.
+export function cwdCandidates(
+  procs: ProcRow[],
+  owner: Map<number, string>
+): number[] {
+  const byPid = new Map(procs.map((p) => [p.pid, p]));
+  const hot = procs
+    .filter((p) => !owner.has(p.pid) && p.pcpu >= HOT_PCPU)
+    .sort((a, b) => b.pcpu - a.pcpu)
+    .slice(0, MAX_HOT);
+  const out = new Set<number>();
+  for (const p of hot) {
+    let at: ProcRow | undefined = p;
+    while (at && at.pid > 1 && !owner.has(at.pid) && out.size < MAX_LOOKUPS) {
+      out.add(at.pid);
+      at = byPid.get(at.ppid);
+    }
+  }
+  return [...out];
+}
+
+// `lsof -a -d cwd -Fpn`: a `p<pid>` line, then `n<path>` for its cwd.
+export function parseLsofCwd(out: string): Map<number, string> {
+  const cwds = new Map<number, string>();
+  let pid = 0;
+  for (const line of out.split("\n")) {
+    if (line.startsWith("p")) pid = Number(line.slice(1)) || 0;
+    else if (line.startsWith("n") && pid) cwds.set(pid, line.slice(1));
+  }
+  return cwds;
+}
+
+const LSOF = ["/usr/sbin/lsof", "/usr/bin/lsof"].find((p) => existsSync(p));
+
+export async function readCwds(pids: number[]): Promise<Map<number, string>> {
+  const cwds = new Map<number, string>();
+  if (!pids.length) return cwds;
+  if (process.platform === "linux") {
+    await Promise.all(
+      pids.map((pid) =>
+        readlink(`/proc/${pid}/cwd`).then(
+          (dir) => void cwds.set(pid, dir),
+          () => undefined
+        )
+      )
+    );
+    return cwds;
+  }
+  return new Promise((resolve) =>
+    execFile(
+      LSOF ?? "lsof",
+      ["-a", "-d", "cwd", "-Fpn", "-p", pids.join(",")],
+      { timeout: 2000, maxBuffer: 1 << 20 },
+      // lsof exits 1 when some pids are gone but still prints the rest.
+      (_err, stdout) => resolve(parseLsofCwd(stdout ?? ""))
+    )
+  );
+}
+
+export function attributeLoad(input: {
+  procs: ProcRow[];
+  owner: Map<number, string>;
+  rows: SessionRow[];
+  cwds: Map<number, string>;
+  home: string;
+}): { sessions: Record<string, SessionLoad>; unattributed: ProcGroup[] } {
+  const { procs, owner, rows, cwds, home } = input;
+  const byPid = new Map(procs.map((p) => [p.pid, p]));
+  const paths = sessionPaths(rows, home);
+  // Memoised: the session an unowned process belongs to, by its own cwd or
+  // its nearest unowned ancestor's.
+  const placed = new Map<number, string | null>();
+  const place = (p: ProcRow, depth = 0): string | null => {
+    if (placed.has(p.pid)) return placed.get(p.pid)!;
+    const cwd = cwds.get(p.pid);
+    let id = cwd ? matchSession(cwd, paths) : null;
+    const parent = byPid.get(p.ppid);
+    if (!id && parent && parent.pid > 1 && depth < 64 && !owner.has(parent.pid))
+      id = place(parent, depth + 1);
+    placed.set(p.pid, id);
+    return id;
+  };
+
+  const raw = new Map<string, Usage>();
+  const groups = new Map<string, ProcGroup>();
+  for (const p of procs) {
+    const id = owner.get(p.pid) ?? place(p);
+    if (id) {
+      const u = raw.get(id) ?? { cores: 0, rssBytes: 0 };
+      u.cores += p.pcpu / 100;
+      u.rssBytes += p.rss * 1024;
+      raw.set(id, u);
+      continue;
+    }
+    const name = baseName(p.comm);
+    const g = groups.get(name) ?? { name, count: 0, cores: 0, rssBytes: 0 };
+    g.count++;
+    g.cores += p.pcpu / 100;
+    g.rssBytes += p.rss * 1024;
+    groups.set(name, g);
+  }
+
+  const sessions: Record<string, SessionLoad> = {};
+  for (const row of rows) {
+    const u = raw.get(row.id);
+    if (!u) continue;
+    sessions[row.id] = {
+      sessionId: row.id,
+      name: row.name,
+      cores: round1(u.cores),
+      rssBytes: u.rssBytes,
+      heavy: [],
+    };
+  }
+  const unattributed = [...groups.values()]
+    .filter((g) => g.cores >= BUSY_CORES || g.rssBytes >= BIG_RSS)
+    .sort((a, b) => b.cores - a.cores)
+    .slice(0, MAX_GROUPS)
+    .map((g) => ({ ...g, cores: round1(g.cores) }));
+  return { sessions, unattributed };
+}

package/lib/load/monitor.ts

@@ -9,21 +9,24 @@ import { LoadAlarm } from "./alarm";
 import { HeavyRegistry, type HeavyRun } from "./heavy";
 import { nextLevel, type LoadLevel, type Pressure } from "./level";
 import { readPressure } from "./pressure";
-import { readUsage, type Usage } from "./usage";
-import { workerTmuxName } from "../chat/worker/protocol";
+import type { Usage } from "./usage";
+import { readSnapshot } from "./usage";
+import {
+  attributeLoad,
+  BUSY_CORES,
+  claimSessions,
+  cwdCandidates,
+  readCwds,
+  type ProcGroup,
+  type SessionLoad,
+  type SessionRow,
+} from "./attribute";
 import { alertText, raiseAlert } from "./alert";
 import { LOCAL, feedGate, gateOpen } from "./start-gate";
 
 export const SAMPLE_MS = 10_000;
 export const USAGE_MS = 30_000;
-// A row shows its usage from here up.
-const BUSY_CORES = 0.5;
-
-export interface SessionLoad extends Usage {
-  sessionId: string;
-  name: string;
-  heavy: string[];
-}
+export type { SessionLoad, ProcGroup };
 
 export interface LoadView {
   level: LoadLevel;
@@ -32,6 +35,8 @@ export interface LoadView {
   memUsedPct: number;
   pressure: Pressure;
   top: SessionLoad[];
+  // Heavy processes that belong to no session, grouped by name.
+  unattributed: ProcGroup[];
   sessions: Record<string, Usage>;
 }
 
@@ -39,6 +44,7 @@ interface State {
   level: LoadLevel | null;
   view: LoadView | null;
   usage: Record<string, SessionLoad>;
+  unattributed: ProcGroup[];
   registry: HeavyRegistry;
   alarm: LoadAlarm;
   timers: ReturnType<typeof setInterval>[];
@@ -50,6 +56,7 @@ const state: State = (g.__agentosLoad ??= {
   level: null,
   view: null,
   usage: {},
+  unattributed: [],
   registry: new HeavyRegistry(),
   alarm: new LoadAlarm(),
   timers: [],
@@ -107,6 +114,7 @@ async function sample(): Promise<void> {
     memUsedPct: Math.round(((total - os.freemem()) / total) * 100),
     pressure,
     top: topSessions(),
+    unattributed: state.unattributed,
     sessions,
   };
   state.view = view;
@@ -145,39 +153,24 @@ export function loadAlarmFromDb(): void {
   state.alarm = new LoadAlarm(readArmed());
 }
 
-type UsageRow = { id: string; name: string; tmux_name: string };
-
-// Each session's share of the usage: its own tmux session's, plus its chat
-// worker's, where a chat's agent runs.
-export function sessionUsage(
-  byTmux: Record<string, Usage>,
-  rows: UsageRow[]
-): Record<string, SessionLoad> {
-  const usage: Record<string, SessionLoad> = {};
-  for (const row of rows) {
-    const parts = [byTmux[row.tmux_name], byTmux[workerTmuxName(row.id)]];
-    const found = parts.filter((u): u is Usage => !!u);
-    if (!found.length) continue;
-    const cores = found.reduce((n, u) => n + u.cores, 0);
-    usage[row.id] = {
-      sessionId: row.id,
-      name: row.name,
-      cores: Math.round(cores * 10) / 10,
-      rssBytes: found.reduce((n, u) => n + u.rssBytes, 0),
-      heavy: [],
-    };
-  }
-  return usage;
-}
-
 async function sampleUsage(): Promise<void> {
-  const byTmux = await readUsage();
+  const { procs, panes } = await readSnapshot();
   const rows = db
     .prepare(
-      `SELECT id, name, tmux_name FROM sessions WHERE archived_at IS NULL AND host_id = 'local'`
+      `SELECT id, name, tmux_name, worktree_path, working_directory FROM sessions WHERE archived_at IS NULL AND host_id = 'local'`
     )
-    .all() as UsageRow[];
-  state.usage = sessionUsage(byTmux, rows);
+    .all() as SessionRow[];
+  const owner = claimSessions(procs, panes, rows);
+  const cwds = await readCwds(cwdCandidates(procs, owner));
+  const { sessions, unattributed } = attributeLoad({
+    procs,
+    owner,
+    rows,
+    cwds,
+    home: os.homedir(),
+  });
+  state.usage = sessions;
+  state.unattributed = unattributed;
 }
 
 // Off the hot path: each tick is async, never overlaps the last, and logs

package/lib/load/usage.ts

@@ -1,7 +1,8 @@
 // What each session's processes use: one `ps` for the whole machine and one
-// `tmux list-panes`, then each pane's process tree summed. Never a call per
+// `tmux list-panes`, then each pane's process tree walked. Never a call per
 // session.
 import { execFile } from "child_process";
+import type { ProcRow } from "../process-table";
 
 export interface Proc {
   pid: number;
@@ -37,36 +38,45 @@ export function parsePanes(out: string): { tmux: string; pid: number }[] {
     .map(([tmux, pid]) => ({ tmux, pid: Number(pid) }));
 }
 
-// Each key's panes and everything under them. A process is counted once,
-// for the first key that reaches it.
-export function sumTrees(
+// The key that owns each process: its panes and everything under them. A
+// process goes to the first key that reaches it.
+export function claimTrees(
   procs: Proc[],
   roots: { key: string; pid: number }[]
-): Record<string, Usage> {
-  const byPid = new Map(procs.map((p) => [p.pid, p]));
+): Map<number, string> {
   const children = new Map<number, number[]>();
   for (const p of procs) {
     const list = children.get(p.ppid);
     if (list) list.push(p.pid);
     else children.set(p.ppid, [p.pid]);
   }
-  const seen = new Set<number>();
-  const out: Record<string, Usage> = {};
+  const owner = new Map<number, string>();
   for (const { key, pid } of roots) {
-    const usage = (out[key] ??= { cores: 0, rssBytes: 0 });
     const stack = [pid];
     while (stack.length) {
       const at = stack.pop()!;
-      if (seen.has(at)) continue;
-      seen.add(at);
-      const p = byPid.get(at);
-      if (p) {
-        usage.cores += p.pcpu / 100;
-        usage.rssBytes += p.rss * 1024;
-      }
+      if (owner.has(at)) continue;
+      owner.set(at, key);
       stack.push(...(children.get(at) ?? []));
     }
   }
+  return owner;
+}
+
+// Each key's panes and everything under them, summed.
+export function sumTrees(
+  procs: Proc[],
+  roots: { key: string; pid: number }[]
+): Record<string, Usage> {
+  const byPid = new Map(procs.map((p) => [p.pid, p]));
+  const out: Record<string, Usage> = {};
+  for (const { key } of roots) out[key] ??= { cores: 0, rssBytes: 0 };
+  for (const [pid, key] of claimTrees(procs, roots)) {
+    const p = byPid.get(pid);
+    if (!p) continue;
+    out[key].cores += p.pcpu / 100;
+    out[key].rssBytes += p.rss * 1024;
+  }
   return out;
 }
 
@@ -77,11 +87,13 @@ const run = (cmd: string, args: string[], timeout: number) =>
     )
   );
 
-// Usage by tmux session name. Empty when ps or tmux can't be read. The
-// process table is the one shared with the rest of the server.
-export async function readUsage(
-  timeoutMs = 3000
-): Promise<Record<string, Usage>> {
+// The process table and the tmux panes, for attributing load to sessions.
+// Empty when ps or tmux can't be read. The table is the one shared with the
+// rest of the server.
+export async function readSnapshot(timeoutMs = 3000): Promise<{
+  procs: ProcRow[];
+  panes: { tmux: string; pid: number }[];
+}> {
   const { processTable } = await import("../process-table");
   const [procs, panes] = await Promise.all([
     processTable(),
@@ -91,8 +103,5 @@ export async function readUsage(
       timeoutMs
     ),
   ]);
-  return sumTrees(
-    procs ?? [],
-    parsePanes(panes).map((p) => ({ key: p.tmux, pid: p.pid }))
-  );
+  return { procs: procs ?? [], panes: parsePanes(panes) };
 }