@arcforgelabs/flow 2026.10.53 → 2026.11.1

package/server/db/migrations/meta/_journal.json

@@ -176,6 +176,20 @@
       "when": 1793233782043,
       "tag": "0024_rule_icon",
       "breakpoints": true
+    },
+    {
+      "idx": 25,
+      "version": "7",
+      "when": 1793972387349,
+      "tag": "0025_powerful_leopardon",
+      "breakpoints": true
+    },
+    {
+      "idx": 26,
+      "version": "7",
+      "when": 1794019099844,
+      "tag": "0026_bitter_sersi",
+      "breakpoints": true
     }
   ]
 }

package/server/db/schema.js

@@ -112,7 +112,8 @@ export const invoices = pgTable('invoices', {
   readyAt: timestamp('ready_at', { withTimezone: true }),
   readyBy: uuid('ready_by').references(() => people.id, { onDelete: 'set null' }),
   // Sending to the accounting system (server/core/sending.js): queued by a
-  // person, then sent or failed. `sendError` is { code, message } while failed.
+  // person, then sent or failed. `sendError` is { code, message, short?, xero? }
+  // while failed. `xero` is the matched invoice { invoiceId, number, status }.
   sendState: text('send_state'),
   sendError: jsonb('send_error'),
   sendRequestedBy: uuid('send_requested_by').references(() => people.id, { onDelete: 'set null' }),
@@ -259,6 +260,8 @@ export const billingObligations = pgTable('billing_obligations', {
   // The lines as the work system reported them, normalised.
   lines: jsonb('lines').notNull().default(sql`'[]'::jsonb`),
   lineFingerprint: text('line_fingerprint').notNull(),
+  // Exact source aggregates for a job billed alone. Missing fields are unknown.
+  sourceTotals: jsonb('source_totals'),
   subtotalCents: integer('subtotal_cents').notNull(),
   taxCents: integer('tax_cents').notNull(),
   totalCents: integer('total_cents').notNull(),
@@ -908,3 +911,37 @@ export const captures = pgTable('captures', {
   check('captures_sha256_valid', sql`${t.fileSha256} ~ '^[0-9a-f]{64}$'`),
   check('captures_problem_valid', sql`${t.problem} is null or length(${t.problem}) between 1 and 200`),
 ]);
+
+// A read grant binds one person and client to one installation and organisation.
+export const agentGrants = pgTable('agent_grants', {
+  id: id(),
+  personId: uuid('person_id').notNull().references(() => people.id, { onDelete: 'cascade' }),
+  clientId: text('client_id').notNull(),
+  appName: text('app_name').notNull(),
+  resource: text('resource').notNull(),
+  organisationId: organisationId().references(() => organisations.id),
+  accessLevel: text('access_level').notNull().default('read'),
+  createdAt: createdAt(),
+  lastUsedAt: timestamp('last_used_at', { withTimezone: true }),
+  revokedAt: timestamp('revoked_at', { withTimezone: true }),
+  failureDay: date('failure_day'),
+  failureCount: integer('failure_count').notNull().default(0),
+  pausedAt: timestamp('paused_at', { withTimezone: true }),
+}, (t) => [
+  unique('agent_grants_person_client_resource').on(t.personId, t.clientId, t.resource),
+  check('agent_grants_read_only', sql`access_level = 'read'`),
+]);
+
+// No arguments, token, source evidence, error text or patient data belongs here.
+// Historical UUID snapshots deliberately have no foreign keys: removing a
+// person or grant must not erase or rewrite the retained read history.
+export const agentAudit = pgTable('agent_audit', {
+  id: id(),
+  createdAt: createdAt(),
+  grantId: uuid('grant_id').notNull(),
+  personId: uuid('person_id').notNull(),
+  tool: text('tool').notNull(),
+  status: integer('status').notNull(),
+  rowCount: integer('row_count').notNull().default(0),
+  durationMs: integer('duration_ms').notNull(),
+}, (t) => [index('agent_audit_created').on(t.createdAt)]);

package/server/index.js

@@ -1,5 +1,7 @@
 #!/usr/bin/env node
 import { createApp } from './app.js';
+import { createMcpVerifier } from './agents/auth.js';
+import { resolveMcpSettings } from './agents/settings.js';
 import { createClerkProxy, ensureClerkAccount, loadClerkAdapter, resolveClerkProxyPath } from './auth/clerk.js';
 import { seedFirstOwner } from './auth/people.js';
 import { createPersonAuth } from './auth/session.js';
@@ -31,8 +33,14 @@ const port = Number(process.env.FLOW_PORT || process.env.PORT || 19300);
 
 // Settings first: a malformed setting stops boot before anything runs.
 let settings;
+let mcp;
 try {
   settings = resolveSignInSettings();
+  const mcpSettings = resolveMcpSettings();
+  if (mcpSettings) {
+    if (settings.mode !== 'clerk') throw new Error('MCP requires FLOW_AUTH=clerk');
+    mcp = { ...mcpSettings, publishableKey: settings.keys.publishableKey, verify: createMcpVerifier({ keys: settings.keys, ...mcpSettings }) };
+  }
 } catch (error) {
   console.error(`[auth] ${error.message}`);
   process.exit(1);
@@ -201,7 +209,7 @@ const trustProxy = process.env.REPL_ID || process.env.REPLIT_DEPLOYMENT ? 1 : fa
 const updates = createUpdateChecker();
 
 createApp({
-  database, schemaJournals: expectedSchema({ adapters: shippedAdapters }).journals, auth, trustProxy, updates, integrations, secrets, defaultFamily, log, tracing, storage,
+  database, mcp, schemaJournals: expectedSchema({ adapters: shippedAdapters }).journals, auth, trustProxy, updates, integrations, secrets, defaultFamily, log, tracing, storage,
   publicOrigin: process.env.FLOW_PUBLIC_ORIGIN,
   reader: reader ? { on: true, schedule: reader.schedule } : null,
 }).listen(port, () => {

package/server/integrations/port.js

@@ -24,6 +24,7 @@ export const CAPABILITIES = Object.freeze([
   'pullPayments', // payments since a cursor, matched to invoices and bills
   'checkInvoice', // does the accounting system hold an invoice for a billable job? (the ledger's liveCheck)
   'billableJobs', // billable jobs by day from the work system's copy in Flow, for the daily reconcile; never a live call
+  'workJobPresence', // { organisationId, jobRefs } -> { presentRefs }: requested jobs still present in the work copy, without status, date or line filters; deleted jobs are absent; never a live call
   'jobReferenceFields', // { patient }: the fields a job gives the invoice Reference (server/core/references.js)
   'jobLink', // { url, exact } or null: the link to one job in the work system's own web app, for "Open in" on a job's problem; never a live call
   'listWork', // the work system's jobs from its copy in Flow, open and lately finished, for the Jobs board; a job may carry `pendingMove`

package/server/integrations/seazona/history/backfill.js

@@ -78,7 +78,7 @@ export async function stopBackfill(db, { now = Date.now } = {}) {
   const [state] = await db.select().from(seazonaLaneState).where(eq(seazonaLaneState.lane, LANE));
   const cursor = state?.cursor;
   if (!cursor?.batchId || cursor.done) throw Object.assign(new FlowError('conflict', 'No history backfill is running'), { status: 409 });
-  const stopped = { ...cursor, done: true, stopped: true };
+  const stopped = { ...cursor, done: true, stopped: true, endedAt: at.toISOString() };
   await db.update(seazonaLaneState).set({ cursor: stopped, updatedAt: at }).where(eq(seazonaLaneState.lane, LANE));
   await finishApiBatch(db, cursor.batchId, { at });
   return describeBackfill(stopped);
@@ -91,6 +91,7 @@ export function describeBackfill(cursor) {
     from: cursor.from,
     through: cursor.through,
     startedAt: cursor.startedAt ?? null,
+    endedAt: cursor.endedAt ?? null,
     nextDay: cursor.done ? null : cursor.nextDay,
     // The day whose orders it reads now: the last day listed while orders
     // from it wait, else the next day to list.
@@ -160,6 +161,7 @@ export async function runHistoryBackfill(ctx, { isLaneLevel, describeReadFailure
       if (!cursor.pending.length) {
         if (cursor.nextDay > cursor.through) {
           cursor.done = true;
+          cursor.endedAt = new Date(at).toISOString();
           break;
         }
         calls += 1;

package/server/integrations/seazona/history/index.js

@@ -2,6 +2,7 @@ import { createHash } from 'node:crypto';
 import { and, asc, desc, eq, gt, inArray, sql } from 'drizzle-orm';
 import { FlowError } from '../../../core/errors.js';
 import { listClients } from '../feed.js';
+import { ledgerLine } from '../ledger.js';
 import { hashOf, parseSeazonaDate, text } from '../map.js';
 import {
   seazonaClients,
@@ -517,13 +518,9 @@ export async function readHistoryWork(db, { cursor = null, limit = 200 } = {}) {
         shippedOn: job.shippedDate,
         jobDate: job.jobDate ?? job.dueDate ?? job.shippedDate,
         sourceStatus: job.status,
-        lines: (job.lines ?? []).map((l) => ({
-          itemCode: l.code ?? null,
-          description: l.description,
-          quantity: 1,
-          unitAmountCents: l.amountCents ?? undefined,
-          taxCode: typeof l.taxable === 'boolean' ? (l.taxable ? 'GST' : 'GST_FREE') : undefined,
-        })),
+        lines: (job.lines ?? []).map(ledgerLine),
+        // The CSV reports a total, but no invoice tax allocation.
+        sourceTotals: job.totalCents == null ? null : { totalCents: job.totalCents },
         observedAt: job.lastChangedAt.toISOString(),
         actor: 'seazona:history_import',
       },

package/server/integrations/seazona/index.js

@@ -4,7 +4,7 @@ import { createSeazonaClient } from './client.js';
 import { listClients, listProducts, listWork, readBillableWork } from './feed.js';
 import { historyJobIssues, historySummary, readHistoryWork } from './history/index.js';
 import { readSeazonaSyncHealth, runSeazonaSync } from './lanes.js';
-import { readBillableJobs } from './reconcile.js';
+import { readBillableJobs, readWorkJobPresence } from './reconcile.js';
 import { SEAZONA_CALL_GUARD } from './governor.js';
 import { createSeazonaRouter } from './routes.js';
 import {
@@ -200,6 +200,10 @@ export function createSeazonaAdapter({ env = null, fetchImpl = null, now = Date.
         return readBillableJobs(current().db, { from, to });
       },
 
+      async workJobPresence({ jobRefs }) {
+        return readWorkJobPresence(current().db, { jobRefs });
+      },
+
       // Seazona clients by id and company name, for the identity map. Reads
       // Flow's copy only.
       async listCustomers() {

package/server/integrations/seazona/lanes.js

@@ -430,47 +430,62 @@ const laneRuns = {
 
   async orders_recent(ctx) {
     const { db, client, sync, at } = ctx;
-    const nowMs = at.getTime();
-    const lookbackStart = floorUtcDay(nowMs - sync.orderLookbackDays * DAY_MS);
-    const doneThrough = Date.parse(ctx.state?.cursor?.completedThrough ?? '');
-    const partial = ctx.state?.cursor?.partial;
-    const partialDay = Date.parse(partial?.day ?? '');
-    // Go on inside a day a run did not finish; otherwise re-read the last
-    // finished day as well, so late orders on it are seen.
-    const resumeInside = Number.isFinite(partialDay) && partialDay >= lookbackStart;
-    const resume = resumeInside ? partialDay : Number.isFinite(doneThrough) ? Math.max(lookbackStart, doneThrough) : lookbackStart;
-
-    // Issue #125: the list is paged (page, pageSize). A full page goes on to
-    // the next page; a short page, or a page past the day, ends the day. The
-    // guide says the list answers orders on or after `ordered`; a list that
-    // answers one day works the same way.
+    const today = floorUtcDay(at.getTime());
+    const lookbackStart = today - sync.orderLookbackDays * DAY_MS;
+    const cursor = ctx.state?.cursor ?? {};
+    const doneThrough = Date.parse(cursor.completedThrough ?? '');
+    const partialDay = Date.parse(cursor.partial?.day ?? '');
+    const todayPartialDay = Date.parse(cursor.todayPartial?.day ?? '');
+    let partial = partialDay >= lookbackStart && partialDay < today ? cursor.partial : null;
+    // A partial newest day becomes an older day at midnight. Keep its page
+    // unless an older partial already owns the rolling walk; that walk will
+    // revisit the former newest day on its next cycle too.
+    if (!partial && todayPartialDay >= lookbackStart && todayPartialDay < today) partial = cursor.todayPartial;
+    let resume = partial ? Date.parse(partial.day) : Number.isFinite(doneThrough) ? Math.max(lookbackStart, floorUtcDay(doneThrough) + DAY_MS) : lookbackStart;
+    if (resume >= today) resume = lookbackStart;
+
+    // Give today and the rolling previous-day walk a share of the existing
+    // budgets. With only one day or call available, alternate them instead
+    // of permanently starving either. Missing fields migrate naturally.
+    const single = sync.listPagesPerRun === 1 || sync.orderDaysPerRun === 1;
+    const readToday = !single || !cursor.historyNext;
     const pageSize = Math.min(ORDER_PAGE_MAX, sync.listCap);
     const byId = new Map();
     const days = [];
     let calls = 0;
     let lastDone = null;
-    let stoppedAt = null;
-    for (let day = floorUtcDay(resume); day <= floorUtcDay(nowMs) && days.length < sync.orderDaysPerRun && !stoppedAt; day += DAY_MS) {
+    let stoppedAt = partial;
+    let todayPartial = todayPartialDay === today ? cursor.todayPartial : partialDay === today ? cursor.partial : null;
+    async function readDay(day, progress, callLimit) {
       const label = `order list for ${formatOrderedDay(day)}`;
-      let page = resumeInside && day === floorUtcDay(resume) ? Math.max(1, Number(partial.page) || 1) : 1;
-      let previous = null;
-      for (;;) {
-        if (calls >= sync.listPagesPerRun) {
-          stoppedAt = { day, page };
-          break;
-        }
+      let page = Math.max(1, Number(progress?.page) || 1);
+      // Keep at most one page of IDs in the existing cursor, so splitting
+      // the budget never disables the guard against an API ignoring page.
+      let previous = progress?.previousIds ? new Set(progress.previousIds) : null;
+      while (calls < callLimit) {
         calls += 1;
         if (!days.includes(day)) days.push(day);
         const list = listOrFail(await client.get('orders/', { ordered: formatOrderedDay(day), page, pageSize }), label);
         const ids = list.map((item) => text(item?.id)).filter(Boolean);
-        // A Seazona that does not page answers the same rows again.
         if (previous && ids.length && ids.every((id) => previous.has(id))) throw cannotGoOn(label, sync, 'the next page answers the same orders');
         for (const item of list) if (text(item?.id)) byId.set(text(item.id), item);
-        if (list.length < pageSize || placedAfter(list[list.length - 1], day + DAY_MS)) break;
+        // The guide's on-or-after lists and single-day lists both work.
+        if (list.length < pageSize || placedAfter(list[list.length - 1], day + DAY_MS)) return null;
         previous = new Set(ids);
         page += 1;
       }
-      if (!stoppedAt) lastDone = day;
+      return { day: new Date(day).toISOString(), page, previousIds: [...previous] };
+    }
+    if (readToday) {
+      const todayCalls = single ? sync.listPagesPerRun : Math.ceil(sync.listPagesPerRun / 2);
+      todayPartial = await readDay(today, todayPartial, todayCalls);
+    }
+    if (!single || !readToday) {
+      for (let day = resume; day < today && days.length < sync.orderDaysPerRun && calls < sync.listPagesPerRun; day += DAY_MS) {
+        stoppedAt = await readDay(day, day === resume ? partial : null, sync.listPagesPerRun);
+        if (stoppedAt) break;
+        lastDone = day;
+      }
     }
     const known = await readKnown(db, 'orders', [...byId.keys()]);
     const summary = { created: 0, changed: 0, unchanged: 0 };
@@ -506,7 +521,9 @@ const laneRuns = {
       cursorTime: through === null ? ctx.state?.cursorTime ?? null : new Date(through),
       cursor: {
         ...(through === null ? {} : { completedThrough: new Date(through).toISOString() }),
-        ...(stoppedAt ? { partial: { day: new Date(stoppedAt.day).toISOString(), page: stoppedAt.page } } : {}),
+        ...(stoppedAt ? { partial: stoppedAt } : {}),
+        ...(todayPartial ? { todayPartial } : {}),
+        ...(single ? { historyNext: readToday } : {}),
       },
     };
   },

package/server/integrations/seazona/ledger.js

@@ -11,15 +11,16 @@
 
 export const SEAZONA_SOURCE_SYSTEM = 'seazona';
 
-function ledgerLine(line) {
+export function ledgerLine(line) {
   return {
     // The ledger maps a line to a price item by its exact code only.
     itemCode: line.code ?? null,
     description: line.description,
     quantity: 1,
-    // Unknown amount or tax: the price item with the same code fills them.
+    // A mapped price item can fill unknown amounts or tax.
+    // Explicit null tax must not take the legacy GST default.
     unitAmountCents: line.amountCents ?? undefined,
-    taxCode: typeof line.taxable === 'boolean' ? (line.taxable ? 'GST' : 'GST_FREE') : undefined,
+    taxCode: typeof line.taxable === 'boolean' ? (line.taxable ? 'GST' : 'GST_FREE') : null,
   };
 }
 
@@ -37,6 +38,14 @@ export function ledgerLinesFor(item) {
 // `observedAt` is the last successful read from Seazona, so the ledger's
 // out-of-date check measures how old Seazona's report really is.
 export function toLedgerJob(item) {
+  const { lines } = ledgerLinesFor(item);
+  // Totals remain evidence when an invoice has no lines.
+  // A shared invoice cannot supply one job's totals. Never split its tax.
+  const sourceTotals = item.invoice && item.invoiceOrderCount === 1 ? {
+    subtotalCents: item.invoice.subtotalCents ?? null,
+    taxCents: item.invoice.taxCents ?? null,
+    totalCents: item.invoice.totalCents ?? null,
+  } : null;
   return {
     sourceSystem: SEAZONA_SOURCE_SYSTEM,
     sourceJobRef: item.sourceId,
@@ -44,13 +53,15 @@ export function toLedgerJob(item) {
     // The Seazona order id is the case number. Never patient data.
     caseRef: item.sourceId,
     practitioner: item.doctorName ?? null,
-    // The Seazona API gives a shipped status but no shipped date.
-    shippedOn: null,
+    // The Seazona API gives a shipped status but no shipped date: the
+    // ledger keeps the day it first sees the job shipped.
+    shipped: item.shipped === true,
     // The day of the work, for matching it to its accounting invoice.
     jobDate: item.invoice?.invoiceDate ?? item.dueOn ?? item.orderedOn ?? null,
     // The draft rules bill only the statuses the lab chose (for example Shipped).
     sourceStatus: item.status ?? null,
-    lines: ledgerLinesFor(item).lines,
+    lines,
+    sourceTotals,
     observedAt: item.syncedAt,
     actor: SEAZONA_SOURCE_SYSTEM,
   };

package/server/integrations/seazona/reconcile.js

@@ -1,4 +1,16 @@
+import { and, inArray, isNull } from 'drizzle-orm';
 import { readBillableWork } from './feed.js';
+import { seazonaOrders } from './schema.js';
+
+// Presence is not billing eligibility. Keep a job that returned to an open
+// status, lost its lines, or changed its date separate from a missing job.
+export async function readWorkJobPresence(db, { jobRefs }) {
+  if (!jobRefs.length) return { presentRefs: [] };
+  const rows = await db.select({ ref: seazonaOrders.id }).from(seazonaOrders).where(and(
+    inArray(seazonaOrders.id, jobRefs), isNull(seazonaOrders.deletedInSourceAt),
+  ));
+  return { presentRefs: rows.map((row) => row.ref) };
+}
 
 // The billable jobs in Flow's copy of Seazona, by day, behind the port's
 // `billableJobs` (the daily reconcile, server/core/reconcile.js). It walks the

package/server/rate-limit.js

@@ -4,12 +4,13 @@ import expressRateLimit from 'express-rate-limit';
 // Express's `trust proxy`). In memory: one Flow process serves one lab. Each
 // call makes its own counter. Built on express-rate-limit, which CodeQL
 // recognises as rate limiting (js/missing-rate-limiting).
-export function rateLimit({ limit, windowMs }) {
+export function rateLimit({ limit, windowMs, ...options }) {
   return expressRateLimit({
     limit,
     windowMs,
     standardHeaders: 'draft-8', // RateLimit-Policy, RateLimit and Retry-After
     legacyHeaders: false,
     handler: (_req, res) => res.status(429).json({ ok: false, code: 'rate_limited', error: 'Too many requests. Wait and try again.' }),
+    ...options,
   });
 }

package/server/ui/app.js

@@ -20,6 +20,7 @@ import { renderCustomFields } from '/assets/ui/custom-fields.js';
 import { renderJobs } from '/assets/ui/jobs.js';
 import { renderReconcile } from '/assets/ui/reconcile.js';
 import { renderXeroImport } from '/assets/ui/xero-import.js';
+import { syncStatus } from '/assets/ui/sync-status.js';
 import { xeroUsage } from '/assets/ui/xero-usage.js';
 import { startMonitoring } from '/assets/ui/monitoring.js';
 import { isSearchKey, openSearch } from '/assets/ui/search.js';
@@ -998,74 +999,79 @@ function seazonaHistorySection() {
   const canAct = ['owner', 'admin'].includes(me?.person?.role);
   const yearAgo = new Date(Date.now() - 365 * 86_400_000).toISOString().slice(0, 10);
   const from = h('input', { class: 'fx-input fx-history__day', type: 'date', 'aria-label': 'Read from', value: yearAgo, disabled: !canAct });
-  const status = h('span', { class: 'fx-history__status' }, 'Checking…');
-  const control = h('span', { class: 'fx-row' });
-  const bar = h('progress', { class: 'fx-history__bar', max: 1, value: 0, 'aria-label': 'Read so far' });
-  const barRow = settingRow({ label: 'Progress', hint: h('span', {}), control: bar, wide: true });
-  barRow.hidden = true;
-  const day = (value) => new Date(`${value}T00:00:00Z`).toLocaleDateString('en-AU', { dateStyle: 'medium', timeZone: 'UTC' });
-  const section = h('section', { class: 'fx-set fx-int-section fx-card', style: { padding: '8px 20px 16px' } },
-    h('h2', { class: 'fx-set__title' }, 'History'),
-    settingRow({ label: 'Read from', hint: status, help: 'Reads past Seazona orders into Flow, 10 every 2 minutes. Orders Flow read before are skipped. Each job waits on hold and never drafts by itself.', control }),
-    barRow);
-  let timer = null;
-  let tick = null;
-  const press = async (button, path, body) => {
+  const sync = syncStatus();
+  const fromRow = settingRow({ label: 'Read from', help: 'Reads past Seazona orders into Flow. Orders Flow read before are skipped. Each job waits on hold and never drafts by itself.', control: from });
+  const section = h('section', { class: 'fx-set fx-int-section fx-card fx-history' },
+    h('h2', { class: 'fx-set__title' }, 'History'), fromRow, sync.element);
+  let timer;
+  let pending = false;
+  let run = null;
+  let mounted = false;
+  let disposed = false;
+  let loaded = false;
+  const active = () => ['running', 'waiting'].includes(run?.phase);
+  const schedule = () => {
+    clearTimeout(timer);
+    if (!disposed && !document.hidden && active()) timer = setTimeout(load, 5000);
+  };
+  const press = async (button, label) => {
     button.disabled = true;
+    clearTimeout(timer);
     try {
-      await flow(path, { method: 'POST', ...(body ? { body: JSON.stringify(body) } : {}) });
-      toast(body ? 'History read started.' : 'History read stopped.', 'success');
-    } catch (error) {
-      toast(error.message, 'danger');
-      if (error.retryAfterMs) holdButton(button, error.retryAfterMs);
-    }
-    load();
+      let resume = run?.resumeFrom;
+      if (label === 'Stop' || label === 'Retry') {
+        const stopped = await flow('/api/seazona/history/backfill/stop', { method: 'POST' });
+        resume = stopped.backfill?.resumeFrom;
+      }
+      if (label !== 'Stop') await flow('/api/seazona/history/backfill', {
+        method: 'POST', body: JSON.stringify(label === 'Resume' || label === 'Retry'
+          ? { from: resume ?? run.from, through: run.through } : { from: from.value }),
+      });
+      toast(label === 'Stop' ? 'History read stopped.' : 'History read started.', 'success');
+    } catch (error) { toast(error.message, 'danger'); }
+    loaded = false;
+    await load();
   };
-  const start = (label, body, primary = true) => h('button', {
-    class: `fx-btn fx-btn--sm${primary ? ' fx-btn--primary' : ''}`, type: 'button', disabled: !canAct,
-    onclick: (event) => press(event.currentTarget, '/api/seazona/history/backfill', body()),
-  }, label);
+  let actionLabel;
+  const actionButton = h('button', { class: 'fx-btn fx-btn--sm', type: 'button', onclick: event => press(event.currentTarget, actionLabel) });
   const load = async () => {
     clearTimeout(timer);
-    clearInterval(tick);
-    if (!section.isConnected && timer !== null) return;
-    let body;
+    if (disposed || pending || document.hidden) return;
+    pending = true;
     try {
-      body = await flow('/api/seazona/history');
+      const body = await flow('/api/seazona/history');
+      if (disposed) return;
+      loaded = true;
+      run = body.backfill;
+      fromRow.hidden = Boolean(run && run.phase !== 'done');
+      const label = !run ? 'Start' : ({ running: 'Stop', waiting: 'Stop', stopped: run.resumeFrom ? 'Resume' : 'Again', failed: 'Retry', done: 'Again' }[run.phase]);
+      actionLabel = label;
+      actionButton.textContent = label;
+      actionButton.disabled = !canAct;
+      sync.draw({
+        phase: run?.phase ?? 'not-started', startedAt: run?.startedAt, endedAt: run?.endedAt,
+        count: body.history.jobs, unit: 'jobs', from: run?.from, through: run?.through,
+        at: run?.readingDay ?? run?.resumeFrom ?? run?.through,
+        cause: run?.cause, nextRunAt: run?.nextRunAt,
+      }, actionButton);
     } catch (error) {
-      status.replaceChildren(error.message);
-      return;
-    }
-    const run = body.backfill;
-    barRow.hidden = !run;
-    if (run) {
-      const span = Date.parse(run.through) - Date.parse(run.from) + 86_400_000;
-      const at = run.running ? run.readingDay ?? run.through : run.resumeFrom ?? run.through;
-      bar.value = run.running || run.resumeFrom ? Math.min(1, Math.max(0, (Date.parse(at) - Date.parse(run.from)) / span)) : 1;
-      barRow.querySelector('.fx-setting__hint').replaceChildren(`${day(run.from)} to ${day(run.through)}`);
-    }
-    if (run?.running) {
-      const what = { waiting: 'Waiting', failed: 'Failed' }[run.phase] ?? `Reading ${day(run.readingDay ?? run.through)}`;
-      const reading = `${what} · ${run.ordersRead} read${run.waitingToRead ? ` · ${run.waitingToRead} to read` : ''}`;
-      const next = h('span', { class: 'fx-dim' });
-      const count = () => {
-        const left = Math.round((Date.parse(run.nextRunAt) - Date.now()) / 1000);
-        next.replaceChildren(left > 0 ? `· ${run.phase === 'running' ? 'next' : 'retry'} in ${Math.floor(left / 60)}:${String(left % 60).padStart(2, '0')}` : '· reading now');
-      };
-      if (run.nextRunAt && run.phase !== 'failed') { count(); tick = setInterval(count, 1000); }
-      status.replaceChildren(
-        run.phase === 'running' ? h('span', { class: 'fx-spinner fx-spinner--sm', 'aria-hidden': 'true' }) : '',
-        reading, next, run.cause ? h('span', { class: 'fx-dim' }, `· ${run.cause}`) : '');
-      control.replaceChildren(h('button', { class: 'fx-btn fx-btn--sm', type: 'button', disabled: !canAct, onclick: (event) => press(event.currentTarget, '/api/seazona/history/backfill/stop') }, 'Stop'));
-    } else if (run?.resumeFrom) {
-      status.replaceChildren(`Stopped at ${day(run.resumeFrom)} · ${run.ordersRead} read`);
-      control.replaceChildren(from, start('Start', () => ({ from: from.value }), false), start('Resume', () => ({ from: run.resumeFrom, through: run.through })));
-    } else {
-      status.replaceChildren(run ? `Done · ${run.ordersRead} read` : 'Not started');
-      control.replaceChildren(from, start('Start', () => ({ from: from.value })));
-    }
-    timer = setTimeout(() => { if (section.isConnected && run?.running) load(); }, 5_000);
+      sync.draw({ phase: 'failed', cause: 'Could not check progress. Try again.' }, h('button', { class: 'fx-btn fx-btn--sm', type: 'button', onclick: load }, 'Retry'));
+    } finally { pending = false; schedule(); }
   };
+  const visible = () => { clearTimeout(timer); if (!document.hidden && (!loaded || active())) load(); };
+  document.addEventListener('visibilitychange', visible);
+  const observer = new MutationObserver(() => {
+    if (section.isConnected) mounted = true;
+    else if (mounted) {
+      disposed = true;
+      clearTimeout(timer);
+      sync.dispose();
+      document.removeEventListener('visibilitychange', visible);
+      observer.disconnect();
+    }
+  });
+  observer.observe(document.body, { childList: true, subtree: true });
+  sync.draw({ phase: 'loading' });
   load();
   return section;
 }
@@ -1331,11 +1337,17 @@ drawModeToggles();
 // ── Start ──────────────────────────────────────────────────────────────────
 
 // Clerk's words where they name the app: the installation is Flow, whatever
-// the Clerk instance is called.
+// the Clerk instance is called. With sign-up on, Clerk shows the combined
+// sign-in-or-up form, which reads the *Combined keys.
 const LOCALIZATION = {
   signIn: {
     // titleCombined is the sign-in-or-sign-up screen (public sign-up on).
-    start: { title: 'Sign in', titleCombined: 'Sign in', subtitle: '' },
+    start: {
+      title: 'Sign in to Flow',
+      subtitle: 'Choose how to sign in.',
+      titleCombined: 'Sign in to Flow',
+      subtitleCombined: 'Choose how to sign in.',
+    },
     password: { subtitle: 'Enter the password for your account.' },
   },
   signUp: { start: { title: 'Ask for access to Flow', subtitle: 'Use your work email. An owner approves new people.' } },

package/server/ui/flow.css

@@ -639,9 +639,13 @@ a.fx-strong:hover { text-decoration: underline; }
 .fx-pop__tick { display: inline-grid; place-items: center; flex: none; width: 16px; height: 16px; color: var(--t-accent); }
 .fx-pop__sep { height: 1px; margin: 6px 4px; background: var(--fx-line-soft); }
 /* A row with a trailing control (the sidebar pin). The control does not
-   close the menu. An unpinned pin shows when the pointer is on the row. */
-.fx-pop__row { display: flex; align-items: center; gap: 2px; }
+   close the menu. An unpinned pin shows when the pointer is on the row.
+   The whole row lights on hover; the pin under the pointer goes back to the
+   menu's own colour, so both read. */
+.fx-pop__row { display: flex; align-items: center; gap: 2px; padding-right: 4px; border-radius: var(--t-radius); }
+.fx-pop__row:hover, .fx-pop__row:has(:focus-visible) { background: var(--fx-hover); }
 .fx-pop__row > .fx-pop__item { flex: 1; min-width: 0; }
+.fx-pop__row > .fx-pop__item:is(:hover, :focus-visible) { background: none; }
 .fx-pop__row > .fx-pop__item > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .fx-pop__pin, .fx-pop__pin--fixed {
   display: inline-grid; place-items: center; flex: none; width: 28px; height: 28px;
@@ -654,13 +658,14 @@ a.fx-strong:hover { text-decoration: underline; }
 .fx-pop__row:focus-within .fx-pop__pin[aria-pressed="false"],
 .fx-pop__pin:focus-visible { opacity: 1; }
 .fx-pop__pin[aria-pressed="true"], .fx-pop__pin--fixed { color: var(--t-strong); opacity: 1; }
-.fx-pop__pin:hover, .fx-pop__pin:focus-visible { background: var(--fx-hover); color: var(--t-strong); outline: none; }
+.fx-pop__pin:hover, .fx-pop__pin:focus-visible { background: var(--t-paper); color: var(--t-strong); outline: none; }
 .fx-pop.fx-pop--side { min-width: 240px; }
 .fx-pop--side .fx-pop__tick { color: inherit; }
 @media (hover: none) { .fx-pop__pin[aria-pressed="false"] { opacity: 1; } }
 @media (max-width: 820px) {
   .fx-pop--side .fx-pop__item { min-height: 44px; }
   .fx-pop--side .fx-pop__pin, .fx-pop--side .fx-pop__pin--fixed { width: 44px; height: 44px; }
+  .fx-pop--side .fx-pop__row { padding-right: 0; }
 }
 .fx-pop__foot { display: flex; justify-content: flex-end; padding: 6px 4px 2px; border-top: 1px solid var(--fx-line-soft); margin-top: 6px; }
 /* A chip with an × that clears it (as ClickUp's "Clear all filters"). */
@@ -1287,9 +1292,32 @@ body[data-state="loading"] .fx-loading { display: grid; justify-items: center; }
 .fx-setting__head { display: flex; align-items: center; gap: 2px; min-width: 0; }
 .fx-setting__head .fx-help { margin: -4px 0; border: 0; background: none; cursor: pointer; }
 .fx-setting__hint { margin: 0; color: var(--t-dim); font-size: 13px; line-height: 1.45; }
-.fx-history__status { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
 .fx-history__day { width: 160px; flex: none; }
-.fx-history__bar { width: 100%; height: 8px; accent-color: var(--t-brand); }
+/* SyncStatus: Layers, shared by integration history readers. */
+.fx-history { padding: 8px 20px 16px; }
+.fx-sync { min-width: 0; padding-block: 8px; }
+.fx-sync__line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
+.fx-sync__status { min-width: 0; overflow-wrap: anywhere; color: var(--t-text); font-size: 13px; }
+.fx-sync__word { position: relative; display: inline-block; overflow: hidden; vertical-align: bottom; }
+.fx-sync[data-phase="running"] .fx-sync__word::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, var(--t-paper), transparent); opacity: .5; transform: translateX(-100%); animation: fx-sync-sweep 2.6s linear infinite; }
+.fx-sync[data-phase="failed"] .fx-sync__word { color: var(--t-danger); }
+.fx-sync[data-phase="done"] .fx-sync__word { color: var(--t-success); }
+.fx-sync__clock { font: 12px var(--t-data); color: var(--t-dim); }
+.fx-sync__action { margin-left: auto; }
+.fx-sync__action .fx-btn { min-width: 44px; min-height: 44px; }
+.fx-sync__dots { display: inline-flex; gap: 3px; margin-right: 8px; vertical-align: middle; }
+.fx-sync__dots[hidden], .fx-sync__track[hidden] { display: none; }
+.fx-sync__dots i { width: 4px; height: 4px; border-radius: var(--t-radius); background: var(--t-accent); animation: fx-sync-breathe 1.8s ease-in-out infinite; }
+.fx-sync__dots i:nth-child(2) { animation-delay: .2s; }
+.fx-sync__dots i:nth-child(3) { animation-delay: .4s; }
+.fx-sync__track { display: grid; gap: 4px; margin-top: 8px; }
+.fx-sync__rail { width: 100%; height: 4px; accent-color: var(--t-brand); }
+.fx-sync__range { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; color: var(--t-dim); font-size: 12px; }
+@media (max-width: 639px) {
+  .fx-sync__line { gap: 4px 8px; }
+  .fx-sync__status { flex: 1 1 60%; }
+  .fx-sync__clock { order: 1; flex-basis: 100%; }
+}
 .fx-setting[data-tone="danger"] .fx-setting__hint { color: var(--t-danger); }
 .fx-setting__control { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-width: 0; }
 .fx-setting__control > .fx-input, .fx-setting__control > .fx-select, .fx-setting__stack { width: 320px; max-width: 100%; }
@@ -1539,9 +1567,12 @@ body[data-state="loading"] .fx-loading { display: grid; justify-items: center; }
 }
 
 @keyframes fx-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
+@keyframes fx-sync-breathe { 50% { opacity: .35; transform: scale(.75); } }
+@keyframes fx-sync-sweep { to { transform: translateX(100%); } }
 @keyframes fx-spin { to { transform: rotate(360deg); } }
 @keyframes fx-shimmer { to { background-position: -200% 0; } }
 @media (prefers-reduced-motion: reduce) {
+  .fx-sync__word::after { display: none; }
   *, *::before, *::after { animation: none !important; transition: none !important; }
 }