@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/_overview/kpi-row.js

@@ -0,0 +1,77 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { MoneyLines, StatCard, rowFor } from "../_ui";
+const integer = new Intl.NumberFormat();
+function KpiRow({
+  data,
+  currency,
+  focus,
+  compare,
+  caption
+}) {
+  const delta = (kpi) => compare ? { pct: kpi.pct, caption: "vs prior period" } : void 0;
+  const gmvKpi = rowFor(data.kpis.gmvByCurrency, focus);
+  const gmvSpark = rowFor(
+    data.trend.performanceSeriesByCurrency,
+    focus
+  )?.series.map((p) => p.gmv);
+  return /* @__PURE__ */ jsxs("section", { "aria-label": "Performance indicators", className: "adm-grid", children: [
+    /* @__PURE__ */ jsx("div", { className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "Merchant GMV",
+        value: /* @__PURE__ */ jsx(
+          MoneyLines,
+          {
+            rows: data.kpis.gmvByCurrency,
+            currency,
+            amount: (k) => k.current,
+            empty: "No sales yet"
+          }
+        ),
+        href: "/admin/revenue",
+        delta: gmvKpi ? delta(gmvKpi) : void 0,
+        sub: compare && gmvKpi ? void 0 : caption,
+        spark: gmvSpark,
+        hint: "Gross value of paid orders in the selected period, one line per currency. Currencies are never added together."
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "Orders",
+        value: integer.format(data.kpis.orders.current),
+        href: "/admin/revenue",
+        delta: delta(data.kpis.orders),
+        sub: compare ? void 0 : "Paid orders, all time",
+        spark: data.sparklines.orders,
+        hint: "Paid orders across all merchant workspaces, in every currency."
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "New workspaces",
+        value: integer.format(data.kpis.newTenants.current),
+        href: "/admin/tenants",
+        delta: delta(data.kpis.newTenants),
+        sub: compare ? void 0 : `${integer.format(data.totals.totalTenants)} in total`,
+        spark: data.sparklines.tenants
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "New accounts",
+        value: integer.format(data.kpis.newAccounts.current),
+        href: "/admin/accounts",
+        delta: delta(data.kpis.newAccounts),
+        sub: compare ? void 0 : `${integer.format(data.totals.totalAccounts)} in total`,
+        spark: data.sparklines.accounts
+      }
+    ) })
+  ] });
+}
+export {
+  KpiRow
+};
+//# sourceMappingURL=kpi-row.js.map

package/dist/admin/_overview/kpi-row.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_overview/kpi-row.tsx"],"sourcesContent":["import type { PlatformCockpit } from '@withpotter/lib/admin-api';\nimport { MoneyLines, StatCard, rowFor } from '../_ui';\n\nconst integer = new Intl.NumberFormat();\n\n/** The four headline figures for the window, each opening its page. */\nexport function KpiRow({\n  data,\n  currency,\n  focus,\n  compare,\n  caption,\n}: {\n  data: PlatformCockpit;\n  /** The currency filter's choice; empty shows a line per currency. */\n  currency: string;\n  /** The one currency the change and sparkline follow, or null with several. */\n  focus: string | null;\n  /** False for \"all time\": there is no earlier period to compare with. */\n  compare: boolean;\n  caption: string;\n}) {\n  const delta = (kpi: { pct: number | null }) =>\n    compare ? { pct: kpi.pct, caption: 'vs prior period' } : undefined;\n  // GMV's change and sparkline only mean something within one currency.\n  const gmvKpi = rowFor(data.kpis.gmvByCurrency, focus);\n  const gmvSpark = rowFor(\n    data.trend.performanceSeriesByCurrency,\n    focus,\n  )?.series.map((p) => p.gmv);\n\n  return (\n    <section aria-label=\"Performance indicators\" className=\"adm-grid\">\n      <div className=\"adm-span-3\">\n        <StatCard\n          label=\"Merchant GMV\"\n          value={\n            <MoneyLines\n              rows={data.kpis.gmvByCurrency}\n              currency={currency}\n              amount={(k) => k.current}\n              empty=\"No sales yet\"\n            />\n          }\n          href=\"/admin/revenue\"\n          delta={gmvKpi ? delta(gmvKpi) : undefined}\n          sub={compare && gmvKpi ? undefined : caption}\n          spark={gmvSpark}\n          hint=\"Gross value of paid orders in the selected period, one line per currency. Currencies are never added together.\"\n        />\n      </div>\n      <div className=\"adm-span-3\">\n        <StatCard\n          label=\"Orders\"\n          value={integer.format(data.kpis.orders.current)}\n          href=\"/admin/revenue\"\n          delta={delta(data.kpis.orders)}\n          sub={compare ? undefined : 'Paid orders, all time'}\n          spark={data.sparklines.orders}\n          hint=\"Paid orders across all merchant workspaces, in every currency.\"\n        />\n      </div>\n      <div className=\"adm-span-3\">\n        <StatCard\n          label=\"New workspaces\"\n          value={integer.format(data.kpis.newTenants.current)}\n          href=\"/admin/tenants\"\n          delta={delta(data.kpis.newTenants)}\n          sub={\n            compare\n              ? undefined\n              : `${integer.format(data.totals.totalTenants)} in total`\n          }\n          spark={data.sparklines.tenants}\n        />\n      </div>\n      <div className=\"adm-span-3\">\n        <StatCard\n          label=\"New accounts\"\n          value={integer.format(data.kpis.newAccounts.current)}\n          href=\"/admin/accounts\"\n          delta={delta(data.kpis.newAccounts)}\n          sub={\n            compare\n              ? undefined\n              : `${integer.format(data.totals.totalAccounts)} in total`\n          }\n          spark={data.sparklines.accounts}\n        />\n      </div>\n    </section>\n  );\n}\n"],"mappings":"AAgCI,SAKQ,KALR;AA/BJ,SAAS,YAAY,UAAU,cAAc;AAE7C,MAAM,UAAU,IAAI,KAAK,aAAa;AAG/B,SAAS,OAAO;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GASG;AACD,QAAM,QAAQ,CAAC,QACb,UAAU,EAAE,KAAK,IAAI,KAAK,SAAS,kBAAkB,IAAI;AAE3D,QAAM,SAAS,OAAO,KAAK,KAAK,eAAe,KAAK;AACpD,QAAM,WAAW;AAAA,IACf,KAAK,MAAM;AAAA,IACX;AAAA,EACF,GAAG,OAAO,IAAI,CAAC,MAAM,EAAE,GAAG;AAE1B,SACE,qBAAC,aAAQ,cAAW,0BAAyB,WAAU,YACrD;AAAA,wBAAC,SAAI,WAAU,cACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OACE;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,KAAK,KAAK;AAAA,YAChB;AAAA,YACA,QAAQ,CAAC,MAAM,EAAE;AAAA,YACjB,OAAM;AAAA;AAAA,QACR;AAAA,QAEF,MAAK;AAAA,QACL,OAAO,SAAS,MAAM,MAAM,IAAI;AAAA,QAChC,KAAK,WAAW,SAAS,SAAY;AAAA,QACrC,OAAO;AAAA,QACP,MAAK;AAAA;AAAA,IACP,GACF;AAAA,IACA,oBAAC,SAAI,WAAU,cACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO,QAAQ,OAAO,KAAK,KAAK,OAAO,OAAO;AAAA,QAC9C,MAAK;AAAA,QACL,OAAO,MAAM,KAAK,KAAK,MAAM;AAAA,QAC7B,KAAK,UAAU,SAAY;AAAA,QAC3B,OAAO,KAAK,WAAW;AAAA,QACvB,MAAK;AAAA;AAAA,IACP,GACF;AAAA,IACA,oBAAC,SAAI,WAAU,cACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO,QAAQ,OAAO,KAAK,KAAK,WAAW,OAAO;AAAA,QAClD,MAAK;AAAA,QACL,OAAO,MAAM,KAAK,KAAK,UAAU;AAAA,QACjC,KACE,UACI,SACA,GAAG,QAAQ,OAAO,KAAK,OAAO,YAAY,CAAC;AAAA,QAEjD,OAAO,KAAK,WAAW;AAAA;AAAA,IACzB,GACF;AAAA,IACA,oBAAC,SAAI,WAAU,cACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO,QAAQ,OAAO,KAAK,KAAK,YAAY,OAAO;AAAA,QACnD,MAAK;AAAA,QACL,OAAO,MAAM,KAAK,KAAK,WAAW;AAAA,QAClC,KACE,UACI,SACA,GAAG,QAAQ,OAAO,KAAK,OAAO,aAAa,CAAC;AAAA,QAElD,OAAO,KAAK,WAAW;AAAA;AAAA,IACzB,GACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/_overview/leaders-panel.js

@@ -0,0 +1,71 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import { TableShell, Th } from "@withpotter/ui-kit";
+import { logoOf } from "../commerce/merchant-meta";
+import { EntityAvatar } from "../_fx";
+import { PICK_CURRENCY, Panel, moneyIn } from "../_ui";
+import styles from "./figures.module.css";
+const integer = new Intl.NumberFormat();
+function LeadersPanel({
+  tenants,
+  focus,
+  caption
+}) {
+  const top = tenants[0]?.gmv || 1;
+  const money = moneyIn(focus ?? "");
+  return /* @__PURE__ */ jsx(
+    Panel,
+    {
+      title: "Leading merchants",
+      caption,
+      action: /* @__PURE__ */ jsx(Link, { href: "/admin/tenants", children: "View all" }),
+      flush: true,
+      children: tenants.length ? /* @__PURE__ */ jsx(
+        TableShell,
+        {
+          bare: true,
+          minWidth: 320,
+          density: "compact",
+          head: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx(Th, { className: "w-10", children: "#" }),
+            /* @__PURE__ */ jsx(Th, { children: "Merchant" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "Orders" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "GMV" })
+          ] }),
+          children: tenants.map((t, index) => {
+            const logo = logoOf(t);
+            return /* @__PURE__ */ jsxs("tr", { className: styles.leaderRow, children: [
+              /* @__PURE__ */ jsx("td", { className: styles.rank, children: index + 1 }),
+              /* @__PURE__ */ jsxs("td", { className: styles.leaderName, children: [
+                /* @__PURE__ */ jsxs("span", { className: styles.leaderId, children: [
+                  logo && /* @__PURE__ */ jsx(
+                    EntityAvatar,
+                    {
+                      name: t.businessName,
+                      src: logo,
+                      size: 28
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Link, { href: `/admin/tenants/${t.id}`, children: t.businessName })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: styles.share,
+                    style: { width: `${Math.max(t.gmv / top * 100, 2)}%` }
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx("td", { className: styles.num, children: integer.format(t.orders) }),
+              /* @__PURE__ */ jsx("td", { className: styles.numStrong, children: money(t.gmv) })
+            ] }, t.id);
+          })
+        }
+      ) : /* @__PURE__ */ jsx("p", { className: styles.empty, children: focus ? `No ${focus} merchant volume yet.` : PICK_CURRENCY })
+    }
+  );
+}
+export {
+  LeadersPanel
+};
+//# sourceMappingURL=leaders-panel.js.map

package/dist/admin/_overview/leaders-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_overview/leaders-panel.tsx"],"sourcesContent":["import Link from 'next/link';\nimport { TableShell, Th } from '@withpotter/ui-kit';\nimport type { PlatformCockpit } from '@withpotter/lib/admin-api';\nimport { logoOf } from '../commerce/merchant-meta';\nimport { EntityAvatar } from '../_fx';\nimport { PICK_CURRENCY, Panel, moneyIn } from '../_ui';\nimport styles from './figures.module.css';\n\nconst integer = new Intl.NumberFormat();\n\n/** Merchants by volume within one currency: rank, orders, GMV and share. */\nexport function LeadersPanel({\n  tenants,\n  focus,\n  caption,\n}: {\n  /** The leaders ranked within `focus` only. */\n  tenants: PlatformCockpit['topTenants'];\n  /** The one currency ranked, or null when there are several and none is chosen. */\n  focus: string | null;\n  caption: string;\n}) {\n  const top = tenants[0]?.gmv || 1;\n  const money = moneyIn(focus ?? '');\n\n  return (\n    <Panel\n      title=\"Leading merchants\"\n      caption={caption}\n      action={<Link href=\"/admin/tenants\">View all</Link>}\n      flush\n    >\n      {tenants.length ? (\n        <TableShell\n          bare\n          minWidth={320}\n          density=\"compact\"\n          head={\n            <tr>\n              <Th className=\"w-10\">#</Th>\n              <Th>Merchant</Th>\n              <Th align=\"right\">Orders</Th>\n              <Th align=\"right\">GMV</Th>\n            </tr>\n          }\n        >\n          {tenants.map((t, index) => {\n            const logo = logoOf(t);\n\n            return (\n              <tr key={t.id} className={styles.leaderRow}>\n                <td className={styles.rank}>{index + 1}</td>\n                <td className={styles.leaderName}>\n                  <span className={styles.leaderId}>\n                    {logo && (\n                      <EntityAvatar\n                        name={t.businessName}\n                        src={logo}\n                        size={28}\n                      />\n                    )}\n                    <Link href={`/admin/tenants/${t.id}`}>\n                      {t.businessName}\n                    </Link>\n                  </span>\n                  <span\n                    className={styles.share}\n                    style={{ width: `${Math.max((t.gmv / top) * 100, 2)}%` }}\n                  />\n                </td>\n                <td className={styles.num}>{integer.format(t.orders)}</td>\n                <td className={styles.numStrong}>{money(t.gmv)}</td>\n              </tr>\n            );\n          })}\n        </TableShell>\n      ) : (\n        <p className={styles.empty}>\n          {focus ? `No ${focus} merchant volume yet.` : PICK_CURRENCY}\n        </p>\n      )}\n    </Panel>\n  );\n}\n"],"mappings":"AA6Bc,cASF,YATE;AA7Bd,OAAO,UAAU;AACjB,SAAS,YAAY,UAAU;AAE/B,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,eAAe,OAAO,eAAe;AAC9C,OAAO,YAAY;AAEnB,MAAM,UAAU,IAAI,KAAK,aAAa;AAG/B,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,QAAM,MAAM,QAAQ,CAAC,GAAG,OAAO;AAC/B,QAAM,QAAQ,QAAQ,SAAS,EAAE;AAEjC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN;AAAA,MACA,QAAQ,oBAAC,QAAK,MAAK,kBAAiB,sBAAQ;AAAA,MAC5C,OAAK;AAAA,MAEJ,kBAAQ,SACP;AAAA,QAAC;AAAA;AAAA,UACC,MAAI;AAAA,UACJ,UAAU;AAAA,UACV,SAAQ;AAAA,UACR,MACE,qBAAC,QACC;AAAA,gCAAC,MAAG,WAAU,QAAO,eAAC;AAAA,YACtB,oBAAC,MAAG,sBAAQ;AAAA,YACZ,oBAAC,MAAG,OAAM,SAAQ,oBAAM;AAAA,YACxB,oBAAC,MAAG,OAAM,SAAQ,iBAAG;AAAA,aACvB;AAAA,UAGD,kBAAQ,IAAI,CAAC,GAAG,UAAU;AACzB,kBAAM,OAAO,OAAO,CAAC;AAErB,mBACE,qBAAC,QAAc,WAAW,OAAO,WAC/B;AAAA,kCAAC,QAAG,WAAW,OAAO,MAAO,kBAAQ,GAAE;AAAA,cACvC,qBAAC,QAAG,WAAW,OAAO,YACpB;AAAA,qCAAC,UAAK,WAAW,OAAO,UACrB;AAAA,0BACC;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM,EAAE;AAAA,sBACR,KAAK;AAAA,sBACL,MAAM;AAAA;AAAA,kBACR;AAAA,kBAEF,oBAAC,QAAK,MAAM,kBAAkB,EAAE,EAAE,IAC/B,YAAE,cACL;AAAA,mBACF;AAAA,gBACA;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAW,OAAO;AAAA,oBAClB,OAAO,EAAE,OAAO,GAAG,KAAK,IAAK,EAAE,MAAM,MAAO,KAAK,CAAC,CAAC,IAAI;AAAA;AAAA,gBACzD;AAAA,iBACF;AAAA,cACA,oBAAC,QAAG,WAAW,OAAO,KAAM,kBAAQ,OAAO,EAAE,MAAM,GAAE;AAAA,cACrD,oBAAC,QAAG,WAAW,OAAO,WAAY,gBAAM,EAAE,GAAG,GAAE;AAAA,iBArBxC,EAAE,EAsBX;AAAA,UAEJ,CAAC;AAAA;AAAA,MACH,IAEA,oBAAC,OAAE,WAAW,OAAO,OAClB,kBAAQ,MAAM,KAAK,0BAA0B,eAChD;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/admin/_overview/overdue-outstanding.js

@@ -0,0 +1,37 @@
+import { totalsByCurrency } from "../_ui/currency-filter-model";
+function inCurrency(value, code) {
+  try {
+    return new Intl.NumberFormat("en-US", {
+      style: "currency",
+      currencyDisplay: "narrowSymbol",
+      currency: code || "NGN",
+      maximumFractionDigits: 0
+    }).format(value);
+  } catch {
+    return `${code} ${Math.round(value)}`;
+  }
+}
+function overdueOutstanding(overdue, selected = "") {
+  if (!overdue.count) return null;
+  let totals;
+  if (overdue.totalByCurrency) {
+    totals = overdue.totalByCurrency.filter(
+      (t) => !selected || t.currency === selected
+    );
+    if (!totals.length) return selected ? `No ${selected} outstanding` : null;
+  } else {
+    if (overdue.sample.length < overdue.count) return null;
+    totals = totalsByCurrency(
+      overdue.sample,
+      (i) => i.currency,
+      (i) => i.amountDue
+    ).filter((t) => !selected || t.currency === selected);
+  }
+  const lines = totals.map((t) => inCurrency(t.amount, t.currency));
+  return lines.length ? `${lines.join(" \xB7 ")} outstanding` : null;
+}
+export {
+  inCurrency,
+  overdueOutstanding
+};
+//# sourceMappingURL=overdue-outstanding.js.map

package/dist/admin/_overview/overdue-outstanding.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_overview/overdue-outstanding.ts"],"sourcesContent":["import type { PlatformCockpit } from '@withpotter/lib/admin-api';\nimport { totalsByCurrency } from '../_ui/currency-filter-model';\n\ntype Overdue = PlatformCockpit['attention']['overdueInvoices'];\n\n/** A main-unit amount in its own currency: 120000 NGN → \"₦120,000\". */\nexport function inCurrency(value: number, code: string): string {\n  try {\n    return new Intl.NumberFormat('en-US', {\n      style: 'currency',\n      currencyDisplay: 'narrowSymbol',\n      currency: code || 'NGN',\n      maximumFractionDigits: 0,\n    }).format(value);\n  } catch {\n    return `${code} ${Math.round(value)}`;\n  }\n}\n\n/**\n * What the overdue invoices still owe, one amount per currency, or null when\n * it cannot be said honestly. Amounts are never added across currencies.\n *\n * The engine sends `totalByCurrency` (every overdue invoice, per currency);\n * `selected` narrows it to the currency filter's choice. An engine without it\n * only has the sample: when the sample IS every overdue invoice it is added\n * up per currency; when there are more, nothing is shown rather than a\n * partial figure. The mixed `total` is never shown.\n */\nexport function overdueOutstanding(\n  overdue: Overdue,\n  selected = '',\n): string | null {\n  if (!overdue.count) return null;\n\n  let totals: Array<{ currency: string; amount: number }>;\n  if (overdue.totalByCurrency) {\n    totals = overdue.totalByCurrency.filter(\n      (t) => !selected || t.currency === selected,\n    );\n    if (!totals.length) return selected ? `No ${selected} outstanding` : null;\n  } else {\n    if (overdue.sample.length < overdue.count) return null;\n    totals = totalsByCurrency(\n      overdue.sample,\n      (i) => i.currency,\n      (i) => i.amountDue,\n    ).filter((t) => !selected || t.currency === selected);\n  }\n\n  const lines = totals.map((t) => inCurrency(t.amount, t.currency));\n\n  return lines.length ? `${lines.join(' · ')} outstanding` : null;\n}\n"],"mappings":"AACA,SAAS,wBAAwB;AAK1B,SAAS,WAAW,OAAe,MAAsB;AAC9D,MAAI;AACF,WAAO,IAAI,KAAK,aAAa,SAAS;AAAA,MACpC,OAAO;AAAA,MACP,iBAAiB;AAAA,MACjB,UAAU,QAAQ;AAAA,MAClB,uBAAuB;AAAA,IACzB,CAAC,EAAE,OAAO,KAAK;AAAA,EACjB,QAAQ;AACN,WAAO,GAAG,IAAI,IAAI,KAAK,MAAM,KAAK,CAAC;AAAA,EACrC;AACF;AAYO,SAAS,mBACd,SACA,WAAW,IACI;AACf,MAAI,CAAC,QAAQ,MAAO,QAAO;AAE3B,MAAI;AACJ,MAAI,QAAQ,iBAAiB;AAC3B,aAAS,QAAQ,gBAAgB;AAAA,MAC/B,CAAC,MAAM,CAAC,YAAY,EAAE,aAAa;AAAA,IACrC;AACA,QAAI,CAAC,OAAO,OAAQ,QAAO,WAAW,MAAM,QAAQ,iBAAiB;AAAA,EACvE,OAAO;AACL,QAAI,QAAQ,OAAO,SAAS,QAAQ,MAAO,QAAO;AAClD,aAAS;AAAA,MACP,QAAQ;AAAA,MACR,CAAC,MAAM,EAAE;AAAA,MACT,CAAC,MAAM,EAAE;AAAA,IACX,EAAE,OAAO,CAAC,MAAM,CAAC,YAAY,EAAE,aAAa,QAAQ;AAAA,EACtD;AAEA,QAAM,QAAQ,OAAO,IAAI,CAAC,MAAM,WAAW,EAAE,QAAQ,EAAE,QAAQ,CAAC;AAEhE,SAAO,MAAM,SAAS,GAAG,MAAM,KAAK,QAAK,CAAC,iBAAiB;AAC7D;","names":[]}

package/dist/admin/_overview/portfolio-panel.js

@@ -0,0 +1,69 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Panel, categoryColor, statusColor } from "../_ui";
+import styles from "./figures.module.css";
+const integer = new Intl.NumberFormat();
+const pct = (count, total) => total ? Math.round(count / total * 100) : 0;
+function PortfolioPanel({
+  statuses,
+  industries
+}) {
+  const total = statuses.reduce((sum, s) => sum + s.count, 0);
+  const industryTotal = industries.reduce((sum, i) => sum + i.count, 0);
+  const topIndustry = industries[0]?.count || 1;
+  return /* @__PURE__ */ jsxs(
+    Panel,
+    {
+      title: "Merchant portfolio",
+      caption: `${integer.format(total)} workspaces`,
+      height: "var(--adm-panel-h)",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: styles.stack, "aria-hidden": true, children: statuses.map((s) => /* @__PURE__ */ jsx(
+          "span",
+          {
+            style: {
+              width: `${pct(s.count, total)}%`,
+              background: statusColor(s.status)
+            }
+          },
+          s.status
+        )) }),
+        /* @__PURE__ */ jsx("ul", { className: styles.legend, children: statuses.map((s) => /* @__PURE__ */ jsxs("li", { children: [
+          /* @__PURE__ */ jsx("i", { style: { background: statusColor(s.status) } }),
+          /* @__PURE__ */ jsx("span", { children: s.status }),
+          /* @__PURE__ */ jsx("strong", { children: integer.format(s.count) }),
+          /* @__PURE__ */ jsxs("small", { children: [
+            pct(s.count, total),
+            "%"
+          ] })
+        ] }, s.status)) }),
+        /* @__PURE__ */ jsx("div", { className: styles.subhead, children: "Industries" }),
+        /* @__PURE__ */ jsx("ul", { className: styles.bars, children: industries.map((row, index) => /* @__PURE__ */ jsxs("li", { children: [
+          /* @__PURE__ */ jsxs("div", { className: styles.barLabel, children: [
+            /* @__PURE__ */ jsx("span", { children: row.industry || "Unspecified" }),
+            /* @__PURE__ */ jsxs("strong", { children: [
+              integer.format(row.count),
+              /* @__PURE__ */ jsxs("small", { children: [
+                " \xB7 ",
+                pct(row.count, industryTotal),
+                "%"
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: styles.track, children: /* @__PURE__ */ jsx(
+            "span",
+            {
+              style: {
+                width: `${row.count / topIndustry * 100}%`,
+                background: categoryColor(index)
+              }
+            }
+          ) })
+        ] }, row.industry || "unspecified")) })
+      ]
+    }
+  );
+}
+export {
+  PortfolioPanel
+};
+//# sourceMappingURL=portfolio-panel.js.map

package/dist/admin/_overview/portfolio-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_overview/portfolio-panel.tsx"],"sourcesContent":["import type { PlatformCockpit } from '@withpotter/lib/admin-api';\nimport { Panel, categoryColor, statusColor } from '../_ui';\nimport styles from './figures.module.css';\n\nconst integer = new Intl.NumberFormat();\n\nconst pct = (count: number, total: number) =>\n  total ? Math.round((count / total) * 100) : 0;\n\n/**\n * Where the merchant base sits: one status bar, then industries ranked. The\n * card is as tall as its row neighbours and the list scrolls inside it.\n */\nexport function PortfolioPanel({\n  statuses,\n  industries,\n}: {\n  statuses: PlatformCockpit['statusBreakdown'];\n  industries: PlatformCockpit['industryBreakdown'];\n}) {\n  const total = statuses.reduce((sum, s) => sum + s.count, 0);\n  const industryTotal = industries.reduce((sum, i) => sum + i.count, 0);\n  const topIndustry = industries[0]?.count || 1;\n\n  return (\n    <Panel\n      title=\"Merchant portfolio\"\n      caption={`${integer.format(total)} workspaces`}\n      height=\"var(--adm-panel-h)\"\n    >\n      <div className={styles.stack} aria-hidden>\n        {statuses.map((s) => (\n          <span\n            key={s.status}\n            style={{\n              width: `${pct(s.count, total)}%`,\n              background: statusColor(s.status),\n            }}\n          />\n        ))}\n      </div>\n      <ul className={styles.legend}>\n        {statuses.map((s) => (\n          <li key={s.status}>\n            <i style={{ background: statusColor(s.status) }} />\n            <span>{s.status}</span>\n            <strong>{integer.format(s.count)}</strong>\n            <small>{pct(s.count, total)}%</small>\n          </li>\n        ))}\n      </ul>\n\n      <div className={styles.subhead}>Industries</div>\n      <ul className={styles.bars}>\n        {industries.map((row, index) => (\n          <li key={row.industry || 'unspecified'}>\n            <div className={styles.barLabel}>\n              <span>{row.industry || 'Unspecified'}</span>\n              <strong>\n                {integer.format(row.count)}\n                <small> · {pct(row.count, industryTotal)}%</small>\n              </strong>\n            </div>\n            <div className={styles.track}>\n              <span\n                style={{\n                  width: `${(row.count / topIndustry) * 100}%`,\n                  background: categoryColor(index),\n                }}\n              />\n            </div>\n          </li>\n        ))}\n      </ul>\n    </Panel>\n  );\n}\n"],"mappings":"AAgCU,cAeE,YAfF;AA/BV,SAAS,OAAO,eAAe,mBAAmB;AAClD,OAAO,YAAY;AAEnB,MAAM,UAAU,IAAI,KAAK,aAAa;AAEtC,MAAM,MAAM,CAAC,OAAe,UAC1B,QAAQ,KAAK,MAAO,QAAQ,QAAS,GAAG,IAAI;AAMvC,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AACF,GAGG;AACD,QAAM,QAAQ,SAAS,OAAO,CAAC,KAAK,MAAM,MAAM,EAAE,OAAO,CAAC;AAC1D,QAAM,gBAAgB,WAAW,OAAO,CAAC,KAAK,MAAM,MAAM,EAAE,OAAO,CAAC;AACpE,QAAM,cAAc,WAAW,CAAC,GAAG,SAAS;AAE5C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,SAAS,GAAG,QAAQ,OAAO,KAAK,CAAC;AAAA,MACjC,QAAO;AAAA,MAEP;AAAA,4BAAC,SAAI,WAAW,OAAO,OAAO,eAAW,MACtC,mBAAS,IAAI,CAAC,MACb;AAAA,UAAC;AAAA;AAAA,YAEC,OAAO;AAAA,cACL,OAAO,GAAG,IAAI,EAAE,OAAO,KAAK,CAAC;AAAA,cAC7B,YAAY,YAAY,EAAE,MAAM;AAAA,YAClC;AAAA;AAAA,UAJK,EAAE;AAAA,QAKT,CACD,GACH;AAAA,QACA,oBAAC,QAAG,WAAW,OAAO,QACnB,mBAAS,IAAI,CAAC,MACb,qBAAC,QACC;AAAA,8BAAC,OAAE,OAAO,EAAE,YAAY,YAAY,EAAE,MAAM,EAAE,GAAG;AAAA,UACjD,oBAAC,UAAM,YAAE,QAAO;AAAA,UAChB,oBAAC,YAAQ,kBAAQ,OAAO,EAAE,KAAK,GAAE;AAAA,UACjC,qBAAC,WAAO;AAAA,gBAAI,EAAE,OAAO,KAAK;AAAA,YAAE;AAAA,aAAC;AAAA,aAJtB,EAAE,MAKX,CACD,GACH;AAAA,QAEA,oBAAC,SAAI,WAAW,OAAO,SAAS,wBAAU;AAAA,QAC1C,oBAAC,QAAG,WAAW,OAAO,MACnB,qBAAW,IAAI,CAAC,KAAK,UACpB,qBAAC,QACC;AAAA,+BAAC,SAAI,WAAW,OAAO,UACrB;AAAA,gCAAC,UAAM,cAAI,YAAY,eAAc;AAAA,YACrC,qBAAC,YACE;AAAA,sBAAQ,OAAO,IAAI,KAAK;AAAA,cACzB,qBAAC,WAAM;AAAA;AAAA,gBAAI,IAAI,IAAI,OAAO,aAAa;AAAA,gBAAE;AAAA,iBAAC;AAAA,eAC5C;AAAA,aACF;AAAA,UACA,oBAAC,SAAI,WAAW,OAAO,OACrB;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,gBACL,OAAO,GAAI,IAAI,QAAQ,cAAe,GAAG;AAAA,gBACzC,YAAY,cAAc,KAAK;AAAA,cACjC;AAAA;AAAA,UACF,GACF;AAAA,aAfO,IAAI,YAAY,aAgBzB,CACD,GACH;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/admin/_overview/position-panel.js

@@ -0,0 +1,66 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { MoneyLines, Panel } from "../_ui";
+import styles from "./position.module.css";
+const integer = new Intl.NumberFormat();
+function PositionPanel({
+  data,
+  currency
+}) {
+  const perf = data.performance;
+  const rows = [
+    [
+      "Active workspaces",
+      integer.format(data.totals.activeTenants),
+      `of ${integer.format(data.totals.totalTenants)} \xB7 status active`
+    ],
+    [
+      "Merchants with sales",
+      perf ? integer.format(perf.transactingTenants) : "\u2014",
+      // The API divides by every workspace, not only the active ones.
+      perf ? `${perf.transactingTenantRatePct}% of all workspaces, this period` : void 0
+    ],
+    [
+      "Lifetime GMV",
+      /* @__PURE__ */ jsx(
+        MoneyLines,
+        {
+          rows: data.totals.lifetimeGmvByCurrency,
+          currency,
+          amount: (r) => r.amount,
+          empty: "No sales yet"
+        },
+        "gmv"
+      )
+    ],
+    [
+      "Yearly sales pace",
+      /* @__PURE__ */ jsx(
+        MoneyLines,
+        {
+          rows: perf?.byCurrency,
+          currency,
+          amount: (r) => r.annualizedGmvRunRate,
+          empty: "\u2014"
+        },
+        "run"
+      ),
+      "this period, scaled to a year"
+    ],
+    [
+      "Accounts",
+      integer.format(data.totals.totalAccounts),
+      data.accounts ? `${integer.format(data.accounts.active)} active and verified` : void 0
+    ]
+  ];
+  return /* @__PURE__ */ jsx(Panel, { title: "Platform position", caption: "Today", children: /* @__PURE__ */ jsx("dl", { className: styles.position, children: rows.map(([label, value, hint]) => /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("dt", { children: label }),
+    /* @__PURE__ */ jsxs("dd", { children: [
+      /* @__PURE__ */ jsx("strong", { children: value }),
+      hint && /* @__PURE__ */ jsx("small", { children: hint })
+    ] })
+  ] }, label)) }) });
+}
+export {
+  PositionPanel
+};
+//# sourceMappingURL=position-panel.js.map

package/dist/admin/_overview/position-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_overview/position-panel.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { PlatformCockpit } from '@withpotter/lib/admin-api';\nimport { MoneyLines, Panel } from '../_ui';\nimport styles from './position.module.css';\n\nconst integer = new Intl.NumberFormat();\n\n/** The platform's standing figures — not tied to the selected window. */\nexport function PositionPanel({\n  data,\n  currency,\n}: {\n  data: PlatformCockpit;\n  /** The currency filter's choice; empty shows a line per currency. */\n  currency: string;\n}) {\n  const perf = data.performance;\n  const rows: Array<[string, ReactNode, string?]> = [\n    [\n      'Active workspaces',\n      integer.format(data.totals.activeTenants),\n      `of ${integer.format(data.totals.totalTenants)} · status active`,\n    ],\n    [\n      'Merchants with sales',\n      perf ? integer.format(perf.transactingTenants) : '—',\n      // The API divides by every workspace, not only the active ones.\n      perf\n        ? `${perf.transactingTenantRatePct}% of all workspaces, this period`\n        : undefined,\n    ],\n    [\n      'Lifetime GMV',\n      <MoneyLines\n        key=\"gmv\"\n        rows={data.totals.lifetimeGmvByCurrency}\n        currency={currency}\n        amount={(r) => r.amount}\n        empty=\"No sales yet\"\n      />,\n    ],\n    [\n      'Yearly sales pace',\n      <MoneyLines\n        key=\"run\"\n        rows={perf?.byCurrency}\n        currency={currency}\n        amount={(r) => r.annualizedGmvRunRate}\n        empty=\"—\"\n      />,\n      'this period, scaled to a year',\n    ],\n    [\n      'Accounts',\n      integer.format(data.totals.totalAccounts),\n      data.accounts\n        ? `${integer.format(data.accounts.active)} active and verified`\n        : undefined,\n    ],\n  ];\n\n  return (\n    <Panel title=\"Platform position\" caption=\"Today\">\n      <dl className={styles.position}>\n        {rows.map(([label, value, hint]) => (\n          <div key={label}>\n            <dt>{label}</dt>\n            <dd>\n              <strong>{value}</strong>\n              {hint && <small>{hint}</small>}\n            </dd>\n          </div>\n        ))}\n      </dl>\n    </Panel>\n  );\n}\n"],"mappings":"AAiCM,cAkCM,YAlCN;AA/BN,SAAS,YAAY,aAAa;AAClC,OAAO,YAAY;AAEnB,MAAM,UAAU,IAAI,KAAK,aAAa;AAG/B,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AACF,GAIG;AACD,QAAM,OAAO,KAAK;AAClB,QAAM,OAA4C;AAAA,IAChD;AAAA,MACE;AAAA,MACA,QAAQ,OAAO,KAAK,OAAO,aAAa;AAAA,MACxC,MAAM,QAAQ,OAAO,KAAK,OAAO,YAAY,CAAC;AAAA,IAChD;AAAA,IACA;AAAA,MACE;AAAA,MACA,OAAO,QAAQ,OAAO,KAAK,kBAAkB,IAAI;AAAA;AAAA,MAEjD,OACI,GAAG,KAAK,wBAAwB,qCAChC;AAAA,IACN;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UAEC,MAAM,KAAK,OAAO;AAAA,UAClB;AAAA,UACA,QAAQ,CAAC,MAAM,EAAE;AAAA,UACjB,OAAM;AAAA;AAAA,QAJF;AAAA,MAKN;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UAEC,MAAM,MAAM;AAAA,UACZ;AAAA,UACA,QAAQ,CAAC,MAAM,EAAE;AAAA,UACjB,OAAM;AAAA;AAAA,QAJF;AAAA,MAKN;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA,QAAQ,OAAO,KAAK,OAAO,aAAa;AAAA,MACxC,KAAK,WACD,GAAG,QAAQ,OAAO,KAAK,SAAS,MAAM,CAAC,yBACvC;AAAA,IACN;AAAA,EACF;AAEA,SACE,oBAAC,SAAM,OAAM,qBAAoB,SAAQ,SACvC,8BAAC,QAAG,WAAW,OAAO,UACnB,eAAK,IAAI,CAAC,CAAC,OAAO,OAAO,IAAI,MAC5B,qBAAC,SACC;AAAA,wBAAC,QAAI,iBAAM;AAAA,IACX,qBAAC,QACC;AAAA,0BAAC,YAAQ,iBAAM;AAAA,MACd,QAAQ,oBAAC,WAAO,gBAAK;AAAA,OACxB;AAAA,OALQ,KAMV,CACD,GACH,GACF;AAEJ;","names":[]}

package/dist/admin/_overview/position.module.css

@@ -0,0 +1,52 @@
+/* Platform position: label left, figure right, hairline rows. */
+
+.position {
+  display: grid;
+  margin: 0;
+}
+
+.position > div {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 12px 0;
+  border-top: 1px solid var(--border-subtle);
+}
+
+.position > div:first-child {
+  border-top: 0;
+  padding-top: 4px;
+}
+
+.position dt {
+  font-size: 13px;
+  color: var(--text-secondary);
+}
+
+.position dd {
+  display: grid;
+  justify-items: end;
+  margin: 0;
+}
+
+.position strong {
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 24px;
+  letter-spacing: -0.01em;
+  font-variant-numeric: tabular-nums;
+}
+
+.position small {
+  font-size: 12px;
+  line-height: 16px;
+  color: var(--text-tertiary);
+}
+
+.empty {
+  margin: 0;
+  padding: 16px 20px;
+  font-size: 13px;
+  color: var(--text-tertiary);
+}

package/dist/admin/_overview/use-waiting-cases.js

@@ -0,0 +1,17 @@
+"use client";
+import { useQuery } from "@tanstack/react-query";
+import { adminCaseApi } from "@withpotter/lib/admin-case-api";
+const WAITING_KEY = ["platform-admin", "compliance", "cases-waiting"];
+function useWaitingCases() {
+  return useQuery({
+    queryKey: WAITING_KEY,
+    queryFn: () => adminCaseApi.waitingCount(),
+    select: (r) => r.total,
+    retry: false
+  });
+}
+export {
+  WAITING_KEY,
+  useWaitingCases
+};
+//# sourceMappingURL=use-waiting-cases.js.map

package/dist/admin/_overview/use-waiting-cases.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_overview/use-waiting-cases.ts"],"sourcesContent":["'use client';\n\nimport { useQuery } from '@tanstack/react-query';\nimport { adminCaseApi } from '@withpotter/lib/admin-case-api';\n\n/** Refreshed by a decision on any case (see `use-case.ts`). */\nexport const WAITING_KEY = ['platform-admin', 'compliance', 'cases-waiting'];\n\n/** How many verification cases wait for a decision; one row is enough. */\nexport function useWaitingCases() {\n  return useQuery({\n    queryKey: WAITING_KEY,\n    queryFn: () => adminCaseApi.waitingCount(),\n    select: (r) => r.total,\n    retry: false,\n  });\n}\n"],"mappings":";AAEA,SAAS,gBAAgB;AACzB,SAAS,oBAAoB;AAGtB,MAAM,cAAc,CAAC,kBAAkB,cAAc,eAAe;AAGpE,SAAS,kBAAkB;AAChC,SAAO,SAAS;AAAA,IACd,UAAU;AAAA,IACV,SAAS,MAAM,aAAa,aAAa;AAAA,IACzC,QAAQ,CAAC,MAAM,EAAE;AAAA,IACjB,OAAO;AAAA,EACT,CAAC;AACH;","names":[]}

package/dist/admin/_pos/action-dialog.js

@@ -0,0 +1,66 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useQueryClient } from "@tanstack/react-query";
+import { Button, ErrorBanner, FormDialog, Textarea } from "@withpotter/ui-kit";
+import { isStale, posErrorText, REASON_MAX } from "./pos-rules";
+import { POS_KEY } from "./use-pos";
+import styles from "./pos.module.css";
+function ActionDialog({
+  open,
+  title,
+  description,
+  consequence,
+  act,
+  tone,
+  pending,
+  error,
+  reason,
+  reasonError,
+  onReason,
+  onSubmit,
+  onClose
+}) {
+  const client = useQueryClient();
+  const stale = !!error && isStale(error);
+  const dismiss = () => {
+    if (!pending) onClose();
+  };
+  const refresh = () => {
+    void client.invalidateQueries({ queryKey: POS_KEY });
+    onClose();
+  };
+  return /* @__PURE__ */ jsx(
+    FormDialog,
+    {
+      open,
+      size: "sm",
+      onClose: dismiss,
+      title,
+      description,
+      footer: /* @__PURE__ */ jsxs("div", { className: styles.footer, children: [
+        /* @__PURE__ */ jsx(Button, { variant: "secondary", disabled: pending, onClick: dismiss, children: "Cancel" }),
+        stale ? /* @__PURE__ */ jsx(Button, { onClick: refresh, children: "Refresh" }) : /* @__PURE__ */ jsx(Button, { variant: tone, loading: pending, onClick: onSubmit, children: act })
+      ] }),
+      children: /* @__PURE__ */ jsxs("div", { className: styles.form, children: [
+        /* @__PURE__ */ jsx("p", { className: styles.consequence, children: consequence }),
+        /* @__PURE__ */ jsx(
+          Textarea,
+          {
+            label: "Reason",
+            placeholder: "Kept in the admin audit log",
+            rows: 3,
+            value: reason,
+            maxLength: REASON_MAX,
+            onChange: (e) => onReason(e.target.value)
+          }
+        ),
+        reasonError && /* @__PURE__ */ jsx(ErrorBanner, { children: reasonError }),
+        !!error && /* @__PURE__ */ jsx(ErrorBanner, { children: posErrorText(error, `${act} did not go through. Try again.`) })
+      ] })
+    }
+  );
+}
+export {
+  ActionDialog
+};
+//# sourceMappingURL=action-dialog.js.map

package/dist/admin/_pos/action-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_pos/action-dialog.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport { useQueryClient } from '@tanstack/react-query';\nimport { Button, ErrorBanner, FormDialog, Textarea } from '@withpotter/ui-kit';\nimport { isStale, posErrorText, REASON_MAX } from './pos-rules';\nimport { POS_KEY } from './use-pos';\nimport styles from './pos.module.css';\n\n/**\n * The frame every POS action shares: what will happen, the required\n * reason, and the server's answer. A 409 is shown as the record having\n * moved on, with a Refresh that reloads it and closes the form.\n */\nexport function ActionDialog({\n  open,\n  title,\n  description,\n  consequence,\n  act,\n  tone,\n  pending,\n  error,\n  reason,\n  reasonError,\n  onReason,\n  onSubmit,\n  onClose,\n}: {\n  open: boolean;\n  title: string;\n  /** Which terminal or shift, and whose. */\n  description: string;\n  /** What pressing the act does, in a sentence or two. */\n  consequence: ReactNode;\n  act: string;\n  tone: 'primary' | 'danger';\n  pending: boolean;\n  error: unknown;\n  reason: string;\n  /** Shown once the form has been tried. */\n  reasonError?: string;\n  onReason: (reason: string) => void;\n  onSubmit: () => void;\n  onClose: () => void;\n}) {\n  const client = useQueryClient();\n  const stale = !!error && isStale(error);\n  // Closing mid-request would drop the answer and let the form be sent\n  // again, so it stays until the API answers.\n  const dismiss = () => {\n    if (!pending) onClose();\n  };\n  const refresh = () => {\n    void client.invalidateQueries({ queryKey: POS_KEY });\n    onClose();\n  };\n\n  return (\n    <FormDialog\n      open={open}\n      size=\"sm\"\n      onClose={dismiss}\n      title={title}\n      description={description}\n      footer={\n        <div className={styles.footer}>\n          <Button variant=\"secondary\" disabled={pending} onClick={dismiss}>\n            Cancel\n          </Button>\n          {stale ? (\n            <Button onClick={refresh}>Refresh</Button>\n          ) : (\n            <Button variant={tone} loading={pending} onClick={onSubmit}>\n              {act}\n            </Button>\n          )}\n        </div>\n      }\n    >\n      <div className={styles.form}>\n        <p className={styles.consequence}>{consequence}</p>\n        <Textarea\n          label=\"Reason\"\n          placeholder=\"Kept in the admin audit log\"\n          rows={3}\n          value={reason}\n          maxLength={REASON_MAX}\n          onChange={(e) => onReason(e.target.value)}\n        />\n        {reasonError && <ErrorBanner>{reasonError}</ErrorBanner>}\n        {!!error && (\n          <ErrorBanner>\n            {posErrorText(error, `${act} did not go through. Try again.`)}\n          </ErrorBanner>\n        )}\n      </div>\n    </FormDialog>\n  );\n}\n"],"mappings":";AAkEQ,SACE,KADF;AA/DR,SAAS,sBAAsB;AAC/B,SAAS,QAAQ,aAAa,YAAY,gBAAgB;AAC1D,SAAS,SAAS,cAAc,kBAAkB;AAClD,SAAS,eAAe;AACxB,OAAO,YAAY;AAOZ,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAiBG;AACD,QAAM,SAAS,eAAe;AAC9B,QAAM,QAAQ,CAAC,CAAC,SAAS,QAAQ,KAAK;AAGtC,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,QAAS,SAAQ;AAAA,EACxB;AACA,QAAM,UAAU,MAAM;AACpB,SAAK,OAAO,kBAAkB,EAAE,UAAU,QAAQ,CAAC;AACnD,YAAQ;AAAA,EACV;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA,QACE,qBAAC,SAAI,WAAW,OAAO,QACrB;AAAA,4BAAC,UAAO,SAAQ,aAAY,UAAU,SAAS,SAAS,SAAS,oBAEjE;AAAA,QACC,QACC,oBAAC,UAAO,SAAS,SAAS,qBAAO,IAEjC,oBAAC,UAAO,SAAS,MAAM,SAAS,SAAS,SAAS,UAC/C,eACH;AAAA,SAEJ;AAAA,MAGF,+BAAC,SAAI,WAAW,OAAO,MACrB;AAAA,4BAAC,OAAE,WAAW,OAAO,aAAc,uBAAY;AAAA,QAC/C;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,aAAY;AAAA,YACZ,MAAM;AAAA,YACN,OAAO;AAAA,YACP,WAAW;AAAA,YACX,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA;AAAA,QAC1C;AAAA,QACC,eAAe,oBAAC,eAAa,uBAAY;AAAA,QACzC,CAAC,CAAC,SACD,oBAAC,eACE,uBAAa,OAAO,GAAG,GAAG,iCAAiC,GAC9D;AAAA,SAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/admin/_pos/close-shift-dialog.js

@@ -0,0 +1,62 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { useToast } from "@withpotter/ui-kit";
+import { ActionDialog } from "./action-dialog";
+import { reasonError } from "./pos-rules";
+import { atTime } from "./pos-words";
+import { useCloseShift } from "./use-pos";
+function CloseShiftDialog({
+  shift,
+  open,
+  onClose
+}) {
+  const { toast } = useToast();
+  const mutation = useCloseShift();
+  const [reason, setReason] = useState("");
+  const [tried, setTried] = useState(false);
+  if (!shift) return null;
+  const close = () => {
+    onClose();
+    mutation.reset();
+    setReason("");
+    setTried(false);
+  };
+  const problem = reasonError(reason);
+  const terminal = shift.terminal.label || "Removed terminal";
+  const submit = () => {
+    setTried(true);
+    if (problem) return;
+    mutation.mutate(
+      { id: shift.id, reason: reason.trim() },
+      {
+        onSuccess: () => {
+          toast({ title: "Shift closed" });
+          close();
+        }
+      }
+    );
+  };
+  return /* @__PURE__ */ jsx(
+    ActionDialog,
+    {
+      open,
+      title: "Close this shift?",
+      description: `${terminal} \xB7 ${shift.tenant.name || "Unnamed business"}`,
+      consequence: `Opened by ${shift.operatorName ?? "someone"} on ${atTime(shift.openedAt)}. They are signed out at the till; payments already taken stay on the shift.`,
+      act: "Close shift",
+      tone: "primary",
+      pending: mutation.isPending,
+      error: mutation.error,
+      reason,
+      reasonError: tried ? problem : void 0,
+      onReason: setReason,
+      onSubmit: submit,
+      onClose: close
+    }
+  );
+}
+export {
+  CloseShiftDialog
+};
+//# sourceMappingURL=close-shift-dialog.js.map

package/dist/admin/_pos/close-shift-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_pos/close-shift-dialog.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { useToast } from '@withpotter/ui-kit';\nimport type { PosShift } from '@withpotter/lib/admin-pos-types';\nimport { ActionDialog } from './action-dialog';\nimport { reasonError } from './pos-rules';\nimport { atTime } from './pos-words';\nimport { useCloseShift } from './use-pos';\n\n/** Close a shift someone left open: it is signed out at its till. */\nexport function CloseShiftDialog({\n  shift,\n  open,\n  onClose,\n}: {\n  shift: PosShift | null;\n  open: boolean;\n  onClose: () => void;\n}) {\n  const { toast } = useToast();\n  const mutation = useCloseShift();\n  const [reason, setReason] = useState('');\n  const [tried, setTried] = useState(false);\n\n  if (!shift) return null;\n\n  const close = () => {\n    onClose();\n    mutation.reset();\n    setReason('');\n    setTried(false);\n  };\n  const problem = reasonError(reason);\n  const terminal = shift.terminal.label || 'Removed terminal';\n\n  const submit = () => {\n    setTried(true);\n\n    if (problem) return;\n\n    mutation.mutate(\n      { id: shift.id, reason: reason.trim() },\n      {\n        onSuccess: () => {\n          toast({ title: 'Shift closed' });\n          close();\n        },\n      },\n    );\n  };\n\n  return (\n    <ActionDialog\n      open={open}\n      title=\"Close this shift?\"\n      description={`${terminal} · ${shift.tenant.name || 'Unnamed business'}`}\n      consequence={`Opened by ${shift.operatorName ?? 'someone'} on ${atTime(shift.openedAt)}. They are signed out at the till; payments already taken stay on the shift.`}\n      act=\"Close shift\"\n      tone=\"primary\"\n      pending={mutation.isPending}\n      error={mutation.error}\n      reason={reason}\n      reasonError={tried ? problem : undefined}\n      onReason={setReason}\n      onSubmit={submit}\n      onClose={close}\n    />\n  );\n}\n"],"mappings":";AAqDI;AAnDJ,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AAEzB,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAGvB,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,QAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,QAAM,WAAW,cAAc;AAC/B,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,EAAE;AACvC,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,KAAK;AAExC,MAAI,CAAC,MAAO,QAAO;AAEnB,QAAM,QAAQ,MAAM;AAClB,YAAQ;AACR,aAAS,MAAM;AACf,cAAU,EAAE;AACZ,aAAS,KAAK;AAAA,EAChB;AACA,QAAM,UAAU,YAAY,MAAM;AAClC,QAAM,WAAW,MAAM,SAAS,SAAS;AAEzC,QAAM,SAAS,MAAM;AACnB,aAAS,IAAI;AAEb,QAAI,QAAS;AAEb,aAAS;AAAA,MACP,EAAE,IAAI,MAAM,IAAI,QAAQ,OAAO,KAAK,EAAE;AAAA,MACtC;AAAA,QACE,WAAW,MAAM;AACf,gBAAM,EAAE,OAAO,eAAe,CAAC;AAC/B,gBAAM;AAAA,QACR;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAM;AAAA,MACN,aAAa,GAAG,QAAQ,SAAM,MAAM,OAAO,QAAQ,kBAAkB;AAAA,MACrE,aAAa,aAAa,MAAM,gBAAgB,SAAS,OAAO,OAAO,MAAM,QAAQ,CAAC;AAAA,MACtF,KAAI;AAAA,MACJ,MAAK;AAAA,MACL,SAAS,SAAS;AAAA,MAClB,OAAO,SAAS;AAAA,MAChB;AAAA,MACA,aAAa,QAAQ,UAAU;AAAA,MAC/B,UAAU;AAAA,MACV,UAAU;AAAA,MACV,SAAS;AAAA;AAAA,EACX;AAEJ;","names":[]}