@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/revenue/revenue.module.css

@@ -0,0 +1,196 @@
+/* Revenue: figure lists and tables on the 4px rhythm, numbers right. */
+
+/* ---- GMV trend: the primary chart, a line over a flat 8% tint ---- */
+.flatChart {
+  height: 100%;
+  min-height: 0;
+}
+
+/* The shared GrowthChart paints its area with a gradient; flatten it here. */
+.flatChart path[fill^='url'] {
+  fill: color-mix(in srgb, var(--accent-primary) 8%, transparent);
+}
+
+/* ---- Figure list (label + note left, value right) ---- */
+.figures {
+  display: grid;
+  margin: 0;
+  /* Clear of the panel's bottom fade, so the last row is never dimmed. */
+  padding-bottom: 8px;
+}
+
+.figures > div {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 12px 0;
+  border-top: 1px solid var(--border-subtle);
+}
+
+.figures > div:first-child {
+  border-top: 0;
+  padding-top: 4px;
+}
+
+.figures dt {
+  display: grid;
+  min-width: 0;
+}
+
+.figureLabel {
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 20px;
+  overflow-wrap: anywhere;
+  color: var(--text-primary);
+}
+
+.figurePill {
+  display: flex;
+  margin-bottom: 4px;
+}
+
+.figureNote {
+  font-size: 12px;
+  line-height: 16px;
+  color: var(--text-tertiary);
+}
+
+.figures dd {
+  display: grid;
+  justify-items: end;
+  max-width: 55%;
+  margin: 0;
+  flex-shrink: 0;
+  text-align: right;
+}
+
+.figureValue {
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 24px;
+  white-space: nowrap;
+  font-variant-numeric: tabular-nums;
+  color: var(--text-primary);
+}
+
+.figureValue[data-tone='danger'] {
+  color: var(--error);
+}
+
+.figureValue[data-tone='danger']::before {
+  content: '';
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  margin-right: 8px;
+  vertical-align: middle;
+  border-radius: 999px;
+  background: var(--error);
+}
+
+.figureHint {
+  font-size: 12px;
+  line-height: 16px;
+  font-variant-numeric: tabular-nums;
+  color: var(--text-tertiary);
+}
+
+/* ---- Tables ---- */
+.name {
+  max-width: 0;
+}
+
+.name a {
+  display: block;
+  overflow: hidden;
+  font-weight: 500;
+  text-decoration: none;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--text-primary);
+}
+
+.name a:hover {
+  color: var(--accent-ink, var(--accent-primary));
+}
+
+.slug {
+  display: block;
+  overflow: hidden;
+  font-size: 12px;
+  line-height: 16px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--text-tertiary);
+}
+
+.cohort {
+  font-weight: 500;
+  white-space: nowrap;
+  color: var(--text-primary);
+}
+
+.num,
+.numStrong {
+  text-align: right;
+  white-space: nowrap;
+  font-variant-numeric: tabular-nums;
+  color: var(--text-secondary);
+}
+
+.numStrong {
+  font-weight: 500;
+  color: var(--text-primary);
+}
+
+.heat {
+  text-align: right;
+  white-space: nowrap;
+  font-variant-numeric: tabular-nums;
+  color: var(--text-primary);
+}
+
+.heat[data-empty='true'] {
+  color: var(--text-tertiary);
+}
+
+.empty {
+  padding: 16px;
+}
+
+/* ---- Top tenants: identity and share bar ---- */
+.tenant {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  min-width: 0;
+}
+
+.tenantText {
+  display: grid;
+  min-width: 0;
+}
+
+.share {
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 8px;
+}
+
+.shareTrack {
+  width: 48px;
+  height: 4px;
+  overflow: hidden;
+  border-radius: 999px;
+  background: var(--adm-hover);
+}
+
+.shareFill {
+  display: block;
+  height: 100%;
+  border-radius: 999px;
+  background: var(--accent-primary);
+}

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

@@ -0,0 +1,58 @@
+import { jsx } from "react/jsx-runtime";
+import { Panel } from "../_ui";
+import { FigureList } from "./figure-list";
+const integer = new Intl.NumberFormat("en-US");
+function SubscriptionsPanel({
+  recurring,
+  span
+}) {
+  const rows = [
+    {
+      label: "Past due",
+      status: "past_due",
+      note: "Payment failed, at risk of churning",
+      value: integer.format(recurring.pastDueSubscriptions),
+      tone: recurring.pastDueSubscriptions > 0 ? "danger" : "default"
+    },
+    {
+      label: "Non-renewing",
+      status: "non_renewing",
+      note: "Set to cancel at period end",
+      value: integer.format(recurring.nonRenewingSubscriptions),
+      tone: recurring.nonRenewingSubscriptions > 0 ? "danger" : "default"
+    },
+    {
+      label: "Active",
+      status: "active",
+      note: "Paying on a live billing cycle",
+      value: integer.format(recurring.activeSubscriptions)
+    },
+    {
+      label: "Trialing",
+      status: "trialing",
+      note: "In trial, not yet billed",
+      value: integer.format(recurring.trialingSubscriptions)
+    },
+    {
+      label: "New this period",
+      note: `Started in ${span}`,
+      value: integer.format(recurring.newInRange)
+    },
+    {
+      label: "Churned this period",
+      note: `Cancelled in ${span}`,
+      value: integer.format(recurring.churnedInRange),
+      tone: recurring.churnedInRange > 0 ? "danger" : "default"
+    },
+    {
+      label: "Cancelled",
+      note: "Lifetime total",
+      value: integer.format(recurring.cancelledSubscriptions)
+    }
+  ];
+  return /* @__PURE__ */ jsx(Panel, { title: "Subscriptions", caption: "Today", height: "var(--adm-panel-h)", children: /* @__PURE__ */ jsx(FigureList, { rows }) });
+}
+export {
+  SubscriptionsPanel
+};
+//# sourceMappingURL=subscriptions-panel.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/subscriptions-panel.tsx"],"sourcesContent":["import type { PlatformRevenue } from '@withpotter/lib/admin-api';\nimport { Panel } from '../_ui';\nimport { FigureList, type Figure } from './figure-list';\n\nconst integer = new Intl.NumberFormat('en-US');\n\n/** Where the subscription base stands, and what started in the window. */\nexport function SubscriptionsPanel({\n  recurring,\n  span,\n}: {\n  recurring: PlatformRevenue['recurring'];\n  span: string;\n}) {\n  const rows: Figure[] = [\n    {\n      label: 'Past due',\n      status: 'past_due',\n      note: 'Payment failed, at risk of churning',\n      value: integer.format(recurring.pastDueSubscriptions),\n      tone: recurring.pastDueSubscriptions > 0 ? 'danger' : 'default',\n    },\n    {\n      label: 'Non-renewing',\n      status: 'non_renewing',\n      note: 'Set to cancel at period end',\n      value: integer.format(recurring.nonRenewingSubscriptions),\n      tone: recurring.nonRenewingSubscriptions > 0 ? 'danger' : 'default',\n    },\n    {\n      label: 'Active',\n      status: 'active',\n      note: 'Paying on a live billing cycle',\n      value: integer.format(recurring.activeSubscriptions),\n    },\n    {\n      label: 'Trialing',\n      status: 'trialing',\n      note: 'In trial, not yet billed',\n      value: integer.format(recurring.trialingSubscriptions),\n    },\n    {\n      label: 'New this period',\n      note: `Started in ${span}`,\n      value: integer.format(recurring.newInRange),\n    },\n    {\n      label: 'Churned this period',\n      note: `Cancelled in ${span}`,\n      value: integer.format(recurring.churnedInRange),\n      tone: recurring.churnedInRange > 0 ? 'danger' : 'default',\n    },\n    {\n      label: 'Cancelled',\n      note: 'Lifetime total',\n      value: integer.format(recurring.cancelledSubscriptions),\n    },\n  ];\n\n  return (\n    <Panel title=\"Subscriptions\" caption=\"Today\" height=\"var(--adm-panel-h)\">\n      <FigureList rows={rows} />\n    </Panel>\n  );\n}\n"],"mappings":"AA6DM;AA5DN,SAAS,aAAa;AACtB,SAAS,kBAA+B;AAExC,MAAM,UAAU,IAAI,KAAK,aAAa,OAAO;AAGtC,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AACF,GAGG;AACD,QAAM,OAAiB;AAAA,IACrB;AAAA,MACE,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO,QAAQ,OAAO,UAAU,oBAAoB;AAAA,MACpD,MAAM,UAAU,uBAAuB,IAAI,WAAW;AAAA,IACxD;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO,QAAQ,OAAO,UAAU,wBAAwB;AAAA,MACxD,MAAM,UAAU,2BAA2B,IAAI,WAAW;AAAA,IAC5D;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO,QAAQ,OAAO,UAAU,mBAAmB;AAAA,IACrD;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO,QAAQ,OAAO,UAAU,qBAAqB;AAAA,IACvD;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM,cAAc,IAAI;AAAA,MACxB,OAAO,QAAQ,OAAO,UAAU,UAAU;AAAA,IAC5C;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM,gBAAgB,IAAI;AAAA,MAC1B,OAAO,QAAQ,OAAO,UAAU,cAAc;AAAA,MAC9C,MAAM,UAAU,iBAAiB,IAAI,WAAW;AAAA,IAClD;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO,QAAQ,OAAO,UAAU,sBAAsB;AAAA,IACxD;AAAA,EACF;AAEA,SACE,oBAAC,SAAM,OAAM,iBAAgB,SAAQ,SAAQ,QAAO,sBAClD,8BAAC,cAAW,MAAY,GAC1B;AAEJ;","names":[]}

package/dist/admin/revenue/subscriptions-view.js

@@ -0,0 +1,188 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import { EmptyNote, TableRow, TableShell, Th } from "@withpotter/ui-kit";
+import {
+  platformAdminApi
+} from "@withpotter/lib/admin-api";
+import { useSubscriptionPayments } from "../hooks";
+import { CountUp, Reveal } from "../_fx";
+import { AdmLoading, FilterSearch, FilterSelect, Filters, Pagination, StatCard, moneyIn } from "../_ui";
+import { DownloadButton } from "./download-button";
+import {
+  PURPOSE_WORDS,
+  STATUS_WORDS,
+  SUBSCRIPTION_METHOD_WORDS,
+  downloadName,
+  minorToMoney,
+  word
+} from "./ledger-model";
+import { PlanMixPanel } from "./plan-mix-panel";
+import styles from "./ledger.module.css";
+import table from "./revenue.module.css";
+const PAGE_SIZE = 25;
+const integer = new Intl.NumberFormat("en-US");
+const STATUSES = [
+  { value: "", label: "Every result" },
+  { value: "succeeded", label: "Paid" },
+  { value: "failed", label: "Failed" },
+  { value: "pending", label: "Waiting" }
+];
+const METHODS = [
+  { value: "", label: "Every way of paying" },
+  { value: "gateway", label: "Card or bank" },
+  { value: "wallet", label: "Wallet" },
+  { value: "manual", label: "Recorded by hand" }
+];
+const tone = (status) => status === "succeeded" ? styles.statusGood : status === "failed" ? styles.statusBad : styles.statusWait;
+function SubscriptionsView({
+  startDate,
+  endDate,
+  revenue
+}) {
+  const [search, setSearch] = useState("");
+  const [q, setQ] = useState("");
+  const [status, setStatus] = useState("");
+  const [method, setMethod] = useState("");
+  const [page, setPage] = useState(1);
+  useEffect(() => {
+    const timer = setTimeout(() => setQ(search.trim()), 300);
+    return () => clearTimeout(timer);
+  }, [search]);
+  const filters = useMemo(
+    () => ({ startDate, endDate, status, method, q, page, limit: PAGE_SIZE }),
+    [startDate, endDate, status, method, q, page]
+  );
+  const change = (set) => (value) => {
+    set(value);
+    setPage(1);
+  };
+  const { recurring } = revenue;
+  const tracked = recurring.tracked !== false;
+  const currency = recurring.currency ?? revenue.currency ?? "NGN";
+  const money = moneyIn(currency);
+  const money2 = moneyIn(currency, 2);
+  const notSet = "Not set up yet";
+  const why = "The plan payments have not been connected to this page yet.";
+  const payments = useSubscriptionPayments(filters);
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("p", { className: styles.lede, children: "This is money that merchants pay Olive for their plan. It is kept apart from the money customers pay merchants." }),
+    /* @__PURE__ */ jsxs("section", { "aria-label": "Plan income", 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 }) : notSet,
+          sub: tracked ? `${integer.format(recurring.payingMerchants ?? recurring.activeSubscriptions)} merchants paying` : why,
+          hint: "What merchants on a paid plan are expected to pay Olive every month. Merchants on a free plan, a trial or a pause are not counted. (MRR)"
+        }
+      ) }),
+      /* @__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 }) : notSet,
+          sub: tracked ? "Each month times 12" : why,
+          hint: "What plan income adds up to over a year if nothing changes: the monthly figure times 12. (ARR)"
+        }
+      ) }),
+      /* @__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 }) : notSet,
+          sub: tracked ? "Each month" : why,
+          hint: "What one paying merchant pays Olive in a month, on average. (ARPA)"
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Reveal, { index: 3, className: "adm-span-3", children: /* @__PURE__ */ jsx(
+        StatCard,
+        {
+          label: "Joined and left",
+          value: tracked ? `${integer.format(recurring.newInRange)} joined` : notSet,
+          sub: tracked ? `${integer.format(recurring.churnedInRange)} left or cancelled in this period` : why,
+          hint: "Merchants who started a plan in this period, and merchants whose plan was cancelled, ended or switched off."
+        }
+      ) })
+    ] }),
+    tracked && recurring.planBreakdown.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("h2", { className: styles.sectionTitle, children: "Who pays what" }),
+      /* @__PURE__ */ jsx("p", { className: styles.sectionNote, children: "How the monthly plan income splits across plans." }),
+      /* @__PURE__ */ jsx(PlanMixPanel, { planBreakdown: recurring.planBreakdown, money, caption: `Each month \xB7 ${currency}` })
+    ] }) : null,
+    /* @__PURE__ */ jsx("h2", { className: styles.sectionTitle, children: "Every plan payment" }),
+    payments.isError ? /* @__PURE__ */ jsx("div", { className: styles.notice, children: "Plan payments are not available on this box yet. Once the subscription module is connected, every payment will be listed here." }) : payments.isLoading || !payments.data ? /* @__PURE__ */ jsx(AdmLoading, { label: "Loading plan payments\u2026" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("div", { className: styles.toolbar, children: [
+        /* @__PURE__ */ jsxs(Filters, { label: "Filter plan payments", children: [
+          /* @__PURE__ */ jsx(
+            FilterSearch,
+            {
+              value: search,
+              onChange: change(setSearch),
+              placeholder: "Search a merchant's name or email, or a reference",
+              label: "Search plan payments"
+            }
+          ),
+          /* @__PURE__ */ jsx(FilterSelect, { value: status, onChange: change(setStatus), options: STATUSES, label: "Payment result" }),
+          /* @__PURE__ */ jsx(FilterSelect, { value: method, onChange: change(setMethod), options: METHODS, label: "Way of paying" })
+        ] }),
+        /* @__PURE__ */ jsx(
+          DownloadButton,
+          {
+            filename: downloadName("plan-payments", startDate, endDate),
+            load: () => platformAdminApi.subscriptionPaymentsCsv({ ...filters, page: void 0, limit: void 0 })
+          }
+        )
+      ] }),
+      payments.data.items.length === 0 ? /* @__PURE__ */ jsx(EmptyNote, { className: table.empty, children: "No plan payments match. Try a wider date range or clear a filter." }) : /* @__PURE__ */ jsx(
+        TableShell,
+        {
+          minWidth: 860,
+          density: "compact",
+          head: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx(Th, { children: "When" }),
+            /* @__PURE__ */ jsx(Th, { children: "Merchant" }),
+            /* @__PURE__ */ jsx(Th, { children: "Plan" }),
+            /* @__PURE__ */ jsx(Th, { children: "For" }),
+            /* @__PURE__ */ jsx(Th, { children: "How" }),
+            /* @__PURE__ */ jsx(Th, { children: "Result" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "Amount" })
+          ] }),
+          children: payments.data.items.map((row) => /* @__PURE__ */ jsx(PlanPaymentRow, { row }, row.id))
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Pagination,
+        {
+          page,
+          totalPages: Math.max(Math.ceil(payments.data.total / PAGE_SIZE), 1),
+          total: payments.data.total,
+          noun: "plan payments",
+          onPage: setPage
+        }
+      )
+    ] })
+  ] });
+}
+function PlanPaymentRow({ row }) {
+  const when = row.paidAt ?? row.createdAt;
+  return /* @__PURE__ */ jsxs(TableRow, { children: [
+    /* @__PURE__ */ jsx("td", { className: table.num, children: new Date(when).toLocaleString(void 0, { day: "numeric", month: "short", year: "numeric", hour: "2-digit", minute: "2-digit" }) }),
+    /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsxs("span", { className: styles.who, children: [
+      /* @__PURE__ */ jsx("span", { className: styles.whoName, children: row.merchantName || "Unknown merchant" }),
+      row.merchantEmail ? /* @__PURE__ */ jsx("span", { className: styles.whoSub, children: row.merchantEmail }) : null
+    ] }) }),
+    /* @__PURE__ */ jsx("td", { className: table.name, children: row.plan.charAt(0).toUpperCase() + row.plan.slice(1) }),
+    /* @__PURE__ */ jsx("td", { children: word(PURPOSE_WORDS, row.purpose) }),
+    /* @__PURE__ */ jsx("td", { children: word(SUBSCRIPTION_METHOD_WORDS, row.method) }),
+    /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsxs("span", { className: styles.who, children: [
+      /* @__PURE__ */ jsx("span", { className: `${styles.status} ${tone(row.status)}`, children: word(STATUS_WORDS, row.status) }),
+      row.status === "failed" && row.failureReason ? /* @__PURE__ */ jsx("span", { className: styles.whoSub, children: row.failureReason }) : null
+    ] }) }),
+    /* @__PURE__ */ jsx("td", { className: table.numStrong, children: minorToMoney(row.amountKobo, "NGN") })
+  ] });
+}
+export {
+  SubscriptionsView
+};
+//# sourceMappingURL=subscriptions-view.js.map

package/dist/admin/revenue/subscriptions-view.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/subscriptions-view.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useMemo, useState } from 'react';\nimport { EmptyNote, TableRow, TableShell, Th } from '@withpotter/ui-kit';\nimport {\n  platformAdminApi,\n  type PlatformRevenue,\n  type SubscriptionPaymentRow,\n} from '@withpotter/lib/admin-api';\nimport { useSubscriptionPayments } from '../hooks';\nimport { LoadFailed } from '../audit/load-failed';\nimport { CountUp, Reveal } from '../_fx';\nimport { AdmLoading, FilterSearch, FilterSelect, Filters, Pagination, StatCard, moneyIn } from '../_ui';\nimport { DownloadButton } from './download-button';\nimport {\n  PURPOSE_WORDS,\n  STATUS_WORDS,\n  SUBSCRIPTION_METHOD_WORDS,\n  downloadName,\n  minorToMoney,\n  word,\n} from './ledger-model';\nimport { PlanMixPanel } from './plan-mix-panel';\nimport styles from './ledger.module.css';\nimport table from './revenue.module.css';\n\nconst PAGE_SIZE = 25;\nconst integer = new Intl.NumberFormat('en-US');\n\nconst STATUSES = [\n  { value: '', label: 'Every result' },\n  { value: 'succeeded', label: 'Paid' },\n  { value: 'failed', label: 'Failed' },\n  { value: 'pending', label: 'Waiting' },\n];\nconst METHODS = [\n  { value: '', label: 'Every way of paying' },\n  { value: 'gateway', label: 'Card or bank' },\n  { value: 'wallet', label: 'Wallet' },\n  { value: 'manual', label: 'Recorded by hand' },\n];\n\nconst tone = (status: string) =>\n  status === 'succeeded' ? styles.statusGood : status === 'failed' ? styles.statusBad : styles.statusWait;\n\n/** What merchants pay Olive for their plan: the income figures, who pays what, and every plan payment. */\nexport function SubscriptionsView({\n  startDate,\n  endDate,\n  revenue,\n}: {\n  startDate?: string;\n  endDate?: string;\n  revenue: PlatformRevenue;\n}) {\n  const [search, setSearch] = useState('');\n  const [q, setQ] = useState('');\n  const [status, setStatus] = useState('');\n  const [method, setMethod] = useState('');\n  const [page, setPage] = useState(1);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setQ(search.trim()), 300);\n\n    return () => clearTimeout(timer);\n  }, [search]);\n\n  const filters = useMemo(\n    () => ({ startDate, endDate, status, method, q, page, limit: PAGE_SIZE }),\n    [startDate, endDate, status, method, q, page],\n  );\n  const change = <T,>(set: (v: T) => void) => (value: T) => {\n    set(value);\n    setPage(1);\n  };\n\n  const { recurring } = revenue;\n  const tracked = recurring.tracked !== false;\n  const currency = recurring.currency ?? revenue.currency ?? 'NGN';\n  const money = moneyIn(currency);\n  const money2 = moneyIn(currency, 2);\n  const notSet = 'Not set up yet';\n  const why = 'The plan payments have not been connected to this page yet.';\n  const payments = useSubscriptionPayments(filters);\n\n  return (\n    <div>\n      <p className={styles.lede}>\n        This is money that merchants pay Olive for their plan. It is kept apart from the money customers pay merchants.\n      </p>\n\n      <section aria-label=\"Plan income\" className=\"adm-grid\">\n        <Reveal index={0} className=\"adm-span-3\">\n          <StatCard\n            label=\"Plan income each month\"\n            value={tracked ? <CountUp value={recurring.mrr} format={money} /> : notSet}\n            sub={tracked ? `${integer.format(recurring.payingMerchants ?? recurring.activeSubscriptions)} merchants paying` : why}\n            hint=\"What merchants on a paid plan are expected to pay Olive every month. Merchants on a free plan, a trial or a pause are not counted. (MRR)\"\n          />\n        </Reveal>\n        <Reveal index={1} className=\"adm-span-3\">\n          <StatCard\n            label=\"Plan income over a year\"\n            value={tracked ? <CountUp value={recurring.arr} format={money} /> : notSet}\n            sub={tracked ? 'Each month times 12' : why}\n            hint=\"What plan income adds up to over a year if nothing changes: the monthly figure times 12. (ARR)\"\n          />\n        </Reveal>\n        <Reveal index={2} className=\"adm-span-3\">\n          <StatCard\n            label=\"Average per paying merchant\"\n            value={tracked ? <CountUp value={recurring.arpa} format={money2} /> : notSet}\n            sub={tracked ? 'Each month' : why}\n            hint=\"What one paying merchant pays Olive in a month, on average. (ARPA)\"\n          />\n        </Reveal>\n        <Reveal index={3} className=\"adm-span-3\">\n          <StatCard\n            label=\"Joined and left\"\n            value={tracked ? `${integer.format(recurring.newInRange)} joined` : notSet}\n            sub={tracked ? `${integer.format(recurring.churnedInRange)} left or cancelled in this period` : why}\n            hint=\"Merchants who started a plan in this period, and merchants whose plan was cancelled, ended or switched off.\"\n          />\n        </Reveal>\n      </section>\n\n      {tracked && recurring.planBreakdown.length > 0 ? (\n        <>\n          <h2 className={styles.sectionTitle}>Who pays what</h2>\n          <p className={styles.sectionNote}>How the monthly plan income splits across plans.</p>\n          <PlanMixPanel planBreakdown={recurring.planBreakdown} money={money} caption={`Each month · ${currency}`} />\n        </>\n      ) : null}\n\n      <h2 className={styles.sectionTitle}>Every plan payment</h2>\n      {payments.isError ? (\n        <div className={styles.notice}>\n          Plan payments are not available on this box yet. Once the subscription module is connected, every payment will\n          be listed here.\n        </div>\n      ) : payments.isLoading || !payments.data ? (\n        <AdmLoading label=\"Loading plan payments…\" />\n      ) : (\n        <>\n          <div className={styles.toolbar}>\n            <Filters label=\"Filter plan payments\">\n              <FilterSearch\n                value={search}\n                onChange={change(setSearch)}\n                placeholder=\"Search a merchant's name or email, or a reference\"\n                label=\"Search plan payments\"\n              />\n              <FilterSelect value={status} onChange={change(setStatus)} options={STATUSES} label=\"Payment result\" />\n              <FilterSelect value={method} onChange={change(setMethod)} options={METHODS} label=\"Way of paying\" />\n            </Filters>\n            <DownloadButton\n              filename={downloadName('plan-payments', startDate, endDate)}\n              load={() => platformAdminApi.subscriptionPaymentsCsv({ ...filters, page: undefined, limit: undefined })}\n            />\n          </div>\n\n          {payments.data.items.length === 0 ? (\n            <EmptyNote className={table.empty}>No plan payments match. Try a wider date range or clear a filter.</EmptyNote>\n          ) : (\n            <TableShell\n              minWidth={860}\n              density=\"compact\"\n              head={\n                <tr>\n                  <Th>When</Th>\n                  <Th>Merchant</Th>\n                  <Th>Plan</Th>\n                  <Th>For</Th>\n                  <Th>How</Th>\n                  <Th>Result</Th>\n                  <Th align=\"right\">Amount</Th>\n                </tr>\n              }\n            >\n              {payments.data.items.map((row) => (\n                <PlanPaymentRow key={row.id} row={row} />\n              ))}\n            </TableShell>\n          )}\n          <Pagination\n            page={page}\n            totalPages={Math.max(Math.ceil(payments.data.total / PAGE_SIZE), 1)}\n            total={payments.data.total}\n            noun=\"plan payments\"\n            onPage={setPage}\n          />\n        </>\n      )}\n    </div>\n  );\n}\n\nfunction PlanPaymentRow({ row }: { row: SubscriptionPaymentRow }) {\n  const when = row.paidAt ?? row.createdAt;\n\n  return (\n    <TableRow>\n      <td className={table.num}>\n        {new Date(when).toLocaleString(undefined, { day: 'numeric', month: 'short', year: 'numeric', hour: '2-digit', minute: '2-digit' })}\n      </td>\n      <td>\n        <span className={styles.who}>\n          <span className={styles.whoName}>{row.merchantName || 'Unknown merchant'}</span>\n          {row.merchantEmail ? <span className={styles.whoSub}>{row.merchantEmail}</span> : null}\n        </span>\n      </td>\n      <td className={table.name}>{row.plan.charAt(0).toUpperCase() + row.plan.slice(1)}</td>\n      <td>{word(PURPOSE_WORDS, row.purpose)}</td>\n      <td>{word(SUBSCRIPTION_METHOD_WORDS, row.method)}</td>\n      <td>\n        <span className={styles.who}>\n          <span className={`${styles.status} ${tone(row.status)}`}>{word(STATUS_WORDS, row.status)}</span>\n          {row.status === 'failed' && row.failureReason ? <span className={styles.whoSub}>{row.failureReason}</span> : null}\n        </span>\n      </td>\n      <td className={table.numStrong}>{minorToMoney(row.amountKobo, 'NGN')}</td>\n    </TableRow>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/revenue/top-tenants-panel.js

@@ -0,0 +1,96 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import { useRouter } from "next/navigation";
+import { EmptyNote, TableRow, TableShell, Th } from "@withpotter/ui-kit";
+import { EntityAvatar } from "../_fx";
+import { PICK_CURRENCY, Panel, moneyIn } from "../_ui";
+import { logoOf } from "../tenants/tenants-logo";
+import styles from "./revenue.module.css";
+const integer = new Intl.NumberFormat("en-US");
+function TopTenantsPanel({
+  tenants,
+  lifetime,
+  focus
+}) {
+  const router = useRouter();
+  const money = moneyIn(focus ?? "");
+  return /* @__PURE__ */ jsx(
+    Panel,
+    {
+      title: "Top merchants by GMV",
+      count: tenants.length || void 0,
+      caption: focus ?? void 0,
+      action: /* @__PURE__ */ jsx(Link, { href: "/admin/tenants", children: "View all" }),
+      flush: true,
+      children: tenants.length === 0 ? /* @__PURE__ */ jsx(EmptyNote, { className: styles.empty, children: focus ? `No ${focus} merchant revenue recorded yet.` : PICK_CURRENCY }) : /* @__PURE__ */ jsx(
+        TableShell,
+        {
+          bare: true,
+          minWidth: 520,
+          density: "compact",
+          head: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx(Th, { children: "Merchant" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "Orders" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "AOV" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "GMV" }),
+            /* @__PURE__ */ jsx(Th, { align: "right", children: "% of GMV" })
+          ] }),
+          children: tenants.map((t) => {
+            const aov = t.orders > 0 ? t.gmv / t.orders : 0;
+            const share = lifetime > 0 ? t.gmv / lifetime * 100 : 0;
+            const logo = logoOf(t);
+            return /* @__PURE__ */ jsxs(
+              TableRow,
+              {
+                onClick: () => router.push(`/admin/tenants/${t.id}`),
+                children: [
+                  /* @__PURE__ */ jsx("td", { className: styles.name, children: /* @__PURE__ */ jsxs("span", { className: styles.tenant, children: [
+                    logo && /* @__PURE__ */ jsx(
+                      EntityAvatar,
+                      {
+                        name: t.businessName,
+                        src: logo,
+                        size: 28
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs("span", { className: styles.tenantText, children: [
+                      /* @__PURE__ */ jsx(
+                        Link,
+                        {
+                          href: `/admin/tenants/${t.id}`,
+                          title: t.businessName,
+                          onClick: (e) => e.stopPropagation(),
+                          children: t.businessName
+                        }
+                      ),
+                      t.slug && /* @__PURE__ */ jsx("span", { className: styles.slug, title: t.slug, children: t.slug })
+                    ] })
+                  ] }) }),
+                  /* @__PURE__ */ jsx("td", { className: styles.num, children: integer.format(t.orders) }),
+                  /* @__PURE__ */ jsx("td", { className: styles.num, children: money(aov) }),
+                  /* @__PURE__ */ jsx("td", { className: styles.numStrong, children: money(t.gmv) }),
+                  /* @__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),
+                    "%"
+                  ] }) })
+                ]
+              },
+              t.id
+            );
+          })
+        }
+      )
+    }
+  );
+}
+export {
+  TopTenantsPanel
+};
+//# sourceMappingURL=top-tenants-panel.js.map

package/dist/admin/revenue/top-tenants-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/revenue/top-tenants-panel.tsx"],"sourcesContent":["import Link from 'next/link';\nimport { useRouter } from 'next/navigation';\nimport { EmptyNote, TableRow, TableShell, Th } from '@withpotter/ui-kit';\nimport type { PlatformRevenue } from '@withpotter/lib/admin-api';\nimport { EntityAvatar } from '../_fx';\nimport { PICK_CURRENCY, Panel, moneyIn } from '../_ui';\nimport { logoOf } from '../tenants/tenants-logo';\nimport styles from './revenue.module.css';\n\nconst integer = new Intl.NumberFormat('en-US');\n\n/**\n * Merchants ranked by GMV within one currency, with order count, AOV and\n * share of that currency's lifetime GMV.\n */\nexport function TopTenantsPanel({\n  tenants,\n  lifetime,\n  focus,\n}: {\n  tenants: PlatformRevenue['gmv']['topTenants'];\n  /** Lifetime GMV in `focus`, the base for each share. */\n  lifetime: number;\n  /** The one currency ranked, or null when there are several and none is chosen. */\n  focus: string | null;\n}) {\n  const router = useRouter();\n  const money = moneyIn(focus ?? '');\n\n  return (\n    <Panel\n      title=\"Top merchants by GMV\"\n      count={tenants.length || undefined}\n      caption={focus ?? undefined}\n      action={<Link href=\"/admin/tenants\">View all</Link>}\n      flush\n    >\n      {tenants.length === 0 ? (\n        <EmptyNote className={styles.empty}>\n          {focus ? `No ${focus} merchant revenue recorded yet.` : PICK_CURRENCY}\n        </EmptyNote>\n      ) : (\n        <TableShell\n          bare\n          minWidth={520}\n          density=\"compact\"\n          head={\n            <tr>\n              <Th>Merchant</Th>\n              <Th align=\"right\">Orders</Th>\n              <Th align=\"right\">AOV</Th>\n              <Th align=\"right\">GMV</Th>\n              <Th align=\"right\">% of GMV</Th>\n            </tr>\n          }\n        >\n          {tenants.map((t) => {\n            const aov = t.orders > 0 ? t.gmv / t.orders : 0;\n            const share = lifetime > 0 ? (t.gmv / lifetime) * 100 : 0;\n            const logo = logoOf(t);\n            return (\n              <TableRow\n                key={t.id}\n                onClick={() => router.push(`/admin/tenants/${t.id}`)}\n              >\n                <td className={styles.name}>\n                  <span className={styles.tenant}>\n                    {logo && (\n                      <EntityAvatar\n                        name={t.businessName}\n                        src={logo}\n                        size={28}\n                      />\n                    )}\n                    <span className={styles.tenantText}>\n                      <Link\n                        href={`/admin/tenants/${t.id}`}\n                        title={t.businessName}\n                        onClick={(e) => e.stopPropagation()}\n                      >\n                        {t.businessName}\n                      </Link>\n                      {t.slug && (\n                        <span className={styles.slug} title={t.slug}>\n                          {t.slug}\n                        </span>\n                      )}\n                    </span>\n                  </span>\n                </td>\n                <td className={styles.num}>{integer.format(t.orders)}</td>\n                <td className={styles.num}>{money(aov)}</td>\n                <td className={styles.numStrong}>{money(t.gmv)}</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":"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","names":[]}