@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/revenue/plan-mix-panel.js

@@ -0,0 +1,62 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { EmptyNote, TableRow, TableShell, Th } from "@withpotter/ui-kit";
+import { Panel } from "../_ui";
+import styles from "./revenue.module.css";
+const integer = new Intl.NumberFormat("en-US");
+function PlanMixPanel({
+  planBreakdown,
+  money,
+  caption
+}) {
+  const plans = [...planBreakdown].sort((a, b) => b.mrr - a.mrr);
+  const totalMrr = plans.reduce((sum, p) => sum + p.mrr, 0);
+  return /* @__PURE__ */ jsx(
+    Panel,
+    {
+      title: "Plan mix",
+      count: plans.length || void 0,
+      caption,
+      flush: true,
+      children: plans.length === 0 ? /* @__PURE__ */ jsx(EmptyNote, { className: styles.empty, children: "No active plans in this period." }) : /* @__PURE__ */ jsx(
+        TableShell,
+        {
+          bare: true,
+          minWidth: 420,
+          density: "compact",
+          head: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx(Th, { children: "Plan" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "Subscribers" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "MRR" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "% of MRR" })
+          ] }),
+          children: plans.map((p) => {
+            const share = totalMrr > 0 ? p.mrr / totalMrr * 100 : 0;
+            return /* @__PURE__ */ jsxs(TableRow, { children: [
+              /* @__PURE__ */ jsx("td", { className: styles.name, children: /* @__PURE__ */ jsxs("span", { className: styles.tenantText, children: [
+                p.name,
+                /* @__PURE__ */ jsx("span", { className: styles.slug, children: p.interval })
+              ] }) }),
+              /* @__PURE__ */ jsx("td", { className: styles.num, children: integer.format(p.subscribers) }),
+              /* @__PURE__ */ jsx("td", { className: styles.numStrong, children: money(p.mrr) }),
+              /* @__PURE__ */ jsx("td", { className: styles.num, children: /* @__PURE__ */ jsxs("span", { className: styles.share, children: [
+                /* @__PURE__ */ jsx("span", { className: styles.shareTrack, "aria-hidden": true, children: /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: styles.shareFill,
+                    style: { width: `${Math.min(share, 100)}%` }
+                  }
+                ) }),
+                share.toFixed(1),
+                "%"
+              ] }) })
+            ] }, p.planId);
+          })
+        }
+      )
+    }
+  );
+}
+export {
+  PlanMixPanel
+};
+//# sourceMappingURL=plan-mix-panel.js.map

package/dist/admin/revenue/plan-mix-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/plan-mix-panel.tsx"],"sourcesContent":["import type { PlatformRevenue } from '@withpotter/lib/admin-api';\nimport { EmptyNote, TableRow, TableShell, Th } from '@withpotter/ui-kit';\nimport { Panel } from '../_ui';\nimport styles from './revenue.module.css';\n\nconst integer = new Intl.NumberFormat('en-US');\n\n/** Subscriber count and MRR per plan, ranked by MRR. */\nexport function PlanMixPanel({\n  planBreakdown,\n  money,\n  caption,\n}: {\n  planBreakdown: PlatformRevenue['recurring']['planBreakdown'];\n  money: (value: number) => string;\n  caption: string;\n}) {\n  const plans = [...planBreakdown].sort((a, b) => b.mrr - a.mrr);\n  const totalMrr = plans.reduce((sum, p) => sum + p.mrr, 0);\n\n  return (\n    <Panel\n      title=\"Plan mix\"\n      count={plans.length || undefined}\n      caption={caption}\n      flush\n    >\n      {plans.length === 0 ? (\n        <EmptyNote className={styles.empty}>\n          No active plans in this period.\n        </EmptyNote>\n      ) : (\n        <TableShell\n          bare\n          minWidth={420}\n          density=\"compact\"\n          head={\n            <tr>\n              <Th>Plan</Th>\n              <Th align=\"right\">Subscribers</Th>\n              <Th align=\"right\">MRR</Th>\n              <Th align=\"right\">% of MRR</Th>\n            </tr>\n          }\n        >\n          {plans.map((p) => {\n            const share = totalMrr > 0 ? (p.mrr / totalMrr) * 100 : 0;\n            return (\n              <TableRow key={p.planId}>\n                <td className={styles.name}>\n                  <span className={styles.tenantText}>\n                    {p.name}\n                    <span className={styles.slug}>{p.interval}</span>\n                  </span>\n                </td>\n                <td className={styles.num}>\n                  {integer.format(p.subscribers)}\n                </td>\n                <td className={styles.numStrong}>{money(p.mrr)}</td>\n                <td className={styles.num}>\n                  <span className={styles.share}>\n                    <span className={styles.shareTrack} aria-hidden>\n                      <span\n                        className={styles.shareFill}\n                        style={{ width: `${Math.min(share, 100)}%` }}\n                      />\n                    </span>\n                    {share.toFixed(1)}%\n                  </span>\n                </td>\n              </TableRow>\n            );\n          })}\n        </TableShell>\n      )}\n    </Panel>\n  );\n}\n"],"mappings":"AA4BQ,cASI,YATJ;AA3BR,SAAS,WAAW,UAAU,YAAY,UAAU;AACpD,SAAS,aAAa;AACtB,OAAO,YAAY;AAEnB,MAAM,UAAU,IAAI,KAAK,aAAa,OAAO;AAGtC,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,QAAM,QAAQ,CAAC,GAAG,aAAa,EAAE,KAAK,CAAC,GAAG,MAAM,EAAE,MAAM,EAAE,GAAG;AAC7D,QAAM,WAAW,MAAM,OAAO,CAAC,KAAK,MAAM,MAAM,EAAE,KAAK,CAAC;AAExD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAO,MAAM,UAAU;AAAA,MACvB;AAAA,MACA,OAAK;AAAA,MAEJ,gBAAM,WAAW,IAChB,oBAAC,aAAU,WAAW,OAAO,OAAO,6CAEpC,IAEA;AAAA,QAAC;AAAA;AAAA,UACC,MAAI;AAAA,UACJ,UAAU;AAAA,UACV,SAAQ;AAAA,UACR,MACE,qBAAC,QACC;AAAA,gCAAC,MAAG,kBAAI;AAAA,YACR,oBAAC,MAAG,OAAM,SAAQ,yBAAW;AAAA,YAC7B,oBAAC,MAAG,OAAM,SAAQ,iBAAG;AAAA,YACrB,oBAAC,MAAG,OAAM,SAAQ,sBAAQ;AAAA,aAC5B;AAAA,UAGD,gBAAM,IAAI,CAAC,MAAM;AAChB,kBAAM,QAAQ,WAAW,IAAK,EAAE,MAAM,WAAY,MAAM;AACxD,mBACE,qBAAC,YACC;AAAA,kCAAC,QAAG,WAAW,OAAO,MACpB,+BAAC,UAAK,WAAW,OAAO,YACrB;AAAA,kBAAE;AAAA,gBACH,oBAAC,UAAK,WAAW,OAAO,MAAO,YAAE,UAAS;AAAA,iBAC5C,GACF;AAAA,cACA,oBAAC,QAAG,WAAW,OAAO,KACnB,kBAAQ,OAAO,EAAE,WAAW,GAC/B;AAAA,cACA,oBAAC,QAAG,WAAW,OAAO,WAAY,gBAAM,EAAE,GAAG,GAAE;AAAA,cAC/C,oBAAC,QAAG,WAAW,OAAO,KACpB,+BAAC,UAAK,WAAW,OAAO,OACtB;AAAA,oCAAC,UAAK,WAAW,OAAO,YAAY,eAAW,MAC7C;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAW,OAAO;AAAA,oBAClB,OAAO,EAAE,OAAO,GAAG,KAAK,IAAI,OAAO,GAAG,CAAC,IAAI;AAAA;AAAA,gBAC7C,GACF;AAAA,gBACC,MAAM,QAAQ,CAAC;AAAA,gBAAE;AAAA,iBACpB,GACF;AAAA,iBArBa,EAAE,MAsBjB;AAAA,UAEJ,CAAC;AAAA;AAAA,MACH;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/admin/revenue/platform-fees.js

@@ -0,0 +1,9 @@
+import { shownRows } from "../_ui/money-view";
+function platformFeeRows(rows, selected) {
+  const shown = shownRows(rows, selected);
+  return shown.length ? shown : null;
+}
+export {
+  platformFeeRows
+};
+//# sourceMappingURL=platform-fees.js.map

package/dist/admin/revenue/platform-fees.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/platform-fees.ts"],"sourcesContent":["import { shownRows } from '../_ui/money-view';\n\n/**\n * The platform fees rows to show, or null when the figure should be hidden.\n * The api field is optional: absent or empty means nothing to show, never a\n * zero. Rows follow the currency filter and are never added together.\n */\nexport function platformFeeRows<T extends { currency: string }>(\n  rows: readonly T[] | undefined,\n  selected: string,\n): T[] | null {\n  const shown = shownRows(rows, selected);\n  return shown.length ? shown : null;\n}\n"],"mappings":"AAAA,SAAS,iBAAiB;AAOnB,SAAS,gBACd,MACA,UACY;AACZ,QAAM,QAAQ,UAAU,MAAM,QAAQ;AACtC,SAAO,MAAM,SAAS,QAAQ;AAChC;","names":[]}

package/dist/admin/revenue/quality-panel.js

@@ -0,0 +1,71 @@
+import { jsx } from "react/jsx-runtime";
+import { Panel, moneyLines, noneText, rowFor } from "../_ui";
+import { FigureList } from "./figure-list";
+const integer = new Intl.NumberFormat("en-US");
+function QualityPanel({
+  quality,
+  money,
+  currency,
+  caption
+}) {
+  const gmv = quality.gmvByCurrency;
+  const lines = (amount) => moneyLines(gmv, currency, amount).join(" \xB7 ") || noneText(currency);
+  const codes = (gmv ?? []).map((q) => q.currency);
+  const one = rowFor(gmv, currency || (codes.length === 1 ? codes[0] : null));
+  const rows = [
+    {
+      label: "Net revenue retention",
+      note: "Starting cohort MRR, net of churn",
+      value: quality.nrrPct == null ? "\u2013" : `${quality.nrrPct}%`,
+      hint: `+${money(quality.expansionMrr)} exp \xB7 \u2212${money(
+        quality.contractionMrr
+      )} contr`
+    },
+    {
+      label: "Quick ratio",
+      note: "New + expansion vs churn + contraction",
+      value: quality.quickRatio == null ? "\u2013" : `${quality.quickRatio}\xD7`
+    },
+    {
+      label: "Churn rate",
+      note: "MRR lost as a share of the base",
+      value: quality.mrrChurnRatePct == null ? "\u2013" : `${quality.mrrChurnRatePct}%`,
+      tone: quality.mrrChurnRatePct != null && quality.mrrChurnRatePct > 0 ? "danger" : "default"
+    },
+    {
+      label: "Net GMV",
+      note: "Merchant GMV after refunds",
+      value: lines((q) => q.netGmv),
+      hint: `Gross ${lines((q) => q.grossGmv)}`
+    },
+    {
+      label: "Refunded",
+      note: "Refunded GMV in the window",
+      value: lines((q) => q.refundedGmv)
+    },
+    {
+      label: "Refund rate",
+      note: "Refunds as a share of gross GMV",
+      value: one ? `${one.refundRatePct}%` : "\u2013",
+      hint: one ? one.currency : "Pick a currency"
+    },
+    {
+      label: "Refunded orders",
+      note: "Order count, not GMV",
+      value: integer.format(
+        (gmv ?? []).filter((q) => !currency || q.currency === currency).reduce((n, q) => n + q.refundedOrders, 0)
+      )
+    },
+    {
+      label: "Logo churn rate",
+      note: "Paying merchants lost in the window",
+      value: quality.logoChurnRatePct == null ? "\u2013" : `${quality.logoChurnRatePct}%`,
+      tone: quality.logoChurnRatePct != null && quality.logoChurnRatePct > 0 ? "danger" : "default"
+    }
+  ];
+  return /* @__PURE__ */ jsx(Panel, { title: "Revenue quality", caption, children: /* @__PURE__ */ jsx(FigureList, { rows }) });
+}
+export {
+  QualityPanel
+};
+//# sourceMappingURL=quality-panel.js.map

package/dist/admin/revenue/quality-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/quality-panel.tsx"],"sourcesContent":["import type { PlatformRevenue } from '@withpotter/lib/admin-api';\nimport { Panel, moneyLines, noneText, rowFor } from '../_ui';\nimport { FigureList, type Figure } from './figure-list';\n\nconst integer = new Intl.NumberFormat('en-US');\n\ntype Quality = NonNullable<PlatformRevenue['quality']>;\n\n/** Retention and refund health over the selected window. */\nexport function QualityPanel({\n  quality,\n  money,\n  currency,\n  caption,\n}: {\n  quality: Quality;\n  /** Formats recurring revenue (MRR), in the currency the API names for it. */\n  money: (value: number) => string;\n  /** The currency filter's choice; empty shows a line per currency. */\n  currency: string;\n  caption: string;\n}) {\n  // Merchant GMV figures are per currency, joined line by line, never added.\n  const gmv = quality.gmvByCurrency;\n  const lines = (amount: (q: NonNullable<typeof gmv>[number]) => number) =>\n    moneyLines(gmv, currency, amount).join(' · ') || noneText(currency);\n  const codes = (gmv ?? []).map((q) => q.currency);\n  // A rate only reads within one currency: the chosen one, or the only one.\n  const one = rowFor(gmv, currency || (codes.length === 1 ? codes[0] : null));\n  const rows: Figure[] = [\n    {\n      label: 'Net revenue retention',\n      note: 'Starting cohort MRR, net of churn',\n      value: quality.nrrPct == null ? '–' : `${quality.nrrPct}%`,\n      hint: `+${money(quality.expansionMrr)} exp · −${money(\n        quality.contractionMrr,\n      )} contr`,\n    },\n    {\n      label: 'Quick ratio',\n      note: 'New + expansion vs churn + contraction',\n      value: quality.quickRatio == null ? '–' : `${quality.quickRatio}×`,\n    },\n    {\n      label: 'Churn rate',\n      note: 'MRR lost as a share of the base',\n      value:\n        quality.mrrChurnRatePct == null ? '–' : `${quality.mrrChurnRatePct}%`,\n      tone:\n        quality.mrrChurnRatePct != null && quality.mrrChurnRatePct > 0\n          ? 'danger'\n          : 'default',\n    },\n    {\n      label: 'Net GMV',\n      note: 'Merchant GMV after refunds',\n      value: lines((q) => q.netGmv),\n      hint: `Gross ${lines((q) => q.grossGmv)}`,\n    },\n    {\n      label: 'Refunded',\n      note: 'Refunded GMV in the window',\n      value: lines((q) => q.refundedGmv),\n    },\n    {\n      label: 'Refund rate',\n      note: 'Refunds as a share of gross GMV',\n      value: one ? `${one.refundRatePct}%` : '–',\n      hint: one ? one.currency : 'Pick a currency',\n    },\n    {\n      label: 'Refunded orders',\n      note: 'Order count, not GMV',\n      value: integer.format(\n        (gmv ?? [])\n          .filter((q) => !currency || q.currency === currency)\n          .reduce((n, q) => n + q.refundedOrders, 0),\n      ),\n    },\n    {\n      label: 'Logo churn rate',\n      note: 'Paying merchants lost in the window',\n      value:\n        quality.logoChurnRatePct == null ? '–' : `${quality.logoChurnRatePct}%`,\n      tone:\n        quality.logoChurnRatePct != null && quality.logoChurnRatePct > 0\n          ? 'danger'\n          : 'default',\n    },\n  ];\n\n  return (\n    <Panel title=\"Revenue quality\" caption={caption}>\n      <FigureList rows={rows} />\n    </Panel>\n  );\n}\n"],"mappings":"AA6FM;AA5FN,SAAS,OAAO,YAAY,UAAU,cAAc;AACpD,SAAS,kBAA+B;AAExC,MAAM,UAAU,IAAI,KAAK,aAAa,OAAO;AAKtC,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAOG;AAED,QAAM,MAAM,QAAQ;AACpB,QAAM,QAAQ,CAAC,WACb,WAAW,KAAK,UAAU,MAAM,EAAE,KAAK,QAAK,KAAK,SAAS,QAAQ;AACpE,QAAM,SAAS,OAAO,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,QAAQ;AAE/C,QAAM,MAAM,OAAO,KAAK,aAAa,MAAM,WAAW,IAAI,MAAM,CAAC,IAAI,KAAK;AAC1E,QAAM,OAAiB;AAAA,IACrB;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO,QAAQ,UAAU,OAAO,WAAM,GAAG,QAAQ,MAAM;AAAA,MACvD,MAAM,IAAI,MAAM,QAAQ,YAAY,CAAC,mBAAW;AAAA,QAC9C,QAAQ;AAAA,MACV,CAAC;AAAA,IACH;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO,QAAQ,cAAc,OAAO,WAAM,GAAG,QAAQ,UAAU;AAAA,IACjE;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OACE,QAAQ,mBAAmB,OAAO,WAAM,GAAG,QAAQ,eAAe;AAAA,MACpE,MACE,QAAQ,mBAAmB,QAAQ,QAAQ,kBAAkB,IACzD,WACA;AAAA,IACR;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO,MAAM,CAAC,MAAM,EAAE,MAAM;AAAA,MAC5B,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC;AAAA,IACzC;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO,MAAM,CAAC,MAAM,EAAE,WAAW;AAAA,IACnC;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO,MAAM,GAAG,IAAI,aAAa,MAAM;AAAA,MACvC,MAAM,MAAM,IAAI,WAAW;AAAA,IAC7B;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO,QAAQ;AAAA,SACZ,OAAO,CAAC,GACN,OAAO,CAAC,MAAM,CAAC,YAAY,EAAE,aAAa,QAAQ,EAClD,OAAO,CAAC,GAAG,MAAM,IAAI,EAAE,gBAAgB,CAAC;AAAA,MAC7C;AAAA,IACF;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OACE,QAAQ,oBAAoB,OAAO,WAAM,GAAG,QAAQ,gBAAgB;AAAA,MACtE,MACE,QAAQ,oBAAoB,QAAQ,QAAQ,mBAAmB,IAC3D,WACA;AAAA,IACR;AAAA,EACF;AAEA,SACE,oBAAC,SAAM,OAAM,mBAAkB,SAC7B,8BAAC,cAAW,MAAY,GAC1B;AAEJ;","names":[]}

package/dist/admin/revenue/revenue-kpis.js

@@ -0,0 +1,73 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ADMIN_NAME } from "../_shell/admin-brand";
+import { CountUp, Reveal, TONE } from "../_fx";
+import { MoneyLines, StatCard, rowFor } from "../_ui";
+const integer = new Intl.NumberFormat("en-US");
+function RevenueKpis({
+  data,
+  money,
+  money2,
+  currency,
+  focus,
+  gmvSpark
+}) {
+  const { recurring } = data;
+  const tracked = recurring.tracked !== false;
+  const notTracked = "Not set up yet";
+  const noSource = "The plan payments are not connected yet";
+  const gmv = rowFor(data.gmvByCurrency, focus);
+  const lifetimeShare = gmv && gmv.lifetime > 0 ? `${Math.round(gmv.inRange / gmv.lifetime * 100)}% of lifetime` : void 0;
+  return /* @__PURE__ */ jsxs("section", { "aria-label": "Revenue indicators", className: "adm-grid", children: [
+    /* @__PURE__ */ jsx(Reveal, { index: 0, className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "Plan income each month",
+        value: tracked ? /* @__PURE__ */ jsx(CountUp, { value: recurring.mrr, format: money }) : notTracked,
+        hint: `What merchants on a paid plan are expected to pay ${ADMIN_NAME} every month, in ${data.currency || "NGN"}. Free plans, trials and pauses are not counted. (MRR)`,
+        sub: tracked ? `${integer.format(recurring.payingMerchants ?? recurring.activeSubscriptions)} merchants paying` : noSource
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Reveal, { index: 1, className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "Plan income over a year",
+        value: tracked ? /* @__PURE__ */ jsx(CountUp, { value: recurring.arr, format: money }) : notTracked,
+        hint: "What plan income adds up to over a year if nothing changes: the monthly figure times 12. (ARR)",
+        sub: tracked ? "Each month times 12" : noSource
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Reveal, { index: 2, className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "Average per paying merchant",
+        value: tracked ? /* @__PURE__ */ jsx(CountUp, { value: recurring.arpa, format: money2 }) : notTracked,
+        hint: "What one paying merchant pays in a month, on average. (ARPA)",
+        sub: tracked ? "Each month" : noSource
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Reveal, { index: 3, className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "Merchant sales",
+        value: /* @__PURE__ */ jsx(
+          MoneyLines,
+          {
+            rows: data.gmvByCurrency,
+            currency,
+            amount: (g) => g.inRange,
+            empty: "No sales yet"
+          }
+        ),
+        href: "/admin/tenants",
+        sub: lifetimeShare,
+        hint: `Everything merchants sold through ${ADMIN_NAME}. This is the merchants' money, not ${ADMIN_NAME}'s own income. One line per currency; currencies are never added together. (GMV)`,
+        spark: focus ? gmvSpark : void 0,
+        sparkColor: TONE.money.fg
+      }
+    ) })
+  ] });
+}
+export {
+  RevenueKpis
+};
+//# sourceMappingURL=revenue-kpis.js.map

package/dist/admin/revenue/revenue-kpis.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/revenue-kpis.tsx"],"sourcesContent":["import { ADMIN_NAME } from '../_shell/admin-brand';\nimport type { PlatformRevenue } from '@withpotter/lib/admin-api';\nimport { CountUp, Reveal, TONE } from '../_fx';\nimport { MoneyLines, StatCard, rowFor } from '../_ui';\n\nconst integer = new Intl.NumberFormat('en-US');\n\n/** The four headline figures: recurring revenue first, then merchant GMV. */\nexport function RevenueKpis({\n  data,\n  money,\n  money2,\n  currency,\n  focus,\n  gmvSpark,\n}: {\n  data: PlatformRevenue;\n  /** Formats recurring revenue, in the currency the API names for it. */\n  money: (value: number) => string;\n  money2: (value: number) => string;\n  /** The currency filter's choice; empty shows a line per currency. */\n  currency: string;\n  /** The one currency the share and sparkline follow, or null. */\n  focus: string | null;\n  gmvSpark: number[];\n}) {\n  const { recurring } = data;\n  // Without the plan payments connected the API sends 0s; say so rather than show a zero.\n  const tracked = recurring.tracked !== false;\n  const notTracked = 'Not set up yet';\n  const noSource = 'The plan payments are not connected yet';\n  const gmv = rowFor(data.gmvByCurrency, focus);\n  const lifetimeShare =\n    gmv && gmv.lifetime > 0\n      ? `${Math.round((gmv.inRange / gmv.lifetime) * 100)}% of lifetime`\n      : undefined;\n\n  return (\n    <section aria-label=\"Revenue indicators\" className=\"adm-grid\">\n      <Reveal index={0} className=\"adm-span-3\">\n        <StatCard\n          label=\"Plan income each month\"\n          value={\n            tracked ? (\n              <CountUp value={recurring.mrr} format={money} />\n            ) : (\n              notTracked\n            )\n          }\n          hint={`What merchants on a paid plan are expected to pay ${ADMIN_NAME} every month, in ${data.currency || 'NGN'}. Free plans, trials and pauses are not counted. (MRR)`}\n          sub={\n            tracked\n              ? `${integer.format(recurring.payingMerchants ?? recurring.activeSubscriptions)} merchants paying`\n              : noSource\n          }\n        />\n      </Reveal>\n      <Reveal index={1} className=\"adm-span-3\">\n        <StatCard\n          label=\"Plan income over a year\"\n          value={\n            tracked ? (\n              <CountUp value={recurring.arr} format={money} />\n            ) : (\n              notTracked\n            )\n          }\n          hint=\"What plan income adds up to over a year if nothing changes: the monthly figure times 12. (ARR)\"\n          sub={tracked ? 'Each month times 12' : noSource}\n        />\n      </Reveal>\n      <Reveal index={2} className=\"adm-span-3\">\n        <StatCard\n          label=\"Average per paying merchant\"\n          value={\n            tracked ? (\n              <CountUp value={recurring.arpa} format={money2} />\n            ) : (\n              notTracked\n            )\n          }\n          hint=\"What one paying merchant pays in a month, on average. (ARPA)\"\n          sub={tracked ? 'Each month' : noSource}\n        />\n      </Reveal>\n      <Reveal index={3} className=\"adm-span-3\">\n        <StatCard\n          label=\"Merchant sales\"\n          value={\n            <MoneyLines\n              rows={data.gmvByCurrency}\n              currency={currency}\n              amount={(g) => g.inRange}\n              empty=\"No sales yet\"\n            />\n          }\n          href=\"/admin/tenants\"\n          sub={lifetimeShare}\n          hint={`Everything merchants sold through ${ADMIN_NAME}. This is the merchants' money, not ${ADMIN_NAME}'s own income. One line per currency; currencies are never added together. (GMV)`}\n          spark={focus ? gmvSpark : undefined}\n          sparkColor={TONE.money.fg}\n        />\n      </Reveal>\n    </section>\n  );\n}\n"],"mappings":"AAsCI,SAMU,KANV;AAtCJ,SAAS,kBAAkB;AAE3B,SAAS,SAAS,QAAQ,YAAY;AACtC,SAAS,YAAY,UAAU,cAAc;AAE7C,MAAM,UAAU,IAAI,KAAK,aAAa,OAAO;AAGtC,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAUG;AACD,QAAM,EAAE,UAAU,IAAI;AAEtB,QAAM,UAAU,UAAU,YAAY;AACtC,QAAM,aAAa;AACnB,QAAM,WAAW;AACjB,QAAM,MAAM,OAAO,KAAK,eAAe,KAAK;AAC5C,QAAM,gBACJ,OAAO,IAAI,WAAW,IAClB,GAAG,KAAK,MAAO,IAAI,UAAU,IAAI,WAAY,GAAG,CAAC,kBACjD;AAEN,SACE,qBAAC,aAAQ,cAAW,sBAAqB,WAAU,YACjD;AAAA,wBAAC,UAAO,OAAO,GAAG,WAAU,cAC1B;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OACE,UACE,oBAAC,WAAQ,OAAO,UAAU,KAAK,QAAQ,OAAO,IAE9C;AAAA,QAGJ,MAAM,qDAAqD,UAAU,oBAAoB,KAAK,YAAY,KAAK;AAAA,QAC/G,KACE,UACI,GAAG,QAAQ,OAAO,UAAU,mBAAmB,UAAU,mBAAmB,CAAC,sBAC7E;AAAA;AAAA,IAER,GACF;AAAA,IACA,oBAAC,UAAO,OAAO,GAAG,WAAU,cAC1B;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OACE,UACE,oBAAC,WAAQ,OAAO,UAAU,KAAK,QAAQ,OAAO,IAE9C;AAAA,QAGJ,MAAK;AAAA,QACL,KAAK,UAAU,wBAAwB;AAAA;AAAA,IACzC,GACF;AAAA,IACA,oBAAC,UAAO,OAAO,GAAG,WAAU,cAC1B;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OACE,UACE,oBAAC,WAAQ,OAAO,UAAU,MAAM,QAAQ,QAAQ,IAEhD;AAAA,QAGJ,MAAK;AAAA,QACL,KAAK,UAAU,eAAe;AAAA;AAAA,IAChC,GACF;AAAA,IACA,oBAAC,UAAO,OAAO,GAAG,WAAU,cAC1B;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OACE;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,KAAK;AAAA,YACX;AAAA,YACA,QAAQ,CAAC,MAAM,EAAE;AAAA,YACjB,OAAM;AAAA;AAAA,QACR;AAAA,QAEF,MAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM,qCAAqC,UAAU,uCAAuC,UAAU;AAAA,QACtG,OAAO,QAAQ,WAAW;AAAA,QAC1B,YAAY,KAAK,MAAM;AAAA;AAAA,IACzB,GACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/revenue/revenue-overview.js

@@ -0,0 +1,132 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { TimeSeriesChart } from "@withpotter/components/charts";
+import { MoneyLines, PICK_CURRENCY, Panel, StatCard, moneyIn, rowFor, toTrend } from "../_ui";
+import { Reveal } from "../_fx";
+import { Tinted } from "../audit/tinted";
+import { ChannelPanel } from "./channel-panel";
+import { MethodCards } from "./method-cards";
+import { HealthPanel } from "./health-panel";
+import { PlanMixPanel } from "./plan-mix-panel";
+import { platformFeeRows } from "./platform-fees";
+import { RevenueKpis } from "./revenue-kpis";
+import { SubscriptionsPanel } from "./subscriptions-panel";
+import { TopTenantsPanel } from "./top-tenants-panel";
+import styles from "./revenue.module.css";
+import ledgerStyles from "./ledger.module.css";
+function RevenueOverview({
+  data,
+  health,
+  money,
+  money2,
+  currency,
+  focus,
+  period,
+  span,
+  recurringCaption,
+  channels,
+  ledger
+}) {
+  const gmv = rowFor(data.gmvByCurrency, focus);
+  const gmvSeries = useMemo(() => toTrend(gmv?.series, "gmv"), [gmv]);
+  const gmvCaption = focus ? `${period} \xB7 ${focus}` : period;
+  const recurringTracked = data.recurring.tracked !== false;
+  const platformFees = platformFeeRows(data.platformFeesEarnedByCurrency, currency);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      RevenueKpis,
+      {
+        data,
+        money,
+        money2,
+        currency,
+        focus,
+        gmvSpark: gmvSeries.map((p) => p.value)
+      }
+    ),
+    platformFees && /* @__PURE__ */ jsx("section", { "aria-label": "Platform fees", className: "adm-grid", children: /* @__PURE__ */ jsx(Reveal, { index: 0, className: "adm-span-3", children: /* @__PURE__ */ jsx(
+      StatCard,
+      {
+        label: "Platform fees earned",
+        value: /* @__PURE__ */ jsx(
+          MoneyLines,
+          {
+            rows: platformFees,
+            currency: "",
+            amount: (r) => r.amount,
+            decimals: 2
+          }
+        ),
+        hint: "What Olive keeps from payouts, settlements and subscriptions."
+      }
+    ) }) }),
+    /* @__PURE__ */ jsx("div", { className: "adm-grid", children: /* @__PURE__ */ jsx("div", { className: "adm-span-12", children: /* @__PURE__ */ jsx(
+      Panel,
+      {
+        title: "GMV trend",
+        caption: gmvCaption,
+        height: "calc(var(--adm-panel-h) + 32px)",
+        children: focus ? /* @__PURE__ */ jsx("div", { className: styles.flatChart, children: /* @__PURE__ */ jsx(Tinted, { tone: "money", children: /* @__PURE__ */ jsx(
+          TimeSeriesChart,
+          {
+            data: gmvSeries,
+            compare: null,
+            compareLabel: `Previous ${span}`,
+            formatValue: moneyIn(focus),
+            emptyMessage: `No paid ${focus} orders in this window yet`,
+            height: 240
+          }
+        ) }) }) : /* @__PURE__ */ jsx("p", { className: styles.empty, children: PICK_CURRENCY })
+      }
+    ) }) }),
+    ledger && focus ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("h2", { className: ledgerStyles.sectionTitle, children: "How customers paid" }),
+      /* @__PURE__ */ jsxs("p", { className: ledgerStyles.sectionNote, children: [
+        "Money customers paid to merchants, by way of paying. ",
+        gmvCaption
+      ] }),
+      /* @__PURE__ */ jsx(
+        MethodCards,
+        {
+          now: ledger.byChannel.current,
+          before: ledger.byChannel.previous,
+          currency: focus
+        }
+      )
+    ] }) : channels && channels.length > 0 && /* @__PURE__ */ jsx("div", { className: "adm-grid", children: /* @__PURE__ */ jsx("div", { className: "adm-span-12", children: /* @__PURE__ */ jsx(ChannelPanel, { totals: channels, focus, caption: gmvCaption }) }) }),
+    recurringTracked && /* @__PURE__ */ jsxs("div", { className: "adm-grid", children: [
+      /* @__PURE__ */ jsx("div", { className: "adm-span-7", children: /* @__PURE__ */ jsx(
+        HealthPanel,
+        {
+          health,
+          money,
+          caption: recurringCaption
+        }
+      ) }),
+      /* @__PURE__ */ jsx("div", { className: "adm-span-5", children: /* @__PURE__ */ jsx(
+        PlanMixPanel,
+        {
+          planBreakdown: data.recurring.planBreakdown,
+          money,
+          caption: recurringCaption
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "adm-grid", children: [
+      /* @__PURE__ */ jsx("div", { className: recurringTracked ? "adm-span-8" : "adm-span-12", children: /* @__PURE__ */ jsx(
+        TopTenantsPanel,
+        {
+          tenants: gmv?.topTenants ?? [],
+          lifetime: gmv?.lifetime ?? 0,
+          focus
+        }
+      ) }),
+      recurringTracked && /* @__PURE__ */ jsx("div", { className: "adm-span-4", children: /* @__PURE__ */ jsx(SubscriptionsPanel, { recurring: data.recurring, span }) })
+    ] })
+  ] });
+}
+export {
+  RevenueOverview
+};
+//# sourceMappingURL=revenue-overview.js.map

package/dist/admin/revenue/revenue-overview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/revenue-overview.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\nimport { TimeSeriesChart } from '@withpotter/components/charts';\nimport type {\n  GatewayChannelTotal,\n  MerchantPaymentsPage,\n  PlatformCockpit,\n  PlatformRevenue,\n} from '@withpotter/lib/admin-api';\nimport { MoneyLines, PICK_CURRENCY, Panel, StatCard, moneyIn, rowFor, toTrend } from '../_ui';\nimport { Reveal } from '../_fx';\nimport { Tinted } from '../audit/tinted';\nimport { ChannelPanel } from './channel-panel';\nimport { MethodCards } from './method-cards';\nimport { HealthPanel } from './health-panel';\nimport { PlanMixPanel } from './plan-mix-panel';\nimport { platformFeeRows } from './platform-fees';\nimport { RevenueKpis } from './revenue-kpis';\nimport { SubscriptionsPanel } from './subscriptions-panel';\nimport { TopTenantsPanel } from './top-tenants-panel';\nimport styles from './revenue.module.css';\nimport ledgerStyles from './ledger.module.css';\n\n/**\n * Overview tab: the four headline figures, then the GMV trend as the one\n * full-width primary chart, then revenue health, plan mix, top merchants\n * and subscriptions beneath it. Merchant GMV is per currency: the chart and\n * the leaderboard follow one currency (`focus`), never a mix.\n */\nexport function RevenueOverview({\n  data,\n  health,\n  money,\n  money2,\n  currency,\n  focus,\n  period,\n  span,\n  recurringCaption,\n  channels,\n  ledger,\n}: {\n  data: PlatformRevenue;\n  health: PlatformCockpit['health'] | undefined;\n  /** Formats recurring revenue, in the currency the API names for it. */\n  money: (value: number) => string;\n  money2: (value: number) => string;\n  /** The currency filter's choice; empty shows a line per currency. */\n  currency: string;\n  /** The one currency the chart and leaderboard show, or null. */\n  focus: string | null;\n  period: string;\n  span: string;\n  recurringCaption: string;\n  /** How customers paid, per channel and currency. Absent when the box cannot say. */\n  channels?: readonly GatewayChannelTotal[];\n  /** The merchant payments view's totals, with the period before; absent on a box without it. */\n  ledger?: MerchantPaymentsPage;\n}) {\n  const gmv = rowFor(data.gmvByCurrency, focus);\n  const gmvSeries = useMemo(() => toTrend(gmv?.series, 'gmv'), [gmv]);\n  const gmvCaption = focus ? `${period} · ${focus}` : period;\n  const recurringTracked = data.recurring.tracked !== false;\n  // Hidden until the api sends the field; never an invented zero.\n  const platformFees = platformFeeRows(data.platformFeesEarnedByCurrency, currency);\n\n  return (\n    <>\n      <RevenueKpis\n        data={data}\n        money={money}\n        money2={money2}\n        currency={currency}\n        focus={focus}\n        gmvSpark={gmvSeries.map((p) => p.value)}\n      />\n\n      {platformFees && (\n        <section aria-label=\"Platform fees\" className=\"adm-grid\">\n          <Reveal index={0} className=\"adm-span-3\">\n            <StatCard\n              label=\"Platform fees earned\"\n              value={\n                <MoneyLines\n                  rows={platformFees}\n                  currency=\"\"\n                  amount={(r) => r.amount}\n                  decimals={2}\n                />\n              }\n              hint=\"What Olive keeps from payouts, settlements and subscriptions.\"\n            />\n          </Reveal>\n        </section>\n      )}\n\n      <div className=\"adm-grid\">\n        <div className=\"adm-span-12\">\n          <Panel\n            title=\"GMV trend\"\n            caption={gmvCaption}\n            height=\"calc(var(--adm-panel-h) + 32px)\"\n          >\n            {focus ? (\n              <div className={styles.flatChart}>\n                <Tinted tone=\"money\">\n                  <TimeSeriesChart\n                    data={gmvSeries}\n                    compare={null}\n                    compareLabel={`Previous ${span}`}\n                    formatValue={moneyIn(focus)}\n                    emptyMessage={`No paid ${focus} orders in this window yet`}\n                    height={240}\n                  />\n                </Tinted>\n              </div>\n            ) : (\n              <p className={styles.empty}>{PICK_CURRENCY}</p>\n            )}\n          </Panel>\n        </div>\n      </div>\n\n      {ledger && focus ? (\n        <>\n          <h2 className={ledgerStyles.sectionTitle}>How customers paid</h2>\n          <p className={ledgerStyles.sectionNote}>\n            Money customers paid to merchants, by way of paying. {gmvCaption}\n          </p>\n          <MethodCards\n            now={ledger.byChannel.current}\n            before={ledger.byChannel.previous}\n            currency={focus}\n          />\n        </>\n      ) : (\n        channels &&\n        channels.length > 0 && (\n          <div className=\"adm-grid\">\n            <div className=\"adm-span-12\">\n              <ChannelPanel totals={channels} focus={focus} caption={gmvCaption} />\n            </div>\n          </div>\n        )\n      )}\n\n      {recurringTracked && (\n        <div className=\"adm-grid\">\n          <div className=\"adm-span-7\">\n            <HealthPanel\n              health={health}\n              money={money}\n              caption={recurringCaption}\n            />\n          </div>\n          <div className=\"adm-span-5\">\n            <PlanMixPanel\n              planBreakdown={data.recurring.planBreakdown}\n              money={money}\n              caption={recurringCaption}\n            />\n          </div>\n        </div>\n      )}\n\n      <div className=\"adm-grid\">\n        <div className={recurringTracked ? 'adm-span-8' : 'adm-span-12'}>\n          <TopTenantsPanel\n            tenants={gmv?.topTenants ?? []}\n            lifetime={gmv?.lifetime ?? 0}\n            focus={focus}\n          />\n        </div>\n        {recurringTracked && (\n          <div className=\"adm-span-4\">\n            <SubscriptionsPanel recurring={data.recurring} span={span} />\n          </div>\n        )}\n      </div>\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/revenue/revenue-retention.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { EmptyBlock } from "../audit/empty-block";
+import { CohortPanel } from "./cohort-panel";
+import { QualityPanel } from "./quality-panel";
+function RevenueRetention({
+  quality,
+  money,
+  currency,
+  caption
+}) {
+  if (!quality) {
+    return /* @__PURE__ */ jsx(EmptyBlock, { message: "Retention appears once there is enough billing history." });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "adm-grid", children: [
+    /* @__PURE__ */ jsx("div", { className: "adm-span-5", children: /* @__PURE__ */ jsx(
+      QualityPanel,
+      {
+        quality,
+        money,
+        currency,
+        caption
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "adm-span-7", children: /* @__PURE__ */ jsx(CohortPanel, { cohorts: quality.cohorts }) })
+  ] });
+}
+export {
+  RevenueRetention
+};
+//# sourceMappingURL=revenue-retention.js.map

package/dist/admin/revenue/revenue-retention.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/revenue-retention.tsx"],"sourcesContent":["'use client';\n\nimport type { PlatformRevenue } from '@withpotter/lib/admin-api';\nimport { EmptyBlock } from '../audit/empty-block';\nimport { CohortPanel } from './cohort-panel';\nimport { QualityPanel } from './quality-panel';\n\n/** Retention tab: revenue quality beside logo cohort retention. */\nexport function RevenueRetention({\n  quality,\n  money,\n  currency,\n  caption,\n}: {\n  quality: PlatformRevenue['quality'];\n  money: (value: number) => string;\n  /** The currency filter's choice; empty shows a line per currency. */\n  currency: string;\n  caption: string;\n}) {\n  if (!quality) {\n    return (\n      <EmptyBlock message=\"Retention appears once there is enough billing history.\" />\n    );\n  }\n\n  return (\n    <div className=\"adm-grid\">\n      <div className=\"adm-span-5\">\n        <QualityPanel\n          quality={quality}\n          money={money}\n          currency={currency}\n          caption={caption}\n        />\n      </div>\n      <div className=\"adm-span-7\">\n        <CohortPanel cohorts={quality.cohorts} />\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAsBM,cAKF,YALE;AAnBN,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAGtB,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,MAAI,CAAC,SAAS;AACZ,WACE,oBAAC,cAAW,SAAQ,2DAA0D;AAAA,EAElF;AAEA,SACE,qBAAC,SAAI,WAAU,YACb;AAAA,wBAAC,SAAI,WAAU,cACb;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,GACF;AAAA,IACA,oBAAC,SAAI,WAAU,cACb,8BAAC,eAAY,SAAS,QAAQ,SAAS,GACzC;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/revenue/revenue-workspace.js

@@ -0,0 +1,171 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { ADMIN_NAME } from "../_shell/admin-brand";
+import {
+  useGatewayChannels,
+  useMerchantPayments,
+  usePlatformCockpit,
+  usePlatformRevenue
+} from "../hooks";
+import { LoadFailed } from "../audit/load-failed";
+import {
+  AdmLoading,
+  CurrencyFilter,
+  PageHeader,
+  PageTabs,
+  PeriodSelector,
+  customRange,
+  focusCurrency,
+  moneyIn,
+  periodPhrase,
+  rangeFromKey,
+  useCurrencyParam,
+  usePersistedDateRange,
+  useTabParam
+} from "../_ui";
+import { MerchantPaymentsView } from "./merchant-payments-view";
+import { RevenueOverview } from "./revenue-overview";
+import { RevenueRetention } from "./revenue-retention";
+import { SubscriptionsView } from "./subscriptions-view";
+const TABS = [
+  { id: "overview", label: "Overview" },
+  { id: "merchants", label: "Merchant payments" },
+  { id: "subscriptions", label: "Subscriptions" },
+  { id: "retention", label: "Retention" }
+];
+const KEYS = TABS.map((t) => t.id);
+function RevenueWorkspace() {
+  const [tab, setTab] = useTabParam(KEYS);
+  const {
+    rangeKey,
+    setRangeKey,
+    customStart,
+    customEnd,
+    onCustomChange
+  } = usePersistedDateRange();
+  const [currency, setCurrency] = useCurrencyParam();
+  const range = useMemo(
+    () => rangeKey === "custom" ? customRange(customStart, customEnd) : rangeFromKey(rangeKey),
+    [rangeKey, customStart, customEnd]
+  );
+  const { data, isLoading, isError, refetch } = usePlatformRevenue({
+    startDate: range.startDate,
+    endDate: range.endDate
+  });
+  const cockpit = usePlatformCockpit({
+    startDate: range.startDate,
+    endDate: range.endDate
+  });
+  const channels = useGatewayChannels({
+    startDate: range.startDate,
+    endDate: range.endDate
+  });
+  const ledger = useMerchantPayments({
+    startDate: range.startDate,
+    endDate: range.endDate,
+    limit: 1
+  });
+  const currencies = useMemo(() => data?.currencies ?? [], [data]);
+  const focus = focusCurrency(currencies, currency);
+  const recurringCurrency = data?.currency || "NGN";
+  const money = useMemo(() => moneyIn(recurringCurrency), [recurringCurrency]);
+  const money2 = useMemo(
+    () => moneyIn(recurringCurrency, 2),
+    [recurringCurrency]
+  );
+  const span = periodPhrase(range);
+  const period = `${span[0].toUpperCase()}${span.slice(1)}`;
+  let body;
+  if (isError) {
+    body = /* @__PURE__ */ jsx(
+      LoadFailed,
+      {
+        message: "Revenue for this period could not be loaded.",
+        onRetry: () => void refetch()
+      }
+    );
+  } else if (isLoading || !data) {
+    body = /* @__PURE__ */ jsx(AdmLoading, { label: "Loading revenue metrics\u2026" });
+  } else if (tab === "merchants") {
+    body = /* @__PURE__ */ jsx(
+      MerchantPaymentsView,
+      {
+        startDate: range.startDate,
+        endDate: range.endDate,
+        currency
+      }
+    );
+  } else if (tab === "subscriptions") {
+    body = /* @__PURE__ */ jsx(
+      SubscriptionsView,
+      {
+        startDate: range.startDate,
+        endDate: range.endDate,
+        revenue: data
+      }
+    );
+  } else if (tab === "retention") {
+    body = /* @__PURE__ */ jsx(
+      RevenueRetention,
+      {
+        quality: data.quality,
+        money,
+        currency,
+        caption: currency ? `${period} \xB7 ${currency}` : period
+      }
+    );
+  } else {
+    body = /* @__PURE__ */ jsx(
+      RevenueOverview,
+      {
+        data,
+        health: cockpit.data?.health,
+        money,
+        money2,
+        currency,
+        focus,
+        period,
+        span,
+        recurringCaption: `${period} \xB7 ${recurringCurrency}`,
+        channels: channels.data?.byChannel,
+        ledger: ledger.data
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      PageHeader,
+      {
+        title: "Revenue",
+        description: `All the money moving through ${ADMIN_NAME}: what customers pay merchants, and what merchants pay ${ADMIN_NAME} for their plan.`,
+        actions: /* @__PURE__ */ jsxs("div", { className: "adm-toolbar", children: [
+          /* @__PURE__ */ jsx(
+            CurrencyFilter,
+            {
+              value: currency,
+              onChange: setCurrency,
+              currencies
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            PeriodSelector,
+            {
+              value: rangeKey,
+              onChange: setRangeKey,
+              customStart,
+              customEnd,
+              onCustomChange
+            }
+          )
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx(PageTabs, { tabs: TABS, active: tab, onChange: setTab }),
+    body
+  ] });
+}
+export {
+  RevenueWorkspace
+};
+//# sourceMappingURL=revenue-workspace.js.map

package/dist/admin/revenue/revenue-workspace.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/revenue-workspace.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\nimport { ADMIN_NAME } from '../_shell/admin-brand';\nimport {\n  useGatewayChannels,\n  useMerchantPayments,\n  usePlatformCockpit,\n  usePlatformRevenue,\n} from '../hooks';\nimport { LoadFailed } from '../audit/load-failed';\nimport {\n  AdmLoading,\n  CurrencyFilter,\n  PageHeader,\n  PageTabs,\n  PeriodSelector,\n  customRange,\n  focusCurrency,\n  moneyIn,\n  periodPhrase,\n  rangeFromKey,\n  useCurrencyParam,\n  usePersistedDateRange,\n  useTabParam,\n} from '../_ui';\nimport { MerchantPaymentsView } from './merchant-payments-view';\nimport { RevenueOverview } from './revenue-overview';\nimport { RevenueRetention } from './revenue-retention';\nimport { SubscriptionsView } from './subscriptions-view';\n\nconst TABS = [\n  { id: 'overview', label: 'Overview' },\n  { id: 'merchants', label: 'Merchant payments' },\n  { id: 'subscriptions', label: 'Subscriptions' },\n  { id: 'retention', label: 'Retention' },\n] as const;\n\nconst KEYS = TABS.map((t) => t.id);\n\n/**\n * Revenue: the whole picture on Overview, what customers paid merchants on\n * Merchant payments, what merchants pay Olive on Subscriptions, and revenue\n * quality and cohorts on Retention.\n */\nexport function RevenueWorkspace() {\n  const [tab, setTab] = useTabParam(KEYS);\n  const {\n    rangeKey,\n    setRangeKey,\n    customStart,\n    customEnd,\n    onCustomChange,\n  } = usePersistedDateRange();\n  // Merchant GMV comes back once per currency; `?currency=` narrows it.\n  const [currency, setCurrency] = useCurrencyParam();\n\n  const range = useMemo(\n    () =>\n      rangeKey === 'custom'\n        ? customRange(customStart, customEnd)\n        : rangeFromKey(rangeKey),\n    [rangeKey, customStart, customEnd],\n  );\n\n  const { data, isLoading, isError, refetch } = usePlatformRevenue({\n    startDate: range.startDate,\n    endDate: range.endDate,\n  });\n  // Revenue health (MRR movement, logo churn, concentration) is computed as\n  // part of the cockpit, not the revenue endpoint — fetched here too rather\n  // than duplicating that aggregation.\n  const cockpit = usePlatformCockpit({\n    startDate: range.startDate,\n    endDate: range.endDate,\n  });\n\n  const channels = useGatewayChannels({\n    startDate: range.startDate,\n    endDate: range.endDate,\n  });\n\n  // The same totals the Merchant payments tab reads, one row only, for the method cards.\n  const ledger = useMerchantPayments({\n    startDate: range.startDate,\n    endDate: range.endDate,\n    limit: 1,\n  });\n\n  const currencies = useMemo(() => data?.currencies ?? [], [data]);\n  const focus = focusCurrency(currencies, currency);\n  // Recurring revenue is the platform's own billing, in the currency the API\n  // names for it (`currency`), shown as it comes, never converted.\n  const recurringCurrency = data?.currency || 'NGN';\n  const money = useMemo(() => moneyIn(recurringCurrency), [recurringCurrency]);\n  const money2 = useMemo(\n    () => moneyIn(recurringCurrency, 2),\n    [recurringCurrency],\n  );\n\n  const span = periodPhrase(range);\n  const period = `${span[0].toUpperCase()}${span.slice(1)}`;\n\n  let body;\n  if (isError) {\n    body = (\n      <LoadFailed\n        message=\"Revenue for this period could not be loaded.\"\n        onRetry={() => void refetch()}\n      />\n    );\n  } else if (isLoading || !data) {\n    body = <AdmLoading label=\"Loading revenue metrics…\" />;\n  } else if (tab === 'merchants') {\n    body = (\n      <MerchantPaymentsView\n        startDate={range.startDate}\n        endDate={range.endDate}\n        currency={currency}\n      />\n    );\n  } else if (tab === 'subscriptions') {\n    body = (\n      <SubscriptionsView\n        startDate={range.startDate}\n        endDate={range.endDate}\n        revenue={data}\n      />\n    );\n  } else if (tab === 'retention') {\n    body = (\n      <RevenueRetention\n        quality={data.quality}\n        money={money}\n        currency={currency}\n        caption={currency ? `${period} · ${currency}` : period}\n      />\n    );\n  } else {\n    body = (\n      <RevenueOverview\n        data={data}\n        health={cockpit.data?.health}\n        money={money}\n        money2={money2}\n        currency={currency}\n        focus={focus}\n        period={period}\n        span={span}\n        recurringCaption={`${period} · ${recurringCurrency}`}\n        channels={channels.data?.byChannel}\n        ledger={ledger.data}\n      />\n    );\n  }\n\n  return (\n    <div>\n      <PageHeader\n        title=\"Revenue\"\n        description={`All the money moving through ${ADMIN_NAME}: what customers pay merchants, and what merchants pay ${ADMIN_NAME} for their plan.`}\n        actions={\n          <div className=\"adm-toolbar\">\n            <CurrencyFilter\n              value={currency}\n              onChange={setCurrency}\n              currencies={currencies}\n            />\n            <PeriodSelector\n              value={rangeKey}\n              onChange={setRangeKey}\n              customStart={customStart}\n              customEnd={customEnd}\n              onCustomChange={onCustomChange}\n            />\n          </div>\n        }\n      />\n      <PageTabs tabs={TABS} active={tab} onChange={setTab} />\n      {body}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}