@saadnvd1/agent-os 0.3.845 → 0.3.848

package/components/Updates/AutoUpdates.tsx

@@ -2,7 +2,8 @@
 
 import { toast } from "sonner";
 import { CheckCircle2, CircleAlert, RotateCcw } from "lucide-react";
-import { SettingToggle } from "@/components/Settings/SettingToggle";
+import { SwitchSetting } from "@/components/Settings/settings-fields";
+import { SettingSection } from "@/components/Settings/SettingRow";
 import {
   Select,
   SelectContent,
@@ -80,13 +81,16 @@ export function AutoUpdates({ auto }: { auto: AutoUpdateView }) {
   const onError = (e: Error) => toast.error(e.message);
   return (
     <div className="space-y-3">
-      <SettingToggle
-        title="Install updates automatically"
-        detail="Once everything has been idle for a while. Terminals and chats keep running through the restart, and a version that doesn't start cleanly is rolled back."
-        checked={auto.enabled}
-        locked={auto.locked}
-        onChange={(on) => save.mutate({ auto: on }, { onError })}
-      />
+      <SettingSection>
+        <SwitchSetting
+          id="auto-update"
+          label="Install updates automatically"
+          help="Once everything has been idle for a while. Terminals and chats keep running through the restart, and a version that doesn't start cleanly is rolled back."
+          checked={auto.enabled}
+          locked={auto.locked}
+          onSave={(on) => save.mutateAsync({ auto: on })}
+        />
+      </SettingSection>
       {auto.enabled && (
         <div className="flex flex-wrap items-center justify-between gap-2 px-3">
           <label htmlFor="auto-idle" className="text-sm">

package/components/Updates/UpdatesSection.tsx

@@ -3,7 +3,8 @@
 import { toast } from "sonner";
 import { Loader2 } from "lucide-react";
 import { Button } from "@/components/ui/button";
-import { SettingToggle } from "@/components/Settings/SettingToggle";
+import { SwitchSetting } from "@/components/Settings/settings-fields";
+import { SettingSection } from "@/components/Settings/SettingRow";
 import { useSetTipsOff, useTips } from "@/data/tips";
 import {
   useCheckForUpdates,
@@ -141,16 +142,17 @@ export function UpdatesSection() {
 
       {view.auto && <AutoUpdates auto={view.auto} />}
 
-      <SettingToggle
-        title="Show update banner"
-        detail="Tell everyone using this AgentOS when a newer version is out, and when it updated itself."
-        checked={view.bannerEnabled}
-        locked={view.bannerLocked}
-        onChange={(on) =>
-          banner.mutate(on, { onError: (e) => toast.error(e.message) })
-        }
-      />
-      <TipsToggle />
+      <SettingSection>
+        <SwitchSetting
+          id="update-banner"
+          label="Show update banner"
+          help="Tell everyone using this AgentOS when a newer version is out, and when it updated itself."
+          checked={view.bannerEnabled}
+          locked={view.bannerLocked}
+          onSave={(on) => banner.mutateAsync(on)}
+        />
+        <TipsToggle />
+      </SettingSection>
     </div>
   );
 }
@@ -159,13 +161,12 @@ function TipsToggle() {
   const { data } = useTips();
   const setOff = useSetTipsOff();
   return (
-    <SettingToggle
-      title="Show Tip of the Day"
-      detail="A short tip about something AgentOS can do, behind the lightbulb in the sidebar. It never opens on its own."
+    <SwitchSetting
+      id="tips"
+      label="Show Tip of the Day"
+      help="A short tip about something AgentOS can do, behind the lightbulb in the sidebar. It never opens on its own."
       checked={!!data && !data.off}
-      onChange={(on) =>
-        setOff.mutate(!on, { onError: (e) => toast.error(e.message) })
-      }
+      onSave={(on) => setOff.mutateAsync(!on)}
     />
   );
 }

package/components/Workspaces/WorkspaceSettings.test.ts

@@ -124,19 +124,19 @@ describe("WorkspaceSettings", () => {
     await render();
     expect(limit().id).toBe("task-limit-w1");
     expect(limit().disabled).toBe(true);
-    expect(limit().value).toBe("3");
-    expect(host.textContent).not.toContain("Default");
+    expect(limit().value).toBe("");
+    expect(limit().placeholder).toBe("Off");
+    expect(host.textContent).not.toContain("Reset");
   });
 
-  it("enables the number when a limit is set, and hints the default", async () => {
+  it("enables the number when a limit is set, and offers Reset to off", async () => {
     localStorage.setItem("agentOS-settings-workspace", "w2");
     await render();
     expect(limit().disabled).toBe(false);
     expect(limit().value).toBe("2");
-    expect(host.textContent).toContain("Default: off");
     expect(
       [...host.querySelectorAll("button")].some(
-        (b) => b.textContent === "Reset"
+        (b) => b.textContent === "Reset to off"
       )
     ).toBe(true);
   });

package/components/Workspaces/WorkspaceSettings.tsx

@@ -4,7 +4,6 @@ import { useContext, useState } from "react";
 import { settingsUiActions } from "@/stores/settingsUi";
 import { useWorkspacesQuery } from "@/data/workspaces";
 import { useProjectsQuery } from "@/data/projects";
-import { AppWideLimits } from "@/components/Settings/AppWideLimits";
 import {
   matchesQuery,
   SettingsQueryContext,
@@ -69,7 +68,6 @@ export function WorkspaceSettings() {
         }}
       />
       <WorkspacePanel key={shown.id} workspace={shown} />
-      <AppWideLimits />
       <p className="text-muted-foreground text-sm">
         Fresh starts and compaction are app-wide:{" "}
         <button

package/components/ui/switch.tsx

@@ -13,7 +13,7 @@ function Switch({
     <SwitchPrimitive.Root
       data-slot="switch"
       className={cn(
-        "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+        "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-muted-foreground/35 data-[state=unchecked]:border-foreground/15 focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-muted-foreground/40 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
         className
       )}
       {...props}

package/content/whats-new.json

@@ -2009,6 +2009,22 @@
       "area": "Sidebar",
       "text": "Renaming a session for the first time no longer closes the name box before you can type.",
       "url": "https://github.com/saadnvd1/agent-os/pull/568"
+    },
+    {
+      "id": 569,
+      "date": "2026-11-02",
+      "kind": "fixed",
+      "area": "Chat",
+      "text": "Pressing Enter with a selection that ends on a reply's button row no longer quotes it.",
+      "url": "https://github.com/saadnvd1/agent-os/pull/569"
+    },
+    {
+      "id": 570,
+      "date": "2026-11-02",
+      "kind": "improved",
+      "area": "Settings",
+      "text": "Settings is tidier: clearer switches, shorter lists, one Approvals page, and a General page for your name and alerts.",
+      "url": "https://github.com/saadnvd1/agent-os/pull/570"
     }
   ]
 }

package/data/approvals/index.ts

@@ -1,11 +1,11 @@
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import type { AuditRow } from "@/lib/approvals/no-approvals";
+import type { ApprovalLine } from "@/lib/approvals/describe";
 import { provePresence } from "../presence";
 import { usePollWhenOffline } from "../push/connection";
 
 export interface ApprovalsMode {
   on: boolean;
-  audit: AuditRow[];
+  audit: ApprovalLine[];
 }
 
 export const approvalsKeys = { all: ["approvals"] as const };

package/data/health/index.ts

@@ -91,10 +91,13 @@ export function useDeleteNote() {
   });
 }
 
+import type { HealthMeta } from "@/lib/health/config";
+
 export interface ConfigResponse {
   config: Record<string, number>;
   defaults: Record<string, number>;
   labels: Record<string, string>;
+  meta: Record<string, HealthMeta>;
 }
 
 export function useHealthConfig() {

package/hooks/useAutoSave.ts

@@ -2,6 +2,7 @@
 
 import { useCallback, useEffect, useRef, useState } from "react";
 import { toast } from "sonner";
+import { settingsUi } from "@/stores/settingsUi";
 
 export type SaveStatus = "idle" | "saving" | "saved" | "undo";
 
@@ -13,6 +14,9 @@ export interface AutoSave<T> {
   // rejected save drops the in-flight value, so this is the saved one again.
   value: T;
   status: SaveStatus;
+  // Why the last save was rejected; cleared by the next commit. Shown on the
+  // row while Settings is open (a toast would sit over the dialog).
+  error: string | null;
   // Commit a new value. `undoable` keeps the previous one for Undo (large or
   // destructive changes). Resolves false when the server rejected it.
   commit: (next: T, opts?: { undoable?: boolean }) => Promise<boolean>;
@@ -27,7 +31,7 @@ export function useAutoSave<T>({
   saved,
   save,
   equals = Object.is,
-  notify = (message) => toast.error(message),
+  notify,
 }: {
   saved: T;
   save: (next: T) => Promise<unknown>;
@@ -36,6 +40,7 @@ export function useAutoSave<T>({
 }): AutoSave<T> {
   const [pending, setPending] = useState<{ value: T } | null>(null);
   const [status, setStatus] = useState<SaveStatus>("idle");
+  const [error, setError] = useState<string | null>(null);
   const previous = useRef<{ value: T } | null>(null);
   const timer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
   const seq = useRef(0);
@@ -56,6 +61,7 @@ export function useAutoSave<T>({
       const mine = ++seq.current;
       clearTimeout(timer.current);
       setPending({ value: next });
+      setError(null);
       setStatus("saving");
       try {
         await latest.current.save(next);
@@ -64,9 +70,10 @@ export function useAutoSave<T>({
           setPending(null);
           setStatus("idle");
         }
-        latest.current.notify(
-          err instanceof Error ? err.message : "Couldn't save"
-        );
+        const message = err instanceof Error ? err.message : "Couldn't save";
+        if (latest.current.notify) latest.current.notify(message);
+        else if (settingsUi.open) setError(message);
+        else toast.error(message);
         return false;
       }
       if (mine !== seq.current) return true;
@@ -94,5 +101,11 @@ export function useAutoSave<T>({
     return run(back.value, false, latest.current.saved);
   }, [run]);
 
-  return { value: pending ? pending.value : saved, status, commit, undo };
+  return {
+    value: pending ? pending.value : saved,
+    status,
+    error,
+    commit,
+    undo,
+  };
 }

package/hooks/useSettingsUrl.ts

@@ -19,8 +19,7 @@ function fromAddress() {
  */
 export function useSettingsUrl() {
   useEffect(() => {
-    fromAddress();
-    const unsubscribe = subscribe(settingsUi, () => {
+    const toAddress = () => {
       const href = window.location.href;
       const next = hrefWithSettings(href, {
         open: settingsUi.open,
@@ -29,7 +28,11 @@ export function useSettingsUrl() {
       const url = new URL(href);
       if (next !== url.pathname + url.search + url.hash)
         window.history.replaceState(window.history.state, "", next);
-    });
+    };
+    fromAddress();
+    // An old link (?settings=setup) is rewritten to where it landed.
+    toAddress();
+    const unsubscribe = subscribe(settingsUi, toAddress);
     window.addEventListener("popstate", fromAddress);
     return () => {
       unsubscribe();

package/lib/approvals/describe.ts

@@ -0,0 +1,64 @@
+// What an auto-approval reads as to a person: a sentence, with the command
+// or other raw text behind a "details" toggle. The audit table keeps the raw
+// subject; this is only how it is shown.
+
+import type { AuditRow } from "./no-approvals";
+
+export interface ApprovalLine {
+  id: number;
+  at: string;
+  // The source in words ("an ask", "a chat").
+  where: string;
+  summary: string;
+  // Raw text (a shell command, a path) for the details toggle.
+  details: string | null;
+}
+
+const WHERE: Record<AuditRow["source"], string> = {
+  ask: "An ask",
+  brake: "A brake",
+  plan: "A plan",
+  chat: "A chat",
+  terminal: "A terminal",
+  "merge-approval": "A merge",
+  mode: "The mode",
+};
+
+const READ = new Set(["Read", "Glob", "Grep", "LS"]);
+const CHANGE = new Set(["Edit", "Write", "MultiEdit", "NotebookEdit"]);
+
+const SHELL_START = /^(bash|run|shell|execute|command)\b[:\s]/i;
+const SHELL_WORDS =
+  /(^|\s)(cd|ssh|scp|git|npm|npx|pnpm|rm|curl|sudo|cat|ls|sed|grep|kill|tmux|docker|kubectl|python3?|node)\s/;
+const SHELL_CHARS = /&&|\|\||[|;`]|\$\(|\s\/[\w.-]+\/|~\//;
+
+export const looksLikeCommand = (text: string) =>
+  SHELL_START.test(text) || SHELL_WORDS.test(text) || SHELL_CHARS.test(text);
+
+export function describeApproval(row: AuditRow): ApprovalLine {
+  const base = {
+    id: row.id,
+    at: row.at,
+    where: WHERE[row.source] ?? row.source,
+  };
+  const subject = row.subject.trim();
+  if (row.source === "terminal") {
+    const tool = subject.replace(/ in a terminal session$/, "");
+    const summary =
+      tool === "Bash"
+        ? "Ran a command"
+        : CHANGE.has(tool)
+          ? "Changed a file"
+          : READ.has(tool)
+            ? "Read files"
+            : `Used ${tool}`;
+    return { ...base, summary, details: null };
+  }
+  if (row.source === "chat" && looksLikeCommand(subject))
+    return {
+      ...base,
+      summary: "Ran a command",
+      details: subject.replace(SHELL_START, "").trim() || subject,
+    };
+  return { ...base, summary: subject, details: null };
+}

package/lib/health/config.ts

@@ -30,25 +30,78 @@ export const HEALTH_DEFAULTS = {
 export type HealthKey = keyof typeof HEALTH_DEFAULTS;
 export type HealthConfig = Record<HealthKey, number>;
 
-export const HEALTH_LABELS: Record<HealthKey, string> = {
-  loadRedMinutes: "Machine load red for (minutes)",
-  queueHeldMinutes: "Queued task held for (minutes)",
-  bgQuietMinutes: "Background job quiet for (minutes)",
-  portWaitMinutes: "Waiting on a port someone else holds for (minutes)",
-  pieceDupOverlap: "Plan piece matches merged work (0 to 1 overlap)",
-  restartsMax: "Server restarts allowed per window",
-  restartsWindowMinutes: "Restart window (minutes)",
-  ciSlowFallbackMinutes: "CI pending, when no history yet (minutes)",
-  armedStuckMinutes: "PR armed without merging for (minutes)",
-  serverErrorsMin: "Server errors per 10 minutes, at least",
-  serverErrorsFactor: "Server errors, times the usual rate",
-  envBurstSessions: "Environment failure: sessions in the window to alert",
-  envBurstHours: "Environment failure window (hours)",
-  envQuietDays: "Environment failure back after quiet for (days)",
-  wakeUsageCeilingPct: "Stop waking watchers above usage (%)",
-  watchersOn: "Watchers on (1) or off (0)",
+export interface HealthMeta {
+  label: string;
+  unit?: string;
+  min: number;
+  max?: number;
+  integer?: boolean;
+  // A 1/0 value shown as a switch.
+  switch?: boolean;
+}
+
+// How each threshold reads in Settings: the server owns it, so a new
+// threshold needs no client change.
+export const HEALTH_META: Record<HealthKey, HealthMeta> = {
+  loadRedMinutes: { label: "Machine load red for", unit: "min", min: 1 },
+  queueHeldMinutes: { label: "Queued task held for", unit: "min", min: 1 },
+  bgQuietMinutes: { label: "Background job quiet for", unit: "min", min: 1 },
+  portWaitMinutes: {
+    label: "Waiting on a port someone else holds for",
+    unit: "min",
+    min: 1,
+  },
+  pieceDupOverlap: {
+    label: "Plan piece matches merged work",
+    min: 0,
+    max: 1,
+    integer: false,
+  },
+  restartsMax: { label: "Server restarts allowed per window", min: 1 },
+  restartsWindowMinutes: { label: "Restart window", unit: "min", min: 1 },
+  ciSlowFallbackMinutes: {
+    label: "CI pending, when no history yet",
+    unit: "min",
+    min: 1,
+  },
+  armedStuckMinutes: {
+    label: "PR armed without merging for",
+    unit: "min",
+    min: 1,
+  },
+  serverErrorsMin: {
+    label: "Server errors per 10 minutes, at least",
+    min: 1,
+  },
+  serverErrorsFactor: {
+    label: "Server errors, times the usual rate",
+    unit: "×",
+    min: 1,
+    integer: false,
+  },
+  envBurstSessions: {
+    label: "Environment failure: sessions in the window to alert",
+    min: 1,
+  },
+  envBurstHours: { label: "Environment failure window", unit: "hours", min: 1 },
+  envQuietDays: {
+    label: "Environment failure back after quiet for",
+    unit: "days",
+    min: 1,
+  },
+  wakeUsageCeilingPct: {
+    label: "Stop waking watchers above usage",
+    unit: "%",
+    min: 1,
+    max: 100,
+  },
+  watchersOn: { label: "Watchers", min: 0, max: 1, switch: true },
 };
 
+export const HEALTH_LABELS = Object.fromEntries(
+  Object.entries(HEALTH_META).map(([k, m]) => [k, m.label])
+) as Record<HealthKey, string>;
+
 const settingKey = (k: HealthKey) => `health.${k}`;
 
 export function healthConfig(

package/lib/models/providers.ts

@@ -190,5 +190,5 @@ export function describeSecretRef(ref: SecretRef | undefined): string {
     return `tokenvault ${ref.project}${ref.desc ? ` "${ref.desc}"` : ""}`;
   if (ref.kind === "keychain")
     return `Keychain ${ref.service}${ref.account ? ` (${ref.account})` : ""}`;
-  return `$${ref.name}`;
+  return "an environment variable";
 }

package/lib/recipes/settle.ts

@@ -24,6 +24,8 @@ import {
 import { getRecipe, toRun } from "./store";
 import type { Recipe, RecipeRun, RunStatus } from "./types";
 
+// A live run with nothing running behind it for this long is given up on.
+export const LOST_RUN_MS = 24 * 60 * 60_000;
 // A session run that stops without a RESULT line settles from the model's
 // reading after it has been idle this long.
 export const IDLE_SETTLE_MS = 30 * 60_000;
@@ -379,6 +381,26 @@ async function settleOne(
       session,
       now
     );
+  // Nothing live behind it for a day (a terminal session, an archived one, a
+  // worker that's gone): it isn't still running, so it must not say so.
+  if (
+    Number.isFinite(startedMs) &&
+    now - startedMs > LOST_RUN_MS &&
+    state !== "running" &&
+    state !== "waiting"
+  )
+    return void finish(
+      run,
+      {
+        status: "failed",
+        result: line,
+        source: "state",
+        error: "Lost track of it",
+        summary: "Lost track of it",
+      },
+      session,
+      now
+    );
   const idle =
     state === "idle" || session.archived_at != null || state === null;
   if (idle && session.view === "chat") {

package/lib/settings-url.ts

@@ -5,6 +5,7 @@
 export const SETTINGS_PARAM = "settings";
 
 export const SETTINGS_SECTIONS = [
+  "general",
   "merging",
   "approvals",
   "workspaces",
@@ -18,13 +19,19 @@ export const SETTINGS_SECTIONS = [
   "schedules",
   "audits",
   "health",
-  "setup",
   "updates",
   "experiments",
 ] as const;
 
 export type SettingsSection = (typeof SETTINGS_SECTIONS)[number];
 
+// Sections that were folded into another: an old link still lands in the
+// right place.
+export const SECTION_REDIRECTS: Record<string, SettingsSection> = {
+  setup: "health",
+  "no-approvals": "approvals",
+};
+
 export interface SettingsLocation {
   open: boolean;
   // null: the list on a phone, the first section on a wider screen.
@@ -40,7 +47,12 @@ export const isSettingsSection = (v: unknown): v is SettingsSection =>
 export function settingsFromHref(href: string): SettingsLocation {
   const value = new URL(href, BASE).searchParams.get(SETTINGS_PARAM);
   if (value === null) return { open: false, section: null };
-  return { open: true, section: isSettingsSection(value) ? value : null };
+  const section = isSettingsSection(value)
+    ? value
+    : value !== null && Object.hasOwn(SECTION_REDIRECTS, value)
+      ? SECTION_REDIRECTS[value]
+      : null;
+  return { open: true, section };
 }
 
 /** The same address with Settings set (or removed), as path+query+hash. */

package/package.json

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

package/components/Settings/NoApprovalsSection.tsx

@@ -1,103 +0,0 @@
-"use client";
-
-import { useState } from "react";
-import { Button } from "@/components/ui/button";
-import { SettingToggle } from "@/components/Settings/SettingToggle";
-import { useApprovalsModeQuery, useSetApprovalsMode } from "@/data/approvals";
-
-// What it switches off, said plainly before it can be switched on.
-export const NO_APPROVALS_WARNING = [
-  "Every ask is approved the moment it is raised, hard lines included: public posts and messages, money, irreversible or destructive changes, credentials.",
-  "A PR stuck failing its gates, with no CI, or too big to review still merges.",
-  "Brakes stop holding new starts. Plan-only tasks still wait for approve_plan.",
-  "Every agent AgentOS starts runs with its permission prompts off, and prompts already waiting are allowed.",
-];
-
-export function NoApprovalsSection() {
-  const { data, isPending, isError, error } = useApprovalsModeQuery();
-  const set = useSetApprovalsMode();
-  const [confirming, setConfirming] = useState(false);
-
-  if (isPending)
-    return <div className="bg-muted/40 h-16 animate-pulse rounded-lg" />;
-  if (isError)
-    return <p className="text-destructive text-sm">{error.message}</p>;
-
-  return (
-    <div className="space-y-3">
-      <SettingToggle
-        title="No approvals"
-        detail="Shuts off every approval AgentOS would otherwise wait on, and every agent's permission prompts. Off by default."
-        checked={data.on}
-        onChange={(on) => {
-          if (on) setConfirming(true);
-          else set.mutate(false);
-        }}
-      />
-      {confirming && !data.on && (
-        <div
-          role="alertdialog"
-          aria-label="Turn on No approvals"
-          className="rounded-lg border border-red-500/20 bg-red-500/10 p-3"
-        >
-          <p className="mb-2 text-sm font-medium text-red-400">
-            Turn on No approvals?
-          </p>
-          <ul className="text-muted-foreground mb-3 list-disc space-y-1 pl-5 text-xs">
-            {NO_APPROVALS_WARNING.map((line) => (
-              <li key={line}>{line}</li>
-            ))}
-            <li>
-              Terminals already running in an agent other than Claude keep
-              asking until they are restarted. Each approval made for you is
-              logged below.
-            </li>
-          </ul>
-          <div className="flex gap-2">
-            <Button
-              size="sm"
-              variant="destructive"
-              disabled={set.isPending}
-              onClick={() =>
-                set.mutate(true, { onSuccess: () => setConfirming(false) })
-              }
-            >
-              {set.isPending ? "Turning on..." : "Turn on No approvals"}
-            </Button>
-            <Button
-              size="sm"
-              variant="ghost"
-              disabled={set.isPending}
-              onClick={() => setConfirming(false)}
-            >
-              Cancel
-            </Button>
-          </div>
-        </div>
-      )}
-      {set.error && (
-        <p className="text-destructive text-xs">{set.error.message}</p>
-      )}
-      <div>
-        <p className="mb-1 text-sm font-medium">Approved for you</p>
-        {data.audit.length === 0 ? (
-          <p className="text-muted-foreground text-xs">Nothing yet.</p>
-        ) : (
-          <ul className="space-y-1">
-            {data.audit.map((row) => (
-              <li key={row.id} className="text-xs">
-                <span className="text-muted-foreground">
-                  {row.at} · {row.source} ·{" "}
-                </span>
-                {row.subject}
-                {row.detail ? (
-                  <span className="text-muted-foreground"> ({row.detail})</span>
-                ) : null}
-              </li>
-            ))}
-          </ul>
-        )}
-      </div>
-    </div>
-  );
-}