@arcforgelabs/flow 2026.11.4 → 2026.11.6

package/server/integrations/seazona/migrations/meta/_journal.json

@@ -57,6 +57,13 @@
       "when": 1792472936253,
       "tag": "0007_stage_moves",
       "breakpoints": true
+    },
+    {
+      "idx": 8,
+      "version": "7",
+      "when": 1794463203447,
+      "tag": "0008_order_remake",
+      "breakpoints": true
     }
   ]
 }

package/server/integrations/seazona/schema.js

@@ -74,6 +74,8 @@ export const seazonaOrders = pgTable('seazona_orders', {
   lines: jsonb('lines').notNull().default([]),
   subtotalCents: cents('subtotal_cents'),
   patientReference: text('patient_reference'),
+  // Seazona's isRemake on the order: a remake of earlier work.
+  remake: boolean('remake').notNull().default(false),
   // Issue #12: Seazona answered 404. The row and its history stay; the order
   // reads as "Deleted in Seazona" and is out of billing. A later successful
   // read clears it.

package/server/integrations/seazona/store.js

@@ -81,6 +81,20 @@ export async function touchSynced(db, mirror, keys, { at }) {
   await db.update(table).set({ lastSyncedAt: at }).where(inArray(table[key], keys));
 }
 
+// The remake flag of orders whose other list fields did not change, from the
+// list rows (`flags`, Map(id -> boolean)): no detail read is needed. A change
+// counts as a change of the order, so the billing feed reads it again.
+export async function syncRemakeFlags(db, flags, { at }) {
+  const ids = [...flags.keys()];
+  if (!ids.length) return 0;
+  const values = ids.map((id) => flags.get(id) === true);
+  const { rowCount } = await db.execute(sql`
+    update seazona_orders o set remake = f.remake, last_changed_at = ${at}
+    from unnest(${sql.param(ids)}::text[], ${sql.param(values)}::boolean[]) as f(id, remake)
+    where o.id = f.id and o.remake is distinct from f.remake`);
+  return rowCount ?? 0;
+}
+
 // Issue #12: Seazona answered 404. Keep the row and its history, mark it, and
 // refresh its sync time so it never comes first in the rotation again. An
 // order seen in a list but never stored is kept from that list row.

package/server/integrations/seazona/sweep.js

@@ -17,6 +17,7 @@ import {
   readOrderFailures,
   readQuarantinedRecords,
   recordRecordFailure,
+  syncRemakeFlags,
   touchSynced,
   upsertRecords,
 } from './store.js';
@@ -216,6 +217,8 @@ async function sweepOrderDay(ctx, day, progress, helpers, found) {
     }
   }
   await touchSynced(db, 'orders', unchanged, { at });
+  // The remake flag is on the list row: kept with no detail read.
+  await syncRemakeFlags(db, new Map(unchanged.map((id) => [id, listed.get(id)?.isRemake === true])), { at });
 
   // Held for this day, left out of the list, and not seen this cycle.
   for (const row of held) {

package/server/integrations/sentry/index.js

@@ -1,6 +1,6 @@
 import * as SentryNode from '@sentry/node';
 import { isReplitWorkspace } from '../../core/host.js';
-import { scrubSpan } from '../../ui/monitoring.js';
+import { scrubEvent, scrubSpan } from '../../ui/monitoring.js';
 
 // The Sentry adapter (docs/SENTRY.md). It sends the errors Flow logs, the
 // browser's errors and problem reports, and performance traces from both
@@ -48,6 +48,7 @@ export const SENTRY_SETUP = {
     { name: 'SENTRY_ENVIRONMENT', label: 'Environment', advanced: true, help: 'How Sentry labels this installation, for example production. Empty: production, or workspace in a Replit workspace.' },
     { name: 'SENTRY_CLIENT', label: 'Client', advanced: true, help: 'The name your support desk files this installation\'s reports under. Sent as the client tag. Empty: no client tag.' },
     { name: 'SENTRY_FEEDBACK', label: 'Report button', kind: 'onoff', default: 'on', help: 'On: everyone signed in can send a report, with a screenshot, to this Sentry project.' },
+    { name: 'SENTRY_SCREENSHOT', label: 'Screenshot', kind: 'onoff', default: 'off', help: 'On: a report can add a screenshot. A screenshot shows the screen as it is, with names and prices, so it is off by default.' },
     { name: 'SENTRY_REPLAY', label: 'Replay', kind: 'onoff', default: 'on', help: 'On: each report and each browser error keeps up to the last minute of the page, as a replay with every word hidden.' },
     { name: 'SENTRY_TRACES_SAMPLE_RATE', label: 'Traces', advanced: true, help: 'The share of clicks, page loads and requests timed, from 0 (off) to 1 (all). Empty: 0.2.' },
   ],
@@ -61,6 +62,7 @@ export function readSentrySettings(env) {
   // labelled apart so they never read as the live app's.
   const environment = String(env.SENTRY_ENVIRONMENT ?? '').trim() || (isReplitWorkspace(env) ? 'workspace' : 'production');
   const feedback = String(env.SENTRY_FEEDBACK ?? 'on').trim() !== 'off';
+  const screenshot = String(env.SENTRY_SCREENSHOT ?? 'off').trim() === 'on';
   const replay = String(env.SENTRY_REPLAY ?? 'on').trim() !== 'off';
   const rate = String(env.SENTRY_TRACES_SAMPLE_RATE ?? '').trim();
   const tracesSampleRate = rate === '' ? DEFAULT_TRACES_SAMPLE_RATE : Number(rate);
@@ -72,7 +74,7 @@ export function readSentrySettings(env) {
   // Every event says which product and, when set, which client it is from,
   // so one support desk can serve many installations.
   const tags = client ? { product: 'flow', client } : { product: 'flow' };
-  return { dsn, environment, feedback, replay, tracesSampleRate, tags };
+  return { dsn, environment, feedback, screenshot, replay, tracesSampleRate, tags };
 }
 
 // No trace for the host's health check: it is not a person waiting.
@@ -105,8 +107,10 @@ export function createSentryAdapter({ sdk = SentryNode, env: hostEnv = process.e
         environment: settings.environment,
         release: release ?? undefined,
         initialScope: { tags: settings.tags },
-        // Flow sends what it logs; no request bodies, cookies or IP addresses.
+        // Flow sends what it logs, with private words masked (scrubEvent);
+        // no request bodies, cookies or IP addresses.
         sendDefaultPii: false,
+        beforeSend: scrubEvent,
         // A request the browser traced keeps the browser's choice, so a
         // click and the server work it caused stay one trace.
         tracesSampler: ({ attributes, inheritOrSampleWith }) => (
@@ -139,12 +143,13 @@ export function createSentryAdapter({ sdk = SentryNode, env: hostEnv = process.e
       // meant for browsers.
       browserMonitoring() {
         if (!settings) return null;
-        const { tracesSampleRate, replay } = settings;
+        const { tracesSampleRate, replay, screenshot } = settings;
         return {
           dsn: settings.dsn,
           environment: settings.environment,
           release,
           feedback: settings.feedback,
+          screenshot,
           replay,
           tags: settings.tags,
           tracesSampleRate,

package/server/integrations/xero/catalogue.js

@@ -223,6 +223,46 @@ export async function itemsByCode(db, organisationId, codes) {
   return new Map(rows.map((row) => [row.code, itemRow(row)]));
 }
 
+// The Xero item each Flow price code sends as. A Flow item linked to a Xero
+// item (the price list's link, by Xero's ItemID, so a code changed in Xero
+// still finds it) sends as that item, under Xero's own code. A link whose
+// Xero item has left Xero's list is `linkMissing`: never fall back to the
+// Flow code then. A Flow item with no link sends as the Xero item with the
+// same code. Codes with neither are absent from the map.
+export async function xeroItemsForCodes(db, organisationId, codes) {
+  const wanted = [...new Set(codes.filter(Boolean))];
+  if (!wanted.length) return new Map();
+  const { rows } = await db.execute(sql`
+    select p.code as flow_code, l.external_id as link_id, x.*
+    from unnest(${sql.param(wanted)}::text[]) as w(code)
+    left join price_items p on p.organisation_id = ${organisationId} and p.code = w.code
+    left join lateral (
+      select external_id from price_item_links pl
+      where pl.organisation_id = ${organisationId} and pl.price_item_id = p.id and pl.system = 'xero'
+      order by pl.created_at desc limit 1) l on true
+    left join xero_items x on x.organisation_id = ${organisationId}
+      and (case when l.external_id is not null then x.xero_item_id = l.external_id else x.code = w.code end)`);
+  const found = new Map();
+  for (const row of rows) {
+    const code = row.flow_code;
+    if (!code) continue;
+    if (row.link_id && !row.xero_item_id) found.set(code, { linkMissing: true, xeroItemId: row.link_id });
+    else if (row.xero_item_id) found.set(code, { ...itemRow(row), linked: Boolean(row.link_id) });
+  }
+  // A code with no Flow price item (an older document) still matches by code.
+  const rest = wanted.filter((c) => !found.has(c));
+  if (rest.length) for (const [code, item] of await itemsByCode(db, organisationId, rest)) found.set(code, item);
+  return found;
+}
+
+// The Flow codes that send as a Xero item that sells: the rule field "Every
+// item is in accounting" (invoice-rules.js) reads them. A gone link, a
+// missing item and an item not set to be sold do not count.
+export async function sellingCodes(db, organisationId, codes) {
+  const items = await xeroItemsForCodes(db, organisationId, codes);
+  return [...items].filter(([, item]) => !item.linkMissing && item.isSold !== false).map(([code]) => code);
+}
+
 // The Xero contact for a Flow contact name: exactly one active contact with
 // the same name, or why not. A missing name can be created from the Flow
 // contact when that setting is on (create-contact.js). A doubled name is

package/server/integrations/xero/drafts.js

@@ -5,7 +5,7 @@ import { getInvoice, listInvoiceVersions } from '../../core/invoices.js';
 import { sendModeFor } from '../../core/invoicing-rules.js';
 import { contacts as flowContacts, invoices as flowInvoices, priceItems } from '../../db/schema.js';
 import { readConnection } from './connections.js';
-import { itemsByCode, lastSuccessfulSyncAt, matchContactFor, normaliseName } from './catalogue.js';
+import { lastSuccessfulSyncAt, xeroItemsForCodes, matchContactFor, normaliseName } from './catalogue.js';
 import { writesAllowed } from './settings.js';
 import { xeroError } from './client.js';
 import { withXeroLane } from './governor.js';
@@ -162,8 +162,19 @@ export function buildDraft(document, { settings, contact, items, sendMode = 'acc
       TaxType: settings.taxTypes[line.taxCode],
     };
     if (line.itemCode) {
-      if (items.has(line.itemCode)) out.ItemCode = line.itemCode;
-      else problems.push(problem('xero_item_missing', `Line ${line.position}: item ${line.itemCode} is not in Xero. Add it in Xero, then sync.`, { itemCode: line.itemCode, short: `${line.itemCode} not in Xero` }));
+      // The Xero item this Flow code sends as (catalogue.js, xeroItemsForCodes):
+      // the linked item under Xero's own code, else the same code.
+      const item = items.get(line.itemCode);
+      if (item?.linkMissing) {
+        problems.push(problem('xero_item_missing', `Line ${line.position}: item ${line.itemCode} is linked to a Xero item that is no longer in Xero. Link it again in Price list, then sync.`, { itemCode: line.itemCode, short: `${line.itemCode} link gone` }));
+      } else if (!item) {
+        problems.push(problem('xero_item_missing', `Line ${line.position}: item ${line.itemCode} is not in Xero. Add it in Xero, then sync.`, { itemCode: line.itemCode, short: `${line.itemCode} not in Xero` }));
+      } else if (item.isSold === false) {
+        problems.push(problem('xero_item_missing', `Line ${line.position}: Xero item ${item.code || line.itemCode} is not set to be sold. Turn on "I sell this item" in Xero, then sync.`, { itemCode: line.itemCode, short: `${item.code || line.itemCode} not sold in Xero` }));
+      } else {
+        out.ItemCode = item.code || line.itemCode;
+        if (settings.lineText === 'item' && item.name) out.Description = item.name;
+      }
     } else if (line.accountCode) {
       // A line with no item books to its own account, such as a surcharge.
       out.AccountCode = line.accountCode;
@@ -324,7 +335,7 @@ async function previewOne(db, runtime, organisationId, invoiceId) {
   const offerCreate = match.state === 'missing' && runtime.settings.createContacts && writesAllowed(runtime.settings);
   if (match.state === 'missing') problems.push(missingContact(document.contact.name, { offerCreate }));
   if (match.state === 'ambiguous') problems.push(twiceContact(document.contact.name));
-  const items = await itemsByCode(db, organisationId, document.lines.map((l) => l.itemCode));
+  const items = await xeroItemsForCodes(db, organisationId, document.lines.map((l) => l.itemCode));
   const sendMode = await sendModeFor(db, organisationId, invoice.contactId);
   const { draft, problems: lineProblems } = buildDraft(document, { settings: runtime.settings, contact: match.contact, items, sendMode });
   problems.push(...lineProblems);
@@ -509,7 +520,7 @@ async function pushOne(db, runtime, client, organisationId, invoiceId, { pushedB
     const found = match.state === 'missing' ? missingContact(document.contact.name, { offerCreate }) : twiceContact(document.contact.name);
     throw xeroError(found.code, found.message, { status: 409, short: found.short });
   }
-  const items = await itemsByCode(db, organisationId, document.lines.map((l) => l.itemCode));
+  const items = await xeroItemsForCodes(db, organisationId, document.lines.map((l) => l.itemCode));
   const sendMode = await sendModeFor(db, organisationId, invoice.contactId);
   const { draft, problems } = buildDraft(document, { settings: runtime.settings, contact: match.contact, items, sendMode });
   if (problems.length) throw xeroError(problems[0].code, problems.map((p) => p.message).join(' '), { status: 409, short: problems[0].short });

package/server/integrations/xero/index.js

@@ -7,6 +7,7 @@ import { deleteXeroInvoice } from './delete-invoice.js';
 import { createCustomer } from './create-contact.js';
 import { checkDrafts, documentFacts, pushInvoice, pushInvoices } from './drafts.js';
 import { readConnection } from './connections.js';
+import { lastSuccessfulSyncAt, sellingCodes } from './catalogue.js';
 import { createImportWorker } from './import.js';
 import { readPayments, xeroLiveCheck } from './ledger.js';
 import { findInvoices, listCustomers, listPriceItems, mirrorState } from './lookup.js';
@@ -166,6 +167,15 @@ export function createXeroAdapter({ runtime: given = null } = {}) {
       createCustomer: ({ organisationId, contactId, actor = null }) => createCustomer(database, current(), { organisationId, contactId, actor }),
       // Sales invoices from the mirror, with the mirror's state (lookup.js).
       findInvoices: ({ organisationId, ...query }) => findInvoices(database, organisationId, query),
+      // The Flow codes that send as a Xero item that sells (catalogue.js),
+      // for the invoice rule field "Every item is in accounting". Null while
+      // not connected or before the first item sync.
+      itemMatches: async ({ organisationId, codes = [] }) => {
+        const connection = await readConnection(database, organisationId);
+        if (!connection || connection.mode !== current().settings.mode) return null;
+        if (!(await lastSuccessfulSyncAt(database, organisationId))) return null;
+        return sellingCodes(database, organisationId, codes);
+      },
       // Xero items, from Flow's copy, for the price list (lookup.js).
       listPriceItems: ({ organisationId }) => listPriceItems(database, organisationId, { taxTypes: current().settings.taxTypes }),
     },

package/server/integrations/xero/lookup.js

@@ -107,7 +107,8 @@ function invoiceRow(r) {
 }
 
 // Sales invoices from the mirror, by any of: Xero ids, invoice numbers, the
-// Flow invoices Flow sent, or one customer within a date range. Answers the
+// Flow invoices Flow sent or the Xero import linked, or one customer within a
+// date range. Answers the
 // mirror's state with them, and the latest change time it holds.
 export async function findInvoices(db, organisationId, query = {}) {
   const { invoiceIds = [], numbers = [], references = [], flowInvoiceIds = [], contactId = null, from = null, to = null } = query;
@@ -127,9 +128,15 @@ export async function findInvoices(db, organisationId, query = {}) {
     select i.*, p.invoice_id as flow_invoice_id
     from xero_invoices i
     left join lateral (
-      select invoice_id from xero_invoice_pushes
-      where organisation_id = i.organisation_id and xero_invoice_id = i.xero_invoice_id
-      order by version desc limit 1
+      -- The Flow invoice this Xero invoice is: the one Flow sent it from,
+      -- else the one the Xero import linked or made from it.
+      select invoice_id from (
+        select invoice_id, 0 as pick, version from xero_invoice_pushes
+        where organisation_id = i.organisation_id and xero_invoice_id = i.xero_invoice_id
+        union all
+        select invoice_id, 1, 0 from xero_invoice_links
+        where organisation_id = i.organisation_id and xero_invoice_id = i.xero_invoice_id
+      ) f order by pick, version desc limit 1
     ) p on true
     where i.organisation_id = ${organisationId} and i.type = 'ACCREC'
       and (${sql.join(where, sql` or `)})

package/server/integrations/xero/settings.js

@@ -163,6 +163,8 @@ export function resolveXeroSettings(env = process.env) {
 
   const invoiceNumber = (readEnv(env, 'XERO_INVOICE_NUMBER') || 'xero').toLowerCase();
   if (!['xero', 'flow'].includes(invoiceNumber)) throw new Error('XERO_INVOICE_NUMBER must be "xero", "flow" or unset');
+  const lineText = (readEnv(env, 'XERO_LINE_TEXT') || 'flow').toLowerCase();
+  if (!['flow', 'item'].includes(lineText)) throw new Error('XERO_LINE_TEXT must be "flow", "item" or unset');
 
   return {
     mode,
@@ -184,6 +186,9 @@ export function resolveXeroSettings(env = process.env) {
     tracking: resolveTracking(env),
     defaultDueDays: readPositiveInteger(env, 'XERO_DEFAULT_DUE_DAYS', DEFAULT_DUE_DAYS),
     invoiceNumber,
+    // The text on each Xero line with an item: `flow` (default) the Flow
+    // line's own text; `item` the Xero item's name.
+    lineText,
     replayFixtures: readEnv(env, 'XERO_REPLAY_FIXTURES') || null,
     // Free text on Xero records (references, line descriptions) is the lab's
     // own data, and the Import matches on it. On unless the lab turns it off.

package/server/ui/app.js

@@ -28,7 +28,7 @@ import { isSearchKey, openSearch } from '/assets/ui/search.js';
 import { alertStrip } from '/assets/ui/alerts.js';
 import { initialsOf, personLabel } from '/assets/ui/person.js';
 import { startTips } from '/assets/ui/tip.js';
-import { cardRows, crumbs, dialog, edgeFade, fieldError, h, holdButton, iconPicker, linksOpenWith, listFrame, listHead, notice, pageHeader, pickOne, rowMenu, sectionTitle, settingRow, tileCard, tileSection, toast } from '/assets/ui/kit.js';
+import { cardRows, copyButton, crumbs, dialog, edgeFade, fieldError, h, holdButton, iconPicker, linksOpenWith, listFrame, listHead, notice, pageHeader, pickOne, rowMenu, sectionTitle, settingRow, tileCard, tileSection, toast } from '/assets/ui/kit.js';
 import { NAV_DEFAULT, NAV_LOCKED } from '/assets/ui/nav-pins.js';
 
 const $ = (id) => document.getElementById(id);
@@ -339,7 +339,7 @@ function navigate(event) {
 // The shared pieces a view module (invoicing.js) builds with. Its `go`
 // takes a path, or a link's click event.
 const ui = () => ({
-  h, flow, toast, notice, cardRows, fieldError, pageHeader, listHead, listFrame, edgeFade, sectionTitle, settingRow, dialog, pickOne, iconPicker, me, holdButton, tileCard, tileSection, crumbs,
+  h, flow, toast, notice, cardRows, copyButton, fieldError, pageHeader, listHead, listFrame, edgeFade, sectionTitle, settingRow, dialog, pickOne, iconPicker, me, holdButton, tileCard, tileSection, crumbs,
   go: (target, options) => (typeof target === 'string' ? go(target, options) : navigate(target)),
 });
 

package/server/ui/flow.css

@@ -237,6 +237,8 @@ body:is([data-state="off"], [data-state="error"], [data-state="no-access"]) .fx-
 .fx-change__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
 .fx-change__acts { display: flex; flex-wrap: wrap; gap: 8px; }
 .fx-change__note { font-size: 13px; color: var(--t-dim); }
+.fx-copy__text { width: 100%; min-height: 200px; padding: 8px 10px; font-family: ui-monospace, monospace; font-size: 12px; resize: vertical; }
+@media (max-width: 1023px) { .fx-copy { width: 44px; min-height: 44px; } }
 .fx-change__recheck { width: 30px; }
 .fx-change__recheck .fx-lucide { width: 14px; height: 14px; }
 .fx-change__recheck.is-busy .fx-lucide { animation: fx-spin 1s linear infinite; }
@@ -359,71 +361,44 @@ a.fx-link:hover, a.fx-link:focus-visible { border-color: var(--t-strong); }
   background: #fff; box-shadow: inset 0 0 0 1px var(--fx-line);
 }
 .fx-logo--icon { background: var(--t-accent-bg); color: var(--t-accent); box-shadow: none; }
-/* Home: the invoices ready to send and one Send, then the way an invoice
-   goes after Send, drawn as one line of steps (a column on a phone). */
-.fx-home { display: grid; gap: 20px; max-width: 880px; }
-.fx-home__send {
-  position: relative; overflow: hidden;
-  display: grid; justify-items: start; gap: 6px; padding: 32px;
-  border: 1px solid var(--fx-line); border-radius: var(--t-radius-lg);
-  background:
-    radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--t-primary) 10%, transparent), transparent 60%),
-    var(--t-paper);
-}
-.fx-home__send[data-done] {
-  grid-template-columns: auto 1fr; align-items: center; column-gap: 16px;
-  background:
-    radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--t-success) 12%, transparent), transparent 60%),
-    var(--t-paper);
-}
-.fx-home__send[data-done] > :not(.fx-home__done) { grid-column: 2; }
-.fx-home__done {
-  grid-row: span 2; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
-  background: var(--t-success-bg); color: var(--t-success);
-}
-.fx-home__done .fx-lucide { width: 26px; height: 26px; }
-.fx-home__count {
-  display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px;
-  color: var(--t-strong); font: 700 72px/1 var(--t-body); font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
-}
-.fx-home__count span { font: 600 20px/1.2 var(--t-body); letter-spacing: 0; color: var(--t-text); }
-.fx-home__send[data-done] .fx-home__count span { font-size: 22px; color: var(--t-strong); }
-.fx-home__sum { color: var(--t-dim); font-size: 16px; font-variant-numeric: tabular-nums; }
-.fx-home__btn { min-height: 56px; min-width: 200px; margin-top: 14px; padding: 0 32px; font-size: 17px; border-radius: 999px; }
-.fx-home__btn .fx-lucide { width: 20px; height: 20px; }
-.fx-home__note { color: var(--t-dim); font-size: 13.5px; }
-
-/* Needs you: at most three rows beside Send; each opens its page. */
-.fx-home__needs { display: grid; align-content: start; gap: 10px; }
-.fx-home__needs h2 { margin: 0; }
-.fx-home__needs ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
-.fx-home__needs a {
-  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px;
-  min-height: 64px; padding: 10px 16px; border: 1px solid var(--fx-line); border-radius: var(--t-radius-lg);
-  background: var(--t-paper); color: var(--t-text); text-decoration: none;
-  transition: border-color 140ms var(--fx-ease), transform 140ms var(--fx-ease);
-}
-.fx-home__needs a:hover, .fx-home__needs a:focus-visible { border-color: var(--t-control); transform: translateY(-1px); }
-.fx-home__dot { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--fx-hover); color: var(--t-dim); }
-.fx-home__dot .fx-lucide { width: 18px; height: 18px; }
-.fx-home__needs [data-tone="danger"] .fx-home__dot { background: var(--t-danger-bg); color: var(--t-danger); }
-.fx-home__needs [data-tone="warn"] .fx-home__dot { background: var(--t-warn-bg); color: var(--t-warn); }
-.fx-home__needs [data-tone="info"] .fx-home__dot { background: var(--t-accent-bg); color: var(--t-accent); }
-.fx-home__needs [data-tone="clear"] .fx-home__dot { background: var(--t-success-bg); color: var(--t-success); }
-.fx-home__what { display: grid; font-weight: 600; color: var(--t-strong); }
-.fx-home__what small { color: var(--t-dim); font-weight: 400; font-size: 13px; font-variant-numeric: tabular-nums; }
-.fx-home__needs [data-tone="clear"] .fx-home__what { color: var(--t-dim); font-weight: 500; }
-.fx-home__n { color: var(--t-strong); font: 700 22px/1 var(--t-body); font-variant-numeric: tabular-nums; }
-.fx-home__needs [data-tone="clear"] .fx-home__n { color: var(--t-dim); font-weight: 500; }
+/* Home: a row of stat cards (label, number, total). A card with work has a
+   thin edge in its tone; a card at 0 is plain. The link covers the card;
+   Send sits above it. Four across on a desk, two on a tablet, rows on a phone. */
+.fx-home { display: grid; gap: 16px; max-width: 1040px; }
+.fx-stats { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1040px; }
+.fx-stat {
+  position: relative; display: grid; align-content: start; gap: 12px; padding: 18px 20px;
+  border: 1px solid var(--fx-line); border-radius: var(--t-radius-lg); background: var(--t-paper);
+  box-shadow: inset 3px 0 0 var(--fx-stat-edge, transparent); transition: border-color .15s;
+}
+.fx-stat:hover, .fx-stat:focus-within { border-color: var(--t-control); }
+.fx-stat[data-tone="accent"] { --fx-stat-edge: var(--t-accent); }
+.fx-stat[data-tone="danger"] { --fx-stat-edge: var(--t-danger); }
+.fx-stat[data-tone="warn"] { --fx-stat-edge: var(--t-warn); }
+.fx-stat[data-tone="info"] { --fx-stat-edge: var(--t-accent); }
+.fx-stat__link { display: grid; gap: 6px; color: inherit; text-decoration: none; }
+.fx-stat__link::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
+.fx-stat__link:focus-visible { outline: none; }
+.fx-stat:has(.fx-stat__link:focus-visible) { outline: 2px solid var(--t-accent); outline-offset: 2px; }
+.fx-stat__n { color: var(--t-strong); font: 600 34px/1.1 var(--t-body); font-variant-numeric: tabular-nums; }
+.fx-stat[data-tone="none"] .fx-stat__n { color: var(--t-dim); font-weight: 500; }
+.fx-stat__sum { min-height: 1.3em; color: var(--t-dim); font-size: 14px; font-variant-numeric: tabular-nums; }
+.fx-stat__act { position: relative; z-index: 1; display: grid; gap: 6px; justify-items: start; }
+.fx-stat__note { color: var(--t-dim); font-size: 13px; }
 
-@media (min-width: 1024px) {
-  .fx-home { grid-template-columns: minmax(0, 3fr) minmax(260px, 2fr); align-items: stretch; max-width: 1040px; }
-  .fx-home__send { align-content: center; }
+@media (max-width: 1023px) {
+  .fx-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+  .fx-stat__act .fx-btn { min-height: 44px; }
 }
 @media (max-width: 639px) {
-  .fx-home__send { padding: 24px 20px; }
-  .fx-home__count { font-size: 60px; }
-  .fx-home__btn { width: 100%; }
+  .fx-stats { grid-template-columns: 1fr; gap: 8px; }
+  .fx-stat { grid-template-columns: 1fr auto; align-items: center; padding: 12px 16px; }
+  .fx-stat__link { grid-template-columns: 1fr auto; grid-column: 1 / -1; align-items: center; min-height: 44px; }
+  .fx-stat__link .fx-label { grid-row: 1; }
+  .fx-stat__sum { grid-row: 2; grid-column: 1; min-height: 0; }
+  .fx-stat__sum:empty { display: none; }
+  .fx-stat__n { grid-row: 1 / span 2; grid-column: 2; font-size: 26px; }
+  .fx-stat__act { grid-column: 1 / -1; justify-items: stretch; }
 }
 
 .fx-tiles { display: grid; gap: 12px; }

package/server/ui/home.js

@@ -1,9 +1,9 @@
-// Home: the page a person lands on. One job first: send the invoices that
-// are ready. The big number is the Ready tab's count, and Send sends them
-// all with the same step as the Invoices page (POST /invoices/send-ready).
-// Beside it, at most three things that need a person most days: invoices
-// that need a look, jobs and invoices to match (Reconcile), and form photos
-// to check (Capture). Each opens its page. No calls of its own to other
+// Home: the page a person lands on, a row of stat cards like an accounting
+// dashboard. Ready (with Send), Pending, To match and Forms each show their
+// count, and a total when it has one. A card with work has a thin edge in its
+// tone; a card at 0 is plain. No card says "done": the counts say it. Each card
+// opens its page. Send sends every ready invoice with the same step as the
+// Invoices page (POST /invoices/send-ready). No calls of its own to other
 // systems: every number is its page's own.
 import { formatCents, localDate } from '/assets/ui/invoicing.js';
 import { sendModeNote } from '/assets/ui/invoice-notes.js';
@@ -11,17 +11,10 @@ import { lucide } from '/assets/ui/custom-fields.js';
 
 const plural = (n, one, many) => `${n} ${n === 1 ? one : many}`;
 
-function greeting(person, now = new Date()) {
-  const hour = now.getHours();
-  const part = hour < 12 ? 'Good morning' : hour < 18 ? 'Good afternoon' : 'Good evening';
-  const first = String(person?.name ?? '').trim().split(/\s+/)[0];
-  return first ? `${part}, ${first}` : part;
-}
-
 export async function renderHome(main, ui) {
-  const { h, flow, toast, notice, pageHeader, dialog, go, me } = ui;
+  const { h, flow, toast, notice, pageHeader, dialog, go } = ui;
   const host = h('div', { class: 'fx-home' });
-  main.append(pageHeader(greeting(me?.person)), host);
+  main.append(pageHeader('Home'), host);
   const tabQuery = (tab) => `/api/invoicing/invoices?${new URLSearchParams({ status: tab, limit: '1' })}`;
 
   async function load() {
@@ -45,45 +38,43 @@ export async function renderHome(main, ui) {
     }
     if (!host.isConnected) return;
     draw(context, body, [
-      { href: '/invoices?tab=pending', icon: 'circle-alert', label: 'Need a look', tone: 'danger', count: pending.total, sum: pending.totalCents },
-      toMatch && { href: '/reconcile', icon: 'link', label: 'To match', tone: 'warn', count: (toMatch.jobs?.length ?? 0) + (toMatch.invoices?.length ?? 0) },
-      forms && { href: '/captures', icon: 'camera', label: 'Forms to check', tone: 'info', count: forms.captures.filter((c) => c.state === 'ready').length },
+      { key: 'pending', href: '/invoices?tab=pending', label: 'Pending', tone: 'danger', count: pending.total, sum: pending.totalCents },
+      { key: 'match', href: '/reconcile', label: 'Unmatched', tone: 'warn', count: toMatch ? (toMatch.jobs?.length ?? 0) + (toMatch.invoices?.length ?? 0) : null },
+      forms && { key: 'forms', href: '/captures', label: 'Forms', tone: 'info', count: forms.captures.filter((c) => c.state === 'ready').length },
     ].filter(Boolean));
   }
 
+  // One stat card. The link covers the card; Send sits above it, so the card
+  // has no button inside a link. `count: null`: the page could not be read.
+  function card({ key, href, label, tone, count, sum = null }, extra = null) {
+    const unknown = count == null;
+    return h('article', { class: 'fx-stat', 'data-tone': count ? tone : 'none', 'aria-labelledby': `home-${key}` },
+      h('a', {
+        class: 'fx-stat__link', href, onclick: open, id: `home-${key}`, title: unknown ? 'Could not load' : null,
+        'aria-label': [label, unknown ? 'could not load' : String(count), count && sum != null ? formatCents(sum) : null].filter(Boolean).join(', '),
+      },
+        h('span', { class: 'fx-label' }, label),
+        h('span', { class: 'fx-stat__n' }, unknown ? '–' : String(count)),
+        h('span', { class: 'fx-stat__sum' }, count && sum != null ? formatCents(sum) : '')),
+      extra);
+  }
+
   function draw(context, body, items) {
     const to = body.sendsTo;
-    const counts = body.counts ?? {};
-    const ready = counts.ready ?? 0;
+    const ready = body.counts?.ready ?? 0;
     const blocked = to && body.sendMode && (!body.sendMode.connected || !body.sendMode.writesAllowed);
     const canSend = context.canIssue && !blocked;
-
-    const hero = ready
-      ? h('section', { class: 'fx-home__send', 'aria-labelledby': 'home-ready' },
-        h('p', { class: 'fx-home__count', id: 'home-ready' }, String(ready),
-          h('span', {}, ready === 1 ? 'invoice ready' : 'invoices ready')),
-        h('p', { class: 'fx-home__sum' }, formatCents(body.totalCents)),
-        h('button', {
-          class: 'fx-btn fx-btn--primary fx-home__btn', type: 'button', disabled: !canSend,
-          onclick: (event) => send(to, ready, body.sendMode, event.currentTarget),
-        }, lucide(h, 'send'), h('span', {}, 'Send')),
-        context.canIssue ? null : h('p', { class: 'fx-home__note' }, 'An owner or admin sends.'),
-        blocked ? h('p', { class: 'fx-home__note' }, sendModeNote(to, body.sendMode)) : null)
-      : h('section', { class: 'fx-home__send', 'data-done': '', 'aria-labelledby': 'home-ready' },
-        h('span', { class: 'fx-home__done', 'aria-hidden': 'true' }, lucide(h, 'check')),
-        h('p', { class: 'fx-home__count', id: 'home-ready' }, h('span', {}, 'All caught up')),
-        h('p', { class: 'fx-home__sum' }, 'Nothing waits to be sent.'));
-
-    const needs = h('section', { class: 'fx-home__needs', 'aria-labelledby': 'home-needs' },
-      h('h2', { class: 'fx-label', id: 'home-needs' }, 'Needs you'),
-      h('ul', {}, items.map((item) => h('li', {},
-        h('a', { href: item.href, onclick: open, 'data-tone': item.count ? item.tone : 'clear' },
-          h('span', { class: 'fx-home__dot', 'aria-hidden': 'true' }, lucide(h, item.count ? item.icon : 'check')),
-          h('span', { class: 'fx-home__what' }, item.label,
-            item.count && item.sum ? h('small', {}, formatCents(item.sum)) : null),
-          h('span', { class: 'fx-home__n' }, String(item.count)))))));
-
-    host.replaceChildren(hero, needs);
+    // Send shows only to people who can send, and only while it can work.
+    const sendButton = ready && canSend ? h('div', { class: 'fx-stat__act' }, h('button', {
+      class: 'fx-btn fx-btn--primary', type: 'button',
+      onclick: (event) => send(to, ready, body.sendMode, event.currentTarget),
+    }, lucide(h, 'send'), h('span', {}, 'Send'))) : null;
+    host.replaceChildren(...[
+      // A broken accounting connection shows at any count, not only with Ready.
+      blocked ? notice(sendModeNote(to, body.sendMode), 'warn') : null,
+      h('section', { class: 'fx-stats', 'aria-label': 'Invoices and jobs' },
+        card({ key: 'ready', href: '/invoices?tab=ready', label: 'Ready', tone: 'accent', count: ready, sum: body.totalCents }, sendButton),
+        items.map((item) => card(item)))].filter(Boolean));
   }
 
   function open(event) {

package/server/ui/invoicing.js

@@ -18,6 +18,7 @@ import { fieldGroup, fieldIdOf, filterCount, filterJobs, INVOICE_COLUMNS, invoic
 import { INVOICE_FILTER_FIELDS, INVOICE_FILTER_STATUSES, invoiceFilterKind, invoiceKindOf, invoiceValue, normaliseInvoicesView } from '/assets/ui/list-views.js';
 import { listPager, pager, PAGE_SIZES } from '/assets/ui/pager.js';
 import { savedViews } from '/assets/ui/saved-views.js';
+import { problemPrompt } from '/assets/ui/problem-prompt.js';
 import { xeroContactActions } from '/assets/ui/xero-contact.js';
 import { findBox, today, viewBar } from '/assets/ui/view-bar.js';
 
@@ -1288,6 +1289,9 @@ function draftView(invoice, ui, context, redraw) {
     ? notice([...new Set(otherProblems.map((p) => brief(p.message)))].join(' '), 'danger', 'Problem.', { short: shorts })
     : null;
   const organisationId = context.organisations[0]?.id;
+  // "Copy prompt": the full detail for a connected agent, built at the click.
+  const prompt = () => problemPrompt({ origin: location.origin, invoice, change: jobChange, organisationId });
+  const copyPrompt = () => ui.copyButton({ label: 'Copy prompt', text: prompt, copied: 'Prompt copied. Paste it to your agent.' });
   // Link or Create the Xero client, then the invoice is checked again.
   const clientActions = offer && context.canIssue && invoice?.contact?.id && organisationId
     ? xeroContactActions(ui, {
@@ -1339,10 +1343,10 @@ function draftView(invoice, ui, context, redraw) {
   const problems = [
     holdReview,
     // Accepting changes the draft for the business: owners and admins only.
-    jobChange ? jobChangeReview(ui, jobChange, { money: formatCents, canAccept: context.canIssue, unsaved: changed, done: redraw }) : null,
+    jobChange ? jobChangeReview(ui, jobChange, { money: formatCents, canAccept: context.canIssue, unsaved: changed, done: redraw, prompt }) : null,
     problemList.some(deferredJobReview) ? notice('The job also changed after this invoice was made. Resolve the source amount problem first. Select Recheck, then review the remaining job changes.', 'danger') : null,
     unavailable.length ? notice('The resolution view is unavailable. Ask an administrator to restore it, then reopen this invoice. It remains Pending.', 'danger', 'Cannot resolve.') : null,
-    problemNotice ? (clientActions.length || ruleActions.length ? h('div', { class: 'fx-offer' }, problemNotice, ...clientActions, ...ruleActions) : problemNotice) : null,
+    problemNotice ? h('div', { class: 'fx-offer' }, problemNotice, ...clientActions, ...ruleActions, jobChange ? null : copyPrompt()) : null,
   ];
   // A red field names the banner as its reason (for a screen reader).
   const banner = problemNotice;