@ai-matrx/records-ui 0.77.0 → 0.78.0

package/dist/index.js

@@ -4240,10 +4240,30 @@ import {
   importCsv,
   importXlsx
 } from "@ai-matrx/records/core";
-import { Badge as Badge5, Button as Button11, Separator as Separator2, cn as cn12 } from "@ai-matrx/design-system";
+import {
+  Badge as Badge5,
+  Button as Button11,
+  Select as Select3,
+  SelectContent as SelectContent3,
+  SelectItem as SelectItem3,
+  SelectTrigger as SelectTrigger3,
+  SelectValue as SelectValue3,
+  Separator as Separator2,
+  cn as cn12
+} from "@ai-matrx/design-system";
 import { Fragment as Fragment7, jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
 var BATCH = 250;
 var SAMPLES = 40;
+var MAPPING_COLUMNS = "minmax(9rem, 11rem) minmax(14rem, 17rem) minmax(13rem, 1fr) minmax(8rem, 10rem)";
+var ABSENT = "__absent__";
+function obviousTitleColumn(columns) {
+  const says = /^(title|name|record|customer|client|company|job|item|subject|label|description)\b|(\bname|\btitle|\bnumber|\bid)$/i;
+  const named = columns.find((c) => says.test(c.header.trim()));
+  if (named) return named.header;
+  const text = columns.find((c) => c.type === "text");
+  if (text) return text.header;
+  return columns[0]?.header ?? null;
+}
 async function sha256(bytes) {
   const subtle = globalThis.crypto?.subtle;
   if (!subtle) return null;
@@ -4278,6 +4298,7 @@ function ImportWizard({ tableId, onDone, className }) {
   const [alreadyRan, setAlreadyRan] = useState13(null);
   const [columnsAdded, setColumnsAdded] = useState13(null);
   const [show, setShow] = useState13("all");
+  const [ledger, setLedger] = useState13(null);
   const declared = fields.data ?? [];
   const take = useCallback8(
     async (file) => {
@@ -4288,6 +4309,7 @@ function ImportWizard({ tableId, onDone, className }) {
       setProposals([]);
       setAlreadyRan(null);
       setProgress(0);
+      setLedger(null);
       try {
         const xlsx = file.name.toLowerCase().endsWith(".xlsx");
         const bytes = await file.arrayBuffer();
@@ -4314,6 +4336,11 @@ function ImportWizard({ tableId, onDone, className }) {
         for (const column of answered.data.columns) {
           if (column.matched) next[column.header] = column.field_key;
         }
+        const titleKey2 = table.data?.title_field ?? null;
+        if (titleKey2 && !Object.values(next).includes(titleKey2)) {
+          const guess = obviousTitleColumn(answered.data.columns);
+          if (guess) next[guess] = titleKey2;
+        }
         setMapping(next);
         setPhase("ready");
       } catch (thrown) {
@@ -4321,7 +4348,7 @@ function ImportWizard({ tableId, onDone, className }) {
         setPhase("waiting");
       }
     },
-    [client, declared, tableId]
+    [client, declared, tableId, table.data?.title_field]
   );
   const run = useCallback8(async () => {
     if (!plan) return;
@@ -4329,6 +4356,7 @@ function ImportWizard({ tableId, onDone, className }) {
     setOutcomes([]);
     setColumnsAdded(null);
     setProgress(0);
+    setLedger(null);
     if (unmapped === "create" && rights.admin) {
       setPhase("declaring");
       const made = await client.importDeclareColumns({ table_id: tableId, rows, mapping });
@@ -4364,6 +4392,7 @@ function ImportWizard({ tableId, onDone, className }) {
     }
     const importId = opened.data.import_id;
     const collected = [];
+    const told = { seen: 0, written: 0, duplicate: 0, refused: 0 };
     let take2 = opened.data.rows_per_call ?? BATCH;
     let at = 0;
     while (at < rows.length) {
@@ -4372,11 +4401,17 @@ function ImportWizard({ tableId, onDone, className }) {
       if (!answered.ok) {
         setProblem(answered.error.message);
         setOutcomes([...collected]);
+        setLedger({ ...told, final: false });
         setPhase("ready");
         return;
       }
       collected.push(...answered.data.outcomes);
       setOutcomes([...collected]);
+      told.seen += answered.data.rows_seen;
+      told.written += answered.data.rows_written;
+      told.duplicate += answered.data.rows_duplicate;
+      told.refused += answered.data.rows_refused;
+      setLedger({ ...told, final: false });
       at += batch.length;
       setProgress(Math.min(at, rows.length));
       if (answered.data.rows_per_call) take2 = answered.data.rows_per_call;
@@ -4389,6 +4424,13 @@ function ImportWizard({ tableId, onDone, className }) {
     }
     setSummary(finished.data.message);
     setProposals(finished.data.proposals);
+    setLedger({
+      seen: finished.data.rows_seen,
+      written: finished.data.rows_written,
+      duplicate: finished.data.rows_duplicate,
+      refused: finished.data.rows_refused,
+      final: true
+    });
     setPhase("done");
     onDone?.(finished.data.rows_written);
   }, [client, dedupeKey, fileBytes, fileHash, fileName, format, mapping, onDuplicate, onDone, plan, rows, tableId, unmapped]);
@@ -4408,6 +4450,10 @@ function ImportWizard({ tableId, onDone, className }) {
     [outcomes, show]
   );
   const mappedCount = Object.keys(mapping).length;
+  const titleKey = table.data?.title_field ?? null;
+  const titleMappedTo = titleKey ? Object.entries(mapping).find(([, key]) => key === titleKey)?.[0] ?? null : null;
+  const titleMissing = Boolean(titleKey) && titleMappedTo === null;
+  const titleFieldLabel = (titleKey ? plan?.fields.find((f) => f.key === titleKey)?.label : null) || (titleKey ? declared.find((f) => f.key === titleKey)?.label : null) || "the name column";
   const busy = phase === "reading" || phase === "planning" || phase === "declaring" || phase === "writing";
   return /* @__PURE__ */ jsxs12("div", { className: cn12("flex min-w-0 flex-col gap-2 text-xs", className), children: [
     /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
@@ -4440,55 +4486,107 @@ function ImportWizard({ tableId, onDone, className }) {
     phase === "reading" ? /* @__PURE__ */ jsx16("p", { className: "text-muted-foreground", children: "Reading the file\u2026" }) : null,
     phase === "planning" ? /* @__PURE__ */ jsx16("p", { className: "text-muted-foreground", children: "Working out what each column is\u2026" }) : null,
     plan && parsed ? /* @__PURE__ */ jsxs12(Fragment7, { children: [
-      /* @__PURE__ */ jsx16("div", { className: "w-full overflow-x-auto rounded border", children: /* @__PURE__ */ jsxs12("table", { className: "w-full min-w-[50rem] table-fixed", children: [
-        /* @__PURE__ */ jsxs12("colgroup", { children: [
-          /* @__PURE__ */ jsx16("col", { className: "w-[10rem]" }),
-          /* @__PURE__ */ jsx16("col", { className: "w-[17rem]" }),
-          /* @__PURE__ */ jsx16("col", { className: "w-[14rem]" }),
-          /* @__PURE__ */ jsx16("col", { className: "w-[9rem]" })
-        ] }),
-        /* @__PURE__ */ jsx16("thead", { className: "bg-muted", children: /* @__PURE__ */ jsxs12("tr", { children: [
-          /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "Column in the file" }),
-          /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "Goes to" }),
-          /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "Kind" }),
-          /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "First values" })
-        ] }) }),
-        /* @__PURE__ */ jsx16("tbody", { children: plan.columns.map((column) => {
+      titleKey ? /* @__PURE__ */ jsxs12("div", { className: "flex flex-wrap items-center gap-2 rounded border bg-muted/40 px-2 py-1.5", children: [
+        /* @__PURE__ */ jsx16("span", { className: "font-medium", children: "What each record is called" }),
+        /* @__PURE__ */ jsxs12(
+          Select3,
+          {
+            value: titleMappedTo ?? "",
+            disabled: busy,
+            onValueChange: (chosen) => {
+              setMapping((m) => {
+                const next = { ...m };
+                for (const [header, key] of Object.entries(next)) {
+                  if (key === titleKey) delete next[header];
+                }
+                if (chosen) next[chosen] = titleKey;
+                return next;
+              });
+            },
+            children: [
+              /* @__PURE__ */ jsx16(
+                SelectTrigger3,
+                {
+                  size: "sm",
+                  "aria-label": "Which column each record is named by",
+                  className: "min-w-[14rem]",
+                  children: /* @__PURE__ */ jsx16(SelectValue3, { placeholder: "\u2014 choose the column \u2014" })
+                }
+              ),
+              /* @__PURE__ */ jsx16(SelectContent3, { children: plan.columns.map((c) => /* @__PURE__ */ jsx16(SelectItem3, { value: c.header, children: c.header }, c.header)) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx16("span", { className: "text-muted-foreground", children: titleMappedTo ? `goes into ${titleFieldLabel}, so every record this file makes has a name you can read in the grid and on a chip.` : `Nothing goes into ${titleFieldLabel} yet, so every record this file makes would land with no name at all. Pick the column that says what each row IS.` })
+      ] }) : null,
+      /* @__PURE__ */ jsx16("div", { className: "w-full overflow-x-auto rounded border", children: /* @__PURE__ */ jsxs12("div", { className: "min-w-[52rem]", children: [
+        /* @__PURE__ */ jsxs12(
+          "div",
+          {
+            className: "grid items-center gap-x-3 border-b bg-muted px-2 py-1 font-medium",
+            style: { gridTemplateColumns: MAPPING_COLUMNS },
+            children: [
+              /* @__PURE__ */ jsx16("span", { children: "Column in the file" }),
+              /* @__PURE__ */ jsx16("span", { children: "Goes to" }),
+              /* @__PURE__ */ jsx16("span", { children: "Kind" }),
+              /* @__PURE__ */ jsx16("span", { children: "First values" })
+            ]
+          }
+        ),
+        plan.columns.map((column) => {
           const to = mapping[column.header] ?? "";
-          return /* @__PURE__ */ jsxs12("tr", { className: "border-t align-top", children: [
-            /* @__PURE__ */ jsx16("td", { className: "truncate px-2 py-1 font-medium", title: column.header, children: column.header }),
-            /* @__PURE__ */ jsx16("td", { className: "px-2 py-1", children: /* @__PURE__ */ jsxs12(
-              "select",
-              {
-                "aria-label": `Where ${column.header} goes`,
-                className: "w-full min-w-0 rounded border bg-background px-1 py-0.5",
-                value: to,
-                disabled: busy,
-                onChange: (e) => {
-                  const chosen = e.target.value;
-                  setMapping((m) => {
-                    const next = { ...m };
-                    if (chosen === "") delete next[column.header];
-                    else next[column.header] = chosen;
-                    return next;
-                  });
-                },
-                children: [
-                  /* @__PURE__ */ jsx16("option", { value: "", children: unmapped === "ignore" ? "\u2014 leave it out \u2014" : "\u2014 offer it as a new column \u2014" }),
-                  plan.fields.map((f) => /* @__PURE__ */ jsx16("option", { value: f.key, children: f.label || f.key }, f.field_id))
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ jsxs12("td", { className: "px-2 py-1", children: [
-              /* @__PURE__ */ jsx16(Badge5, { variant: column.matched ? "secondary" : "outline", className: "text-[11px] font-normal", children: typeWord(column.type) }),
-              column.unit ? /* @__PURE__ */ jsx16("span", { className: "ml-1 opacity-60", children: column.unit }) : null,
-              /* @__PURE__ */ jsx16("p", { className: "mt-0.5 text-muted-foreground", children: column.why }),
-              column.ambiguous ? /* @__PURE__ */ jsx16("p", { className: "text-destructive", children: "Check a date you know before you run this." }) : null,
-              column.collides_with ? /* @__PURE__ */ jsx16("p", { className: "text-destructive", children: "Two columns in this file would make the same column." }) : null
-            ] }),
-            /* @__PURE__ */ jsx16("td", { className: "truncate px-2 py-1 text-muted-foreground", children: (column.samples ?? []).slice(0, 3).map(String).join(" \xB7 ") })
-          ] }, column.header);
-        }) })
+          const absent = unmapped === "ignore" ? "\u2014 leave it out \u2014" : "\u2014 offer it as a new column \u2014";
+          return /* @__PURE__ */ jsxs12(
+            "div",
+            {
+              className: "grid items-start gap-x-3 border-t px-2 py-1",
+              style: { gridTemplateColumns: MAPPING_COLUMNS },
+              children: [
+                /* @__PURE__ */ jsx16("span", { className: "truncate pt-1.5 font-medium", title: column.header, children: column.header }),
+                /* @__PURE__ */ jsxs12(
+                  Select3,
+                  {
+                    value: to || ABSENT,
+                    disabled: busy,
+                    onValueChange: (chosen) => {
+                      setMapping((m) => {
+                        const next = { ...m };
+                        if (chosen === ABSENT) delete next[column.header];
+                        else next[column.header] = chosen;
+                        return next;
+                      });
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx16(
+                        SelectTrigger3,
+                        {
+                          size: "sm",
+                          "aria-label": `Where ${column.header} goes`,
+                          "data-goes-to": column.header,
+                          className: "w-full min-w-[14rem]",
+                          children: /* @__PURE__ */ jsx16(SelectValue3, {})
+                        }
+                      ),
+                      /* @__PURE__ */ jsxs12(SelectContent3, { children: [
+                        /* @__PURE__ */ jsx16(SelectItem3, { value: ABSENT, children: absent }),
+                        plan.fields.map((f) => /* @__PURE__ */ jsx16(SelectItem3, { value: f.key, children: f.label || f.key }, f.field_id))
+                      ] })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs12("div", { className: "pt-1", children: [
+                  /* @__PURE__ */ jsx16(Badge5, { variant: column.matched ? "secondary" : "outline", className: "text-[11px] font-normal", children: typeWord(column.type) }),
+                  column.unit ? /* @__PURE__ */ jsx16("span", { className: "ml-1 opacity-60", children: column.unit }) : null,
+                  /* @__PURE__ */ jsx16("p", { className: "mt-0.5 text-muted-foreground", children: column.why }),
+                  column.ambiguous ? /* @__PURE__ */ jsx16("p", { className: "text-destructive", children: "Check a date you know before you run this." }) : null,
+                  column.collides_with ? /* @__PURE__ */ jsx16("p", { className: "text-destructive", children: "Two columns in this file would make the same column." }) : null
+                ] }),
+                /* @__PURE__ */ jsx16("span", { className: "truncate pt-1.5 text-muted-foreground", children: (column.samples ?? []).slice(0, 3).map(String).join(" \xB7 ") })
+              ]
+            },
+            column.header
+          );
+        })
       ] }) }),
       /* @__PURE__ */ jsx16(Separator2, {}),
       /* @__PURE__ */ jsxs12("div", { className: "flex flex-wrap items-center gap-3", children: [
@@ -4546,13 +4644,18 @@ function ImportWizard({ tableId, onDone, className }) {
         ] })
       ] }),
       /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx16(Button11, { size: "sm", disabled: busy || !rights.write || rows.length === 0, onClick: () => void run(), children: phase === "declaring" ? "Adding the columns\u2026" : phase === "writing" ? `Writing\u2026 ${progress} of ${rows.length}` : `Import ${rows.length} row${rows.length === 1 ? "" : "s"}` }),
-        /* @__PURE__ */ jsxs12("span", { className: "text-muted-foreground", children: [
-          mappedCount,
-          " of ",
-          plan.columns.length,
-          " columns go into this table",
-          fileHash ? "" : " \xB7 this browser cannot recognise the file again, so importing it twice would write it twice"
+        /* @__PURE__ */ jsx16(
+          Button11,
+          {
+            size: "sm",
+            disabled: busy || !rights.write || rows.length === 0 || titleMissing,
+            onClick: () => void run(),
+            children: phase === "declaring" ? "Adding the columns\u2026" : phase === "writing" ? `Writing\u2026 ${progress} of ${rows.length}` : `Import ${rows.length} row${rows.length === 1 ? "" : "s"}`
+          }
+        ),
+        /* @__PURE__ */ jsxs12("span", { className: cn12("text-muted-foreground", titleMissing && "text-destructive"), children: [
+          titleMissing ? `Nothing goes into ${titleFieldLabel} yet, so these records would have no name. Choose the column above, then this will run.` : `${mappedCount} of ${plan.columns.length} columns go into this table`,
+          fileHash || titleMissing ? "" : " \xB7 this browser cannot recognise the file again, so importing it twice would write it twice"
         ] })
       ] })
     ] }) : null,
@@ -4570,27 +4673,31 @@ function ImportWizard({ tableId, onDone, className }) {
       ] }) : null
     ] }) : null,
     alreadyRan ? /* @__PURE__ */ jsx16("p", { className: "text-muted-foreground", children: alreadyRan }) : null,
-    outcomes.length > 0 || summary ? /* @__PURE__ */ jsxs12(Fragment7, { children: [
+    outcomes.length > 0 || summary || ledger ? /* @__PURE__ */ jsxs12(Fragment7, { children: [
       /* @__PURE__ */ jsx16(Separator2, {}),
       /* @__PURE__ */ jsxs12("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsxs12("span", { children: [
-          counts.landed,
-          " landed \xB7 ",
-          counts.duplicate,
-          " already here \xB7 ",
-          counts.refused,
-          " refused"
-        ] }),
-        counts.refused + counts.duplicate > 0 ? /* @__PURE__ */ jsxs12(Fragment7, { children: [
+        /* @__PURE__ */ jsx16("span", { children: ledger ? `${ledger.written} landed \xB7 ${ledger.duplicate} already here \xB7 ${ledger.refused} refused, of ${ledger.seen} row${ledger.seen === 1 ? "" : "s"} offered` : `${counts.landed} landed \xB7 ${counts.duplicate} already here \xB7 ${counts.refused} refused` }),
+        ledger && !ledger.final && phase !== "writing" ? /* @__PURE__ */ jsx16("span", { className: "text-destructive", children: "The run stopped here, so the rest of the file was never offered \u2014 these are the rows that were dealt with before it stopped, not the whole file." }) : null,
+        (ledger ? ledger.refused + ledger.duplicate : counts.refused + counts.duplicate) > 0 ? /* @__PURE__ */ jsxs12(Fragment7, { children: [
           /* @__PURE__ */ jsx16("button", { type: "button", className: cn12("underline underline-offset-2", show === "all" && "font-medium"), onClick: () => setShow("all"), children: "everything that did not land" }),
           /* @__PURE__ */ jsx16("button", { type: "button", className: cn12("underline underline-offset-2", show === "refused" && "font-medium"), onClick: () => setShow("refused"), children: "refused" }),
           /* @__PURE__ */ jsx16("button", { type: "button", className: cn12("underline underline-offset-2", show === "duplicate" && "font-medium"), onClick: () => setShow("duplicate"), children: "already here" })
         ] }) : null
       ] }),
       summary ? /* @__PURE__ */ jsx16("p", { className: "text-muted-foreground", children: summary }) : null,
+      ledger && show === "all" && ledger.refused + ledger.duplicate > interesting.length ? /* @__PURE__ */ jsxs12("p", { className: "text-muted-foreground", children: [
+        interesting.length,
+        " of the ",
+        ledger.refused + ledger.duplicate,
+        " row",
+        ledger.refused + ledger.duplicate === 1 ? " that" : "s that",
+        " did not land",
+        interesting.length === 1 ? " is" : " are",
+        " listed below by their line in your file \u2014 the store keeps the rest with this run and does not hand every one of them back at once."
+      ] }) : null,
       interesting.length > 0 ? /* @__PURE__ */ jsx16("div", { className: "max-h-64 overflow-auto rounded border", children: /* @__PURE__ */ jsxs12("table", { className: "w-full", children: [
         /* @__PURE__ */ jsx16("thead", { className: "sticky top-0 bg-muted", children: /* @__PURE__ */ jsxs12("tr", { children: [
-          /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "Row" }),
+          /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "Line in your file" }),
           /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "What happened" }),
           /* @__PURE__ */ jsx16("th", { className: "px-2 py-1 text-left font-medium", children: "The row in your file" })
         ] }) }),
@@ -4803,13 +4910,13 @@ import {
   Button as Button13,
   Checkbox as Checkbox4,
   Label as Label4,
-  Select as Select3,
-  SelectContent as SelectContent3,
+  Select as Select4,
+  SelectContent as SelectContent4,
   SelectGroup,
-  SelectItem as SelectItem3,
+  SelectItem as SelectItem4,
   SelectLabel,
-  SelectTrigger as SelectTrigger3,
-  SelectValue as SelectValue3,
+  SelectTrigger as SelectTrigger4,
+  SelectValue as SelectValue4,
   Separator as Separator4,
   cn as cn14
 } from "@ai-matrx/design-system";
@@ -4974,16 +5081,16 @@ function FieldEditor({ tableId, field, onSaved, onCancel, onRemoved, className }
       /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
         /* @__PURE__ */ jsx18(Label4, { className: "text-xs", children: "What it holds" }),
         /* @__PURE__ */ jsxs14(
-          Select3,
+          Select4,
           {
             value: type,
             disabled: editing,
             onValueChange: (next) => setType(next),
             children: [
-              /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", "aria-label": "What this field holds", children: /* @__PURE__ */ jsx18(SelectValue3, {}) }),
-              /* @__PURE__ */ jsx18(SelectContent3, { children: FIELD_TYPE_GROUPS.map((group) => /* @__PURE__ */ jsxs14(SelectGroup, { children: [
+              /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", "aria-label": "What this field holds", children: /* @__PURE__ */ jsx18(SelectValue4, {}) }),
+              /* @__PURE__ */ jsx18(SelectContent4, { children: FIELD_TYPE_GROUPS.map((group) => /* @__PURE__ */ jsxs14(SelectGroup, { children: [
                 /* @__PURE__ */ jsx18(SelectLabel, { children: group }),
-                FIELD_TYPE_CHOICES.filter((c) => c.group === group).map((c) => /* @__PURE__ */ jsx18(SelectItem3, { value: c.id, children: c.label }, c.id))
+                FIELD_TYPE_CHOICES.filter((c) => c.group === group).map((c) => /* @__PURE__ */ jsx18(SelectItem4, { value: c.id, children: c.label }, c.id))
               ] }, group)) })
             ]
           }
@@ -5063,16 +5170,16 @@ function FieldEditor({ tableId, field, onSaved, onCancel, onRemoved, className }
     /* @__PURE__ */ jsxs14("div", { className: "grid gap-3 sm:grid-cols-2", children: [
       /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
         /* @__PURE__ */ jsx18(Label4, { className: "text-xs", children: "Who can see what is in it" }),
-        /* @__PURE__ */ jsxs14(Select3, { value: sensitivity, onValueChange: setSensitivity, children: [
-          /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", "aria-label": "Who can see what is in it", children: /* @__PURE__ */ jsx18(SelectValue3, {}) }),
-          /* @__PURE__ */ jsx18(SelectContent3, { children: SENSITIVITIES.map((row) => /* @__PURE__ */ jsx18(SelectItem3, { value: row.value, children: row.label }, row.value)) })
+        /* @__PURE__ */ jsxs14(Select4, { value: sensitivity, onValueChange: setSensitivity, children: [
+          /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", "aria-label": "Who can see what is in it", children: /* @__PURE__ */ jsx18(SelectValue4, {}) }),
+          /* @__PURE__ */ jsx18(SelectContent4, { children: SENSITIVITIES.map((row) => /* @__PURE__ */ jsx18(SelectItem4, { value: row.value, children: row.label }, row.value)) })
         ] })
       ] }),
       /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
         /* @__PURE__ */ jsx18(Label4, { className: "text-xs", children: "Can an assistant read it" }),
-        /* @__PURE__ */ jsxs14(Select3, { value: contextPolicy, onValueChange: setContextPolicy, children: [
-          /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", "aria-label": "Can an assistant read it", children: /* @__PURE__ */ jsx18(SelectValue3, {}) }),
-          /* @__PURE__ */ jsx18(SelectContent3, { children: AGENT_VISIBILITY.map((row) => /* @__PURE__ */ jsx18(SelectItem3, { value: row.value, children: row.label }, row.value)) })
+        /* @__PURE__ */ jsxs14(Select4, { value: contextPolicy, onValueChange: setContextPolicy, children: [
+          /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", "aria-label": "Can an assistant read it", children: /* @__PURE__ */ jsx18(SelectValue4, {}) }),
+          /* @__PURE__ */ jsx18(SelectContent4, { children: AGENT_VISIBILITY.map((row) => /* @__PURE__ */ jsx18(SelectItem4, { value: row.value, children: row.label }, row.value)) })
         ] })
       ] })
     ] }),
@@ -5095,13 +5202,13 @@ function FieldEditor({ tableId, field, onSaved, onCancel, onRemoved, className }
       rules.length === 0 ? /* @__PURE__ */ jsx18("p", { className: "text-muted-foreground", children: "No checks. Anything this kind of column can hold will be accepted." }) : null,
       rules.map((rule, index) => /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-1", children: [
         /* @__PURE__ */ jsxs14(
-          Select3,
+          Select4,
           {
             value: rule.kind,
             onValueChange: (kind) => setRules(rules.map((r, i) => i === index ? { ...r, kind } : r)),
             children: [
-              /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", className: "w-52", "aria-label": `Check ${index + 1}`, children: /* @__PURE__ */ jsx18(SelectValue3, {}) }),
-              /* @__PURE__ */ jsx18(SelectContent3, { children: RULE_KINDS.map((row) => /* @__PURE__ */ jsx18(SelectItem3, { value: row.kind, children: row.label }, row.kind)) })
+              /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", className: "w-52", "aria-label": `Check ${index + 1}`, children: /* @__PURE__ */ jsx18(SelectValue4, {}) }),
+              /* @__PURE__ */ jsx18(SelectContent4, { children: RULE_KINDS.map((row) => /* @__PURE__ */ jsx18(SelectItem4, { value: row.kind, children: row.label }, row.kind)) })
             ]
           }
         ),
@@ -5277,9 +5384,9 @@ function TypeQuestions(props) {
     return /* @__PURE__ */ jsxs14("div", { className: "grid gap-3 sm:grid-cols-2", children: [
       /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
         /* @__PURE__ */ jsx18(Label4, { className: "text-xs", children: type === "rollup" ? "Across the records in" : "Read it from" }),
-        /* @__PURE__ */ jsxs14(Select3, { value: props.via, onValueChange: props.setVia, children: [
-          /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", "aria-label": type === "rollup" ? "Across the records in" : "Read it from", children: /* @__PURE__ */ jsx18(SelectValue3, { placeholder: "Choose a column" }) }),
-          /* @__PURE__ */ jsx18(SelectContent3, { children: usable.map((f) => /* @__PURE__ */ jsxs14(SelectItem3, { value: f.key, children: [
+        /* @__PURE__ */ jsxs14(Select4, { value: props.via, onValueChange: props.setVia, children: [
+          /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", "aria-label": type === "rollup" ? "Across the records in" : "Read it from", children: /* @__PURE__ */ jsx18(SelectValue4, { placeholder: "Choose a column" }) }),
+          /* @__PURE__ */ jsx18(SelectContent4, { children: usable.map((f) => /* @__PURE__ */ jsxs14(SelectItem4, { value: f.key, children: [
             fieldName(f),
             type === "rollup" && !f.multi ? " \u2014 holds one" : ""
           ] }, f.id)) })
@@ -5296,9 +5403,9 @@ function TypeQuestions(props) {
         }
       ) : /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
         /* @__PURE__ */ jsx18(Label4, { className: "text-xs", children: "What to work out" }),
-        /* @__PURE__ */ jsxs14(Select3, { value: props.agg, onValueChange: (v) => props.setAgg(v), children: [
-          /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", "aria-label": "What to work out", children: /* @__PURE__ */ jsx18(SelectValue3, {}) }),
-          /* @__PURE__ */ jsx18(SelectContent3, { children: ROLLUP_OPERATIONS.map((row) => /* @__PURE__ */ jsx18(SelectItem3, { value: row.value, children: row.label }, row.value)) })
+        /* @__PURE__ */ jsxs14(Select4, { value: props.agg, onValueChange: (v) => props.setAgg(v), children: [
+          /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", "aria-label": "What to work out", children: /* @__PURE__ */ jsx18(SelectValue4, {}) }),
+          /* @__PURE__ */ jsx18(SelectContent4, { children: ROLLUP_OPERATIONS.map((row) => /* @__PURE__ */ jsx18(SelectItem4, { value: row.value, children: row.label }, row.value)) })
         ] }),
         props.agg !== "count" ? /* @__PURE__ */ jsx18(
           ValueOnTheOtherSide,
@@ -5321,9 +5428,9 @@ function TypeQuestions(props) {
     return /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-2", children: [
       /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
         /* @__PURE__ */ jsx18(Label4, { className: "text-xs", children: "What to do" }),
-        /* @__PURE__ */ jsxs14(Select3, { value: props.formulaOp, onValueChange: props.setFormulaOp, children: [
-          /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", className: "max-w-[18rem]", "aria-label": "What to do", children: /* @__PURE__ */ jsx18(SelectValue3, {}) }),
-          /* @__PURE__ */ jsx18(SelectContent3, { children: FORMULA_OPERATIONS.map((row) => /* @__PURE__ */ jsx18(SelectItem3, { value: row.value, children: row.label }, row.value)) })
+        /* @__PURE__ */ jsxs14(Select4, { value: props.formulaOp, onValueChange: props.setFormulaOp, children: [
+          /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", className: "max-w-[18rem]", "aria-label": "What to do", children: /* @__PURE__ */ jsx18(SelectValue4, {}) }),
+          /* @__PURE__ */ jsx18(SelectContent4, { children: FORMULA_OPERATIONS.map((row) => /* @__PURE__ */ jsx18(SelectItem4, { value: row.value, children: row.label }, row.value)) })
         ] })
       ] }),
       /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
@@ -5368,9 +5475,9 @@ function ValueOnTheOtherSide({
   const body = !relation ? /* @__PURE__ */ jsx18("p", { className: "text-[11px] text-muted-foreground", children: "Choose the column above first." }) : stillAsking ? /* @__PURE__ */ jsx18("p", { className: "text-[11px] text-muted-foreground", children: "Reading that table's columns\u2026" }) : offered.length === 0 ? /* @__PURE__ */ jsxs14("p", { className: "text-[11px] text-muted-foreground", children: [
     fieldName(relation),
     " points at a table that has no columns to read yet. Add one there first."
-  ] }) : /* @__PURE__ */ jsxs14(Select3, { value, onValueChange: onChange, children: [
-    /* @__PURE__ */ jsx18(SelectTrigger3, { size: "sm", "aria-label": label, children: /* @__PURE__ */ jsx18(SelectValue3, { placeholder: "Choose a column" }) }),
-    /* @__PURE__ */ jsx18(SelectContent3, { children: offered.map((column) => /* @__PURE__ */ jsx18(SelectItem3, { value: column.key, children: column.name }, column.key)) })
+  ] }) : /* @__PURE__ */ jsxs14(Select4, { value, onValueChange: onChange, children: [
+    /* @__PURE__ */ jsx18(SelectTrigger4, { size: "sm", "aria-label": label, children: /* @__PURE__ */ jsx18(SelectValue4, { placeholder: "Choose a column" }) }),
+    /* @__PURE__ */ jsx18(SelectContent4, { children: offered.map((column) => /* @__PURE__ */ jsx18(SelectItem4, { value: column.key, children: column.name }, column.key)) })
   ] });
   if (compact) return /* @__PURE__ */ jsx18("div", { className: "mt-1 flex flex-col gap-1", children: body });
   return /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1", children: [
@@ -5977,8 +6084,8 @@ import { useState as useState18 } from "react";
 import {
   useFieldMutation as useFieldMutation2,
   useFields as useFields8,
-  useRecordMutation,
-  useTable as useTable6
+  useTable as useTable6,
+  useTableArchive
 } from "@ai-matrx/records/react";
 import { Badge as Badge6, Button as Button16, Separator as Separator6, cn as cn16 } from "@ai-matrx/design-system";
 import { Fragment as Fragment10, jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
@@ -5993,8 +6100,8 @@ function TableSettings({
   const table = useTable6(tableId);
   const fields = useFields8(tableId);
   const rights = useTableRights(table.data);
-  const mutation = useRecordMutation();
   const shape = useFieldMutation2();
+  const archive = useTableArchive(tableId);
   const [editing, setEditing] = useState18(null);
   const [askingToDelete, setAskingToDelete] = useState18(false);
   const [askingToRemove, setAskingToRemove] = useState18(null);
@@ -6019,10 +6126,16 @@ function TableSettings({
       table.reload();
     }
   };
-  const deleteTable = async () => {
-    const gone = await mutation.remove({ record_id: tableId });
-    setAskingToDelete(false);
-    if (gone !== null) onDeleted?.();
+  const startArchive = async () => {
+    const finished = await archive.start();
+    if (finished?.done && finished.table_archived) {
+      setAskingToDelete(false);
+      onDeleted?.();
+    }
+  };
+  const askToArchive = async () => {
+    setAskingToDelete(true);
+    await archive.preview();
   };
   if (enriching) {
     return /* @__PURE__ */ jsxs17("div", { className, children: [
@@ -6058,7 +6171,6 @@ function TableSettings({
       /* @__PURE__ */ jsx21("span", { className: "text-muted-foreground", children: rows.length }),
       /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "outline", className: "ml-auto", onClick: () => setEditing("new"), children: "Add a field" })
     ] }),
-    mutation.error ? /* @__PURE__ */ jsx21(RefusalNotice, { error: mutation.error }) : null,
     shape.error ? /* @__PURE__ */ jsx21(RefusalNotice, { error: shape.error }) : null,
     askingToRemove ? /* @__PURE__ */ jsxs17("div", { className: "flex flex-wrap items-center gap-2 rounded border border-destructive/40 px-2 py-1.5", children: [
       /* @__PURE__ */ jsxs17("span", { className: "text-destructive", children: [
@@ -6149,21 +6261,32 @@ function TableSettings({
       /* @__PURE__ */ jsx21("span", { className: "font-medium", children: "This table" }),
       askingToDelete ? /* @__PURE__ */ jsxs17(Fragment10, { children: [
         /* @__PURE__ */ jsxs17("p", { className: "text-muted-foreground", children: [
-          "Deleting ",
+          "Archiving ",
           table.data ? tableName(table.data) : "this table",
           " takes it out of everyone's list, with its ",
           rows.length,
           " field",
           rows.length === 1 ? "" : "s",
-          " and every record in it.",
-          table.data?.retention_days ? ` The store keeps them for ${table.data.retention_days} days, so it can still be restored.` : " The store keeps them, so it can still be restored."
+          " and",
+          " ",
+          archive.progress ? `its ${archive.progress.remaining.toLocaleString()} record${archive.progress.remaining === 1 ? "" : "s"}` : "every record in it",
+          ".",
+          table.data?.retention_days ? ` The store keeps them for ${table.data.retention_days} days, so it can still be brought back.` : " The store keeps them, so it can still be brought back."
         ] }),
-        /* @__PURE__ */ jsxs17("div", { className: "flex gap-1", children: [
-          /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "destructive", disabled: mutation.saving, onClick: () => void deleteTable(), children: mutation.saving ? "Deleting\u2026" : "Delete this table" }),
+        archive.progress && (archive.running || archive.passes > 0) ? /* @__PURE__ */ jsxs17("p", { className: archive.error ? "text-destructive" : "text-muted-foreground", children: [
+          archive.progress.total - archive.progress.remaining === archive.progress.total ? `All ${archive.progress.total.toLocaleString()} record${archive.progress.total === 1 ? "" : "s"} are put away.` : `${(archive.progress.total - archive.progress.remaining).toLocaleString()} of ${archive.progress.total.toLocaleString()} record${archive.progress.total === 1 ? "" : "s"} put away so far.`,
+          archive.slowedDown ? " The store is busy, so it is taking smaller passes \u2014 it will still finish." : ""
+        ] }) : null,
+        archive.interrupted && archive.progress ? /* @__PURE__ */ jsx21("p", { className: "text-muted-foreground", children: archive.error ? `That pass did not finish, so the rest is still here. ${archive.progress.archived_total.toLocaleString()} record${archive.progress.archived_total === 1 ? " is" : "s are"} already archived and ${archive.progress.remaining.toLocaleString()} ${archive.progress.remaining === 1 ? "is" : "are"} left. Nothing was lost \u2014 carry on and it picks up where it stopped.` : `Stopped. ${archive.progress.archived_total.toLocaleString()} record${archive.progress.archived_total === 1 ? " is" : "s are"} archived and ${archive.progress.remaining.toLocaleString()} ${archive.progress.remaining === 1 ? "is" : "are"} left. Carry on whenever you like \u2014 it picks up where it stopped.` }) : null,
+        /* @__PURE__ */ jsx21("div", { className: "flex gap-1", children: archive.running ? /* @__PURE__ */ jsxs17(Fragment10, { children: [
+          /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "destructive", disabled: true, children: "Archiving\u2026" }),
+          /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "ghost", onClick: () => archive.stop(), children: "Stop" })
+        ] }) : /* @__PURE__ */ jsxs17(Fragment10, { children: [
+          /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "destructive", onClick: () => void startArchive(), children: archive.interrupted ? "Carry on archiving" : "Archive this table" }),
           /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "ghost", onClick: () => setAskingToDelete(false), children: "Keep it" })
-        ] })
-      ] }) : /* @__PURE__ */ jsx21("div", { children: /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "outline", onClick: () => setAskingToDelete(true), children: "Delete this table" }) }),
-      mutation.error ? /* @__PURE__ */ jsx21(RefusalNotice, { error: mutation.error }) : null
+        ] }) })
+      ] }) : /* @__PURE__ */ jsx21("div", { children: /* @__PURE__ */ jsx21(Button16, { size: "sm", variant: "outline", onClick: () => void askToArchive(), children: "Archive this table" }) }),
+      archive.error ? /* @__PURE__ */ jsx21(RefusalNotice, { error: archive.error }) : null
     ] })
   ] });
 }
@@ -6305,7 +6428,7 @@ import { useEffect as useEffect11, useMemo as useMemo16, useState as useState21
 import {
   useFields as useFields9,
   useRecord,
-  useRecordMutation as useRecordMutation2
+  useRecordMutation
 } from "@ai-matrx/records/react";
 import { predictWriteRefusals } from "@ai-matrx/records/core";
 import { Button as Button17, Separator as Separator7, cn as cn18 } from "@ai-matrx/design-system";
@@ -6494,7 +6617,7 @@ function RecordForm({
   const host = useRecordsUi();
   const fields = useFields9(tableId, recordType);
   const existing = useRecord(recordId ?? null);
-  const mutation = useRecordMutation2();
+  const mutation = useRecordMutation();
   const [draft, setDraft] = useState21({});
   const [touched, setTouched] = useState21(false);
   const loaded = useRecordVersion(recordId ?? null);
@@ -7471,6 +7594,7 @@ function ViewSwitcher({
     )
   ] });
 }
+var UNUSUAL_FIELD_NOTE = "an unusual column to use here";
 function offerableFields(all, want) {
   return all.filter((field) => {
     const kind = editorKindFor(field);
@@ -7606,10 +7730,7 @@ function FieldPicker({
         children: [
           /* @__PURE__ */ jsx27("option", { value: "", children: "Choose a field" }),
           offerable.map((field) => /* @__PURE__ */ jsx27("option", { value: field.key, children: fieldName(field) }, field.key)),
-          unusual ? /* @__PURE__ */ jsxs23("option", { value: unusual.key, children: [
-            fieldName(unusual),
-            " \u2014 an unusual column to use here"
-          ] }, unusual.key) : null
+          unusual ? /* @__PURE__ */ jsx27("option", { value: unusual.key, children: `${fieldName(unusual)} \u2014 ${UNUSUAL_FIELD_NOTE}` }, unusual.key) : null
         ]
       }
     ),
@@ -13350,7 +13471,17 @@ function Drawing({
 // src/DashboardCanvas.tsx
 import { useCallback as useCallback30, useEffect as useEffect34, useMemo as useMemo28, useState as useState47 } from "react";
 import { useFields as useFields21, useRecordsClient as useRecordsClient33, useTable as useTable18 } from "@ai-matrx/records/react";
-import { BasicInput as BasicInput16, Button as Button42, Skeleton as Skeleton26, cn as cn44 } from "@ai-matrx/design-system";
+import {
+  BasicInput as BasicInput16,
+  Button as Button42,
+  Select as Select5,
+  SelectContent as SelectContent5,
+  SelectItem as SelectItem5,
+  SelectTrigger as SelectTrigger5,
+  SelectValue as SelectValue5,
+  Skeleton as Skeleton26,
+  cn as cn44
+} from "@ai-matrx/design-system";
 import { Fragment as Fragment21, jsx as jsx50, jsxs as jsxs46 } from "react/jsx-runtime";
 function DashboardCanvas({ tableId, activeDashboardId, filter, className }) {
   const client = useRecordsClient33();
@@ -13424,8 +13555,8 @@ function DashboardCanvas({ tableId, activeDashboardId, filter, className }) {
     [client, tableId, load, filter]
   );
   async function create() {
-    const groupable = (fields.data ?? []).filter((f) => f.type === "text" || f.type === "list");
-    const byField = groupable[0];
+    const all = fields.data ?? [];
+    const byField = offerableFields(all, "choice")[0] ?? all.find((f) => f.type === "text" || f.type === "list");
     const by = byField?.key;
     await declare2(
       {
@@ -13596,6 +13727,32 @@ function DashboardCanvas({ tableId, activeDashboardId, filter, className }) {
               children: CHART_KINDS.map((kind) => /* @__PURE__ */ jsx50("option", { value: kind, children: CHART_KIND_LABEL[kind] }, kind))
             }
           ),
+          (board.blocks[index].groupBy ?? []).length > 0 ? /* @__PURE__ */ jsx50(
+            GroupingPicker,
+            {
+              block: board.blocks[index],
+              fields: fields.data ?? [],
+              onPick: (key) => void declare2(
+                board,
+                board.blocks.map((b, i) => {
+                  if (i !== index) return b;
+                  const picked = (fields.data ?? []).find((f) => f.key === key);
+                  const wasNamedAfterItsColumn = (fields.data ?? []).some(
+                    (f) => b.title === `By ${fieldName(f)}`
+                  );
+                  return {
+                    ...b,
+                    groupBy: [key],
+                    // A block titled after the column it grouped by
+                    // must not keep saying "By Job Number" once it
+                    // groups by Status. A title somebody wrote
+                    // themselves is left alone.
+                    ...wasNamedAfterItsColumn && picked ? { title: `By ${fieldName(picked)}` } : {}
+                  };
+                })
+              )
+            }
+          ) : null,
           /* @__PURE__ */ jsx50(
             Button42,
             {
@@ -13614,6 +13771,45 @@ function DashboardCanvas({ tableId, activeDashboardId, filter, className }) {
     ] })
   ] });
 }
+function groupingChoices(all) {
+  const once = [];
+  for (const field of all) if (!once.some((f) => f.key === field.key)) once.push(field);
+  const sensible = offerableFields(once, "choice");
+  const isSensible = (field) => sensible.some((s) => s.key === field.key);
+  return [
+    ...sensible.map((field) => ({ field, unusual: false })),
+    ...once.filter((field) => !isSensible(field)).map((field) => ({ field, unusual: true }))
+  ];
+}
+function GroupingPicker({
+  block,
+  fields,
+  onPick
+}) {
+  const choices = groupingChoices(fields);
+  const current = block.groupBy?.[0] ?? "";
+  if (choices.length === 0) {
+    return /* @__PURE__ */ jsx50("span", { className: "text-muted-foreground", children: "This table has no columns yet, so there is nothing to group this block by." });
+  }
+  const known = choices.some((c) => c.field.key === current);
+  return /* @__PURE__ */ jsxs46(Fragment21, { children: [
+    /* @__PURE__ */ jsx50("label", { className: "text-muted-foreground", htmlFor: `block-group-${block.title}`, children: "Group by" }),
+    /* @__PURE__ */ jsxs46(Select5, { value: known ? current : "", onValueChange: onPick, children: [
+      /* @__PURE__ */ jsx50(
+        SelectTrigger5,
+        {
+          size: "sm",
+          id: `block-group-${block.title}`,
+          "aria-label": `Which column ${block.title} is grouped by`,
+          className: "h-7 min-w-[10rem] text-xs",
+          children: /* @__PURE__ */ jsx50(SelectValue5, { placeholder: "Choose a column" })
+        }
+      ),
+      /* @__PURE__ */ jsx50(SelectContent5, { children: choices.map(({ field, unusual }) => /* @__PURE__ */ jsx50(SelectItem5, { value: field.key, children: unusual ? `${fieldName(field)} \u2014 ${UNUSUAL_FIELD_NOTE}` : fieldName(field) }, field.key)) })
+    ] }),
+    known ? null : /* @__PURE__ */ jsx50("span", { className: "text-muted-foreground", children: "The column this block was grouped by is no longer on this table \u2014 choose another." })
+  ] });
+}
 
 // src/FormsPanel.tsx
 import { useCallback as useCallback31, useEffect as useEffect35, useState as useState48 } from "react";