@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/payout-providers/sections.module.css

@@ -0,0 +1,151 @@
+/* Payout providers: the numbered steps, the template picker and the payouts
+   needing attention. */
+
+/* ---- Numbered steps ---- */
+.step {
+  display: grid;
+  grid-template-columns: 24px minmax(0, 1fr);
+  gap: 12px;
+  padding: 16px 0;
+  border-bottom: 1px solid var(--border-subtle);
+}
+
+.marker {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  border: 1px solid var(--border-default);
+  border-radius: 999px;
+  background: var(--bg-base);
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--text-secondary);
+}
+
+.step[data-state='active'] .marker {
+  border-color: var(--text-primary);
+  color: var(--text-primary);
+}
+
+.step[data-state='done'] .marker {
+  background: var(--adm-hover);
+  color: var(--text-primary);
+}
+
+.step[data-state='locked'] .stepTitle,
+.step[data-state='locked'] .marker {
+  color: var(--text-tertiary);
+}
+
+.stepHead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  min-height: 24px;
+}
+
+.stepTitle {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--text-primary);
+}
+
+.stepOptional {
+  font-size: 12px;
+  font-weight: 400;
+  color: var(--text-tertiary);
+}
+
+.stepSummary {
+  margin: 4px 0 0;
+  font-size: 13px;
+  line-height: 1.5;
+  color: var(--text-secondary);
+}
+
+.stepBody {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-top: 12px;
+}
+
+/* ---- Template picker ---- */
+.templateGrid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+  gap: 8px;
+}
+
+.template {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 12px;
+  border: 1px solid var(--border-default);
+  border-radius: 8px;
+  background: var(--bg-base);
+  text-align: left;
+  color: var(--text-primary);
+  cursor: pointer;
+}
+
+.template:hover {
+  background: var(--adm-hover);
+}
+
+.template[data-selected='true'] {
+  border-color: var(--text-primary);
+  background: var(--adm-hover);
+}
+
+.template strong {
+  font-size: 13px;
+  font-weight: 600;
+}
+
+.template span {
+  font-size: 12px;
+  line-height: 1.4;
+  color: var(--text-secondary);
+}
+
+/* ---- Payouts needing attention ---- */
+.attnRow {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  padding: 12px 0;
+  border-bottom: 1px solid var(--border-subtle);
+  font-size: 13px;
+  color: var(--text-primary);
+}
+
+.attnRow:last-of-type {
+  border-bottom: 0;
+}
+
+.attnForm {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: min(100%, 320px);
+}
+
+.amount {
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+}
+
+@media (max-width: 719px) {
+  .attnRow {
+    flex-direction: column;
+  }
+}

package/dist/admin/payout-providers/shared.js

@@ -0,0 +1,34 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { Badge } from "@withpotter/ui-kit";
+const errorText = (error) => error instanceof Error ? error.message : "Something went wrong. Please try again.";
+function nairaToMinor(value) {
+  const match = /^(\d{1,9})(?:\.(\d{1,2}))?$/.exec(value.replace(/[,\s]/g, ""));
+  if (!match) return null;
+  const minor = `${match[1]}${(match[2] ?? "").padEnd(2, "0")}`.replace(
+    /^0+(?=\d)/,
+    ""
+  );
+  return minor === "0" ? null : minor;
+}
+const when = (iso) => iso ? new Date(iso).toLocaleString() : "never";
+const BADGE = {
+  neutral: "secondary",
+  success: "success",
+  warning: "warning",
+  error: "error",
+  info: "info"
+};
+function ToneBadge({
+  tone,
+  children
+}) {
+  return /* @__PURE__ */ jsx(Badge, { variant: BADGE[tone], children });
+}
+export {
+  ToneBadge,
+  errorText,
+  nairaToMinor,
+  when
+};
+//# sourceMappingURL=shared.js.map

package/dist/admin/payout-providers/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/shared.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport { Badge, type BadgeProps } from '@withpotter/ui-kit';\n\nexport const errorText = (error: unknown): string =>\n  error instanceof Error\n    ? error.message\n    : 'Something went wrong. Please try again.';\n\n/** Naira text (\"1,250.50\") to minor units as a string, or null when it is not a valid amount. No floating point. */\nexport function nairaToMinor(value: string): string | null {\n  const match = /^(\\d{1,9})(?:\\.(\\d{1,2}))?$/.exec(value.replace(/[,\\s]/g, ''));\n  if (!match) return null;\n  const minor = `${match[1]}${(match[2] ?? '').padEnd(2, '0')}`.replace(\n    /^0+(?=\\d)/,\n    '',\n  );\n  return minor === '0' ? null : minor;\n}\n\nexport const when = (iso: string | null): string =>\n  iso ? new Date(iso).toLocaleString() : 'never';\n\nexport type Tone = 'neutral' | 'success' | 'warning' | 'error' | 'info';\n\nconst BADGE: Record<Tone, NonNullable<BadgeProps['variant']>> = {\n  neutral: 'secondary',\n  success: 'success',\n  warning: 'warning',\n  error: 'error',\n  info: 'info',\n};\n\n/** A provider status as a ui-kit Badge. */\nexport function ToneBadge({\n  tone,\n  children,\n}: {\n  tone: Tone;\n  children: ReactNode;\n}) {\n  return <Badge variant={BADGE[tone]}>{children}</Badge>;\n}\n"],"mappings":";AA0CS;AAvCT,SAAS,aAA8B;AAEhC,MAAM,YAAY,CAAC,UACxB,iBAAiB,QACb,MAAM,UACN;AAGC,SAAS,aAAa,OAA8B;AACzD,QAAM,QAAQ,8BAA8B,KAAK,MAAM,QAAQ,UAAU,EAAE,CAAC;AAC5E,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,IAAI,MAAM,CAAC,KAAK,IAAI,OAAO,GAAG,GAAG,CAAC,GAAG;AAAA,IAC5D;AAAA,IACA;AAAA,EACF;AACA,SAAO,UAAU,MAAM,OAAO;AAChC;AAEO,MAAM,OAAO,CAAC,QACnB,MAAM,IAAI,KAAK,GAAG,EAAE,eAAe,IAAI;AAIzC,MAAM,QAA0D;AAAA,EAC9D,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AAAA,EACP,MAAM;AACR;AAGO,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AACF,GAGG;AACD,SAAO,oBAAC,SAAM,SAAS,MAAM,IAAI,GAAI,UAAS;AAChD;","names":[]}

package/dist/admin/payout-providers/status.js

@@ -0,0 +1,17 @@
+const isReady = (p) => p.signedIn && !p.needsSignIn && p.lastTestStatus === "ok" && (!p.steps.includes("pin") || p.pinConfigured);
+function statusOf(p) {
+  if (p.active && isReady(p)) return { tone: "success", label: "Active", detail: "Payouts are sent through this provider" };
+  if (p.active) return { tone: "error", label: "Active, needs attention", detail: "Payouts are paused until this is fixed" };
+  if (p.signedIn && (p.needsSignIn || p.lastTestStatus === "needs-sign-in")) {
+    return { tone: "warning", label: "Needs sign-in", detail: "Sign in again to keep it working" };
+  }
+  if (p.lastTestStatus === "failed") return { tone: "warning", label: "Check failed", detail: "The last connection check failed" };
+  if (isReady(p)) return { tone: "info", label: "Ready", detail: "Checked and ready to be made active" };
+  if (p.signedIn) return { tone: "neutral", label: "Not verified", detail: "Run the connection check" };
+  return { tone: "neutral", label: "Not connected", detail: "Connect an account to use it" };
+}
+export {
+  isReady,
+  statusOf
+};
+//# sourceMappingURL=status.js.map

package/dist/admin/payout-providers/status.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/status.ts"],"sourcesContent":["import type { PayoutIntegration } from '@withpotter/platform-admin';\nimport type { Tone } from './shared';\n\nexport type ProviderStatus = { tone: Tone; label: string; detail: string };\n\n/** Connected and checked successfully. */\nexport const isReady = (p: PayoutIntegration): boolean =>\n  p.signedIn && !p.needsSignIn && p.lastTestStatus === 'ok' && (!p.steps.includes('pin') || p.pinConfigured);\n\n/** One plain-language status per provider, used in the list and the header. */\nexport function statusOf(p: PayoutIntegration): ProviderStatus {\n  if (p.active && isReady(p)) return { tone: 'success', label: 'Active', detail: 'Payouts are sent through this provider' };\n  if (p.active) return { tone: 'error', label: 'Active, needs attention', detail: 'Payouts are paused until this is fixed' };\n  if (p.signedIn && (p.needsSignIn || p.lastTestStatus === 'needs-sign-in')) {\n    return { tone: 'warning', label: 'Needs sign-in', detail: 'Sign in again to keep it working' };\n  }\n  if (p.lastTestStatus === 'failed') return { tone: 'warning', label: 'Check failed', detail: 'The last connection check failed' };\n  if (isReady(p)) return { tone: 'info', label: 'Ready', detail: 'Checked and ready to be made active' };\n  if (p.signedIn) return { tone: 'neutral', label: 'Not verified', detail: 'Run the connection check' };\n  return { tone: 'neutral', label: 'Not connected', detail: 'Connect an account to use it' };\n}\n"],"mappings":"AAMO,MAAM,UAAU,CAAC,MACtB,EAAE,YAAY,CAAC,EAAE,eAAe,EAAE,mBAAmB,SAAS,CAAC,EAAE,MAAM,SAAS,KAAK,KAAK,EAAE;AAGvF,SAAS,SAAS,GAAsC;AAC7D,MAAI,EAAE,UAAU,QAAQ,CAAC,EAAG,QAAO,EAAE,MAAM,WAAW,OAAO,UAAU,QAAQ,yCAAyC;AACxH,MAAI,EAAE,OAAQ,QAAO,EAAE,MAAM,SAAS,OAAO,2BAA2B,QAAQ,yCAAyC;AACzH,MAAI,EAAE,aAAa,EAAE,eAAe,EAAE,mBAAmB,kBAAkB;AACzE,WAAO,EAAE,MAAM,WAAW,OAAO,iBAAiB,QAAQ,mCAAmC;AAAA,EAC/F;AACA,MAAI,EAAE,mBAAmB,SAAU,QAAO,EAAE,MAAM,WAAW,OAAO,gBAAgB,QAAQ,mCAAmC;AAC/H,MAAI,QAAQ,CAAC,EAAG,QAAO,EAAE,MAAM,QAAQ,OAAO,SAAS,QAAQ,sCAAsC;AACrG,MAAI,EAAE,SAAU,QAAO,EAAE,MAAM,WAAW,OAAO,gBAAgB,QAAQ,2BAA2B;AACpG,SAAO,EAAE,MAAM,WAAW,OAAO,iBAAiB,QAAQ,+BAA+B;AAC3F;","names":[]}

package/dist/admin/payout-providers/step.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import sec from "./sections.module.css";
+function Step({
+  number,
+  title,
+  state,
+  summary,
+  optional,
+  action,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("section", { className: sec.step, "data-state": state, "aria-label": title, children: [
+    /* @__PURE__ */ jsx("span", { className: sec.marker, "aria-hidden": "true", children: state === "done" ? "\u2713" : number }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsxs("div", { className: sec.stepHead, children: [
+        /* @__PURE__ */ jsxs("span", { className: sec.stepTitle, children: [
+          title,
+          optional && /* @__PURE__ */ jsx("span", { className: sec.stepOptional, children: "Recommended" })
+        ] }),
+        action
+      ] }),
+      summary && /* @__PURE__ */ jsx("p", { className: sec.stepSummary, children: summary }),
+      children && /* @__PURE__ */ jsx("div", { className: sec.stepBody, children })
+    ] })
+  ] });
+}
+export {
+  Step
+};
+//# sourceMappingURL=step.js.map

package/dist/admin/payout-providers/step.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/step.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport sec from './sections.module.css';\n\nexport type StepState = 'done' | 'active' | 'ready' | 'locked';\n\n/** One numbered step. A finished step shows its summary and an action to change it; the active step shows its form. */\nexport function Step({\n  number,\n  title,\n  state,\n  summary,\n  optional,\n  action,\n  children,\n}: {\n  number: number;\n  title: string;\n  state: StepState;\n  summary?: ReactNode;\n  optional?: boolean;\n  /** Shown on the right of the heading, e.g. an Edit link. */\n  action?: ReactNode;\n  /** The form. Only rendered when the step is open. */\n  children?: ReactNode;\n}) {\n  return (\n    <section className={sec.step} data-state={state} aria-label={title}>\n      <span className={sec.marker} aria-hidden=\"true\">\n        {state === 'done' ? '✓' : number}\n      </span>\n      <div>\n        <div className={sec.stepHead}>\n          <span className={sec.stepTitle}>\n            {title}\n            {optional && <span className={sec.stepOptional}>Recommended</span>}\n          </span>\n          {action}\n        </div>\n        {summary && <p className={sec.stepSummary}>{summary}</p>}\n        {children && <div className={sec.stepBody}>{children}</div>}\n      </div>\n    </section>\n  );\n}\n"],"mappings":";AA6BM,cAKI,YALJ;AA1BN,OAAO,SAAS;AAKT,SAAS,KAAK;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAUG;AACD,SACE,qBAAC,aAAQ,WAAW,IAAI,MAAM,cAAY,OAAO,cAAY,OAC3D;AAAA,wBAAC,UAAK,WAAW,IAAI,QAAQ,eAAY,QACtC,oBAAU,SAAS,WAAM,QAC5B;AAAA,IACA,qBAAC,SACC;AAAA,2BAAC,SAAI,WAAW,IAAI,UAClB;AAAA,6BAAC,UAAK,WAAW,IAAI,WAClB;AAAA;AAAA,UACA,YAAY,oBAAC,UAAK,WAAW,IAAI,cAAc,yBAAW;AAAA,WAC7D;AAAA,QACC;AAAA,SACH;AAAA,MACC,WAAW,oBAAC,OAAE,WAAW,IAAI,aAAc,mBAAQ;AAAA,MACnD,YAAY,oBAAC,SAAI,WAAW,IAAI,UAAW,UAAS;AAAA,OACvD;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/payout-providers/test-transfer.js

@@ -0,0 +1,161 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { Banner, Button, Input, Select, useConfirm } from "@withpotter/ui-kit";
+import {
+  platformAdminApi
+} from "@withpotter/platform-admin";
+import { errorText, nairaToMinor } from "./shared";
+import { Step } from "./step";
+import styles from "./payout-providers.module.css";
+function TestTransfer({
+  integration,
+  number,
+  unlocked
+}) {
+  const { key } = integration;
+  const confirm = useConfirm();
+  const [bankCode, setBankCode] = useState("");
+  const [accountNumber, setAccountNumber] = useState("");
+  const [amount, setAmount] = useState("100");
+  const [accountName, setAccountName] = useState(null);
+  const banks = useQuery({
+    queryKey: ["platform-admin", "payout-banks", key],
+    queryFn: () => platformAdminApi.payoutIntegrationBanks(key),
+    enabled: unlocked,
+    staleTime: 10 * 6e4,
+    retry: false
+  });
+  const lookup = useMutation({
+    mutationFn: () => platformAdminApi.payoutIntegrationNameEnquiry(
+      key,
+      bankCode,
+      accountNumber
+    ),
+    onSuccess: (result) => setAccountName(result.accountName)
+  });
+  const send = useMutation({
+    mutationFn: () => platformAdminApi.testPayoutIntegrationTransfer(key, {
+      bankCode,
+      accountNumber,
+      accountName: accountName ?? "",
+      amountMinor: nairaToMinor(amount) ?? ""
+    })
+  });
+  const minor = nairaToMinor(amount);
+  const edit = (apply) => {
+    apply();
+    setAccountName(null);
+    send.reset();
+  };
+  const confirmSend = async () => {
+    if (!accountName || !minor) return;
+    const ok = await confirm({
+      title: `Send \u20A6${amount} to ${accountName} (${accountNumber})?`,
+      description: "This moves real money from the connected account.",
+      confirmLabel: `Send \u20A6${amount}`,
+      tone: "warning"
+    });
+    if (ok) send.mutate();
+  };
+  const outcome = send.data?.outcome;
+  return /* @__PURE__ */ jsx(
+    Step,
+    {
+      number,
+      title: "Send a test transfer",
+      optional: true,
+      state: unlocked ? "ready" : "locked",
+      summary: unlocked ? "Sends a small real transfer to an account you control, to prove payouts work end to end." : "Available once the connection check passes.",
+      children: unlocked && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs("div", { className: styles.fields, children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("span", { className: styles.label, children: "Bank" }),
+            /* @__PURE__ */ jsx(
+              Select,
+              {
+                ariaLabel: "Bank",
+                value: bankCode,
+                onChange: (value) => edit(() => setBankCode(value)),
+                placeholder: banks.isLoading ? "Loading banks\u2026" : "Choose a bank",
+                options: (banks.data ?? []).map((bank) => ({
+                  value: bank.code,
+                  label: bank.name
+                }))
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Account number",
+              inputMode: "numeric",
+              maxLength: 10,
+              value: accountNumber,
+              onChange: (e) => edit(() => setAccountNumber(e.target.value.replace(/\D/g, "")))
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Amount (\u20A6)",
+              inputMode: "decimal",
+              value: amount,
+              error: !minor && amount ? "Enter an amount like 100 or 250.50" : void 0,
+              onChange: (e) => edit(() => setAmount(e.target.value))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: styles.actions, children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              loading: lookup.isPending,
+              disabled: !bankCode || accountNumber.length !== 10,
+              onClick: () => lookup.mutate(),
+              children: "Look up account"
+            }
+          ),
+          accountName && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("strong", { children: accountName }),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                loading: send.isPending,
+                disabled: !minor,
+                onClick: () => void confirmSend(),
+                children: [
+                  "Send \u20A6",
+                  amount
+                ]
+              }
+            )
+          ] })
+        ] }),
+        (lookup.error || send.error || banks.error) && /* @__PURE__ */ jsx(Banner, { tone: "error", children: errorText(lookup.error ?? send.error ?? banks.error) }),
+        send.data && /* @__PURE__ */ jsxs(
+          Banner,
+          {
+            tone: outcome === "SUCCESS" ? "success" : outcome === "FAILED" ? "error" : "warning",
+            children: [
+              outcome === "SUCCESS" && "Sent. ",
+              outcome === "PENDING" && "Accepted, not final yet. Check the provider account. ",
+              outcome === "FAILED" && "Refused, nothing was sent. ",
+              outcome === "UNKNOWN" && "Not confirmed. ",
+              send.data.message,
+              " Reference ",
+              send.data.reference,
+              "."
+            ]
+          }
+        )
+      ] })
+    }
+  );
+}
+export {
+  TestTransfer
+};
+//# sourceMappingURL=test-transfer.js.map

package/dist/admin/payout-providers/test-transfer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/test-transfer.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { useMutation, useQuery } from '@tanstack/react-query';\nimport { Banner, Button, Input, Select, useConfirm } from '@withpotter/ui-kit';\nimport {\n  platformAdminApi,\n  type PayoutIntegration,\n} from '@withpotter/platform-admin';\nimport { errorText, nairaToMinor } from './shared';\nimport { Step } from './step';\nimport styles from './payout-providers.module.css';\n\n/**\n * Sends a small real transfer to prove the provider end to end. The account\n * name is looked up and must be confirmed first. Not tied to any wallet; the\n * server caps the amount.\n */\nexport function TestTransfer({\n  integration,\n  number,\n  unlocked,\n}: {\n  integration: PayoutIntegration;\n  number: number;\n  unlocked: boolean;\n}) {\n  const { key } = integration;\n  const confirm = useConfirm();\n  const [bankCode, setBankCode] = useState('');\n  const [accountNumber, setAccountNumber] = useState('');\n  const [amount, setAmount] = useState('100');\n  const [accountName, setAccountName] = useState<string | null>(null);\n\n  const banks = useQuery({\n    queryKey: ['platform-admin', 'payout-banks', key],\n    queryFn: () => platformAdminApi.payoutIntegrationBanks(key),\n    enabled: unlocked,\n    staleTime: 10 * 60_000,\n    retry: false,\n  });\n  const lookup = useMutation({\n    mutationFn: () =>\n      platformAdminApi.payoutIntegrationNameEnquiry(\n        key,\n        bankCode,\n        accountNumber,\n      ),\n    onSuccess: (result) => setAccountName(result.accountName),\n  });\n  const send = useMutation({\n    mutationFn: () =>\n      platformAdminApi.testPayoutIntegrationTransfer(key, {\n        bankCode,\n        accountNumber,\n        accountName: accountName ?? '',\n        amountMinor: nairaToMinor(amount) ?? '',\n      }),\n  });\n\n  const minor = nairaToMinor(amount);\n  const edit = (apply: () => void) => {\n    apply();\n    setAccountName(null);\n    send.reset();\n  };\n  const confirmSend = async () => {\n    if (!accountName || !minor) return;\n    const ok = await confirm({\n      title: `Send ₦${amount} to ${accountName} (${accountNumber})?`,\n      description: 'This moves real money from the connected account.',\n      confirmLabel: `Send ₦${amount}`,\n      tone: 'warning',\n    });\n    if (ok) send.mutate();\n  };\n  const outcome = send.data?.outcome;\n\n  return (\n    <Step\n      number={number}\n      title=\"Send a test transfer\"\n      optional\n      state={unlocked ? 'ready' : 'locked'}\n      summary={\n        unlocked\n          ? 'Sends a small real transfer to an account you control, to prove payouts work end to end.'\n          : 'Available once the connection check passes.'\n      }\n    >\n      {unlocked && (\n        <>\n          <div className={styles.fields}>\n            <div>\n              <span className={styles.label}>Bank</span>\n              <Select\n                ariaLabel=\"Bank\"\n                value={bankCode}\n                onChange={(value) => edit(() => setBankCode(value))}\n                placeholder={\n                  banks.isLoading ? 'Loading banks…' : 'Choose a bank'\n                }\n                options={(banks.data ?? []).map((bank) => ({\n                  value: bank.code,\n                  label: bank.name,\n                }))}\n              />\n            </div>\n            <Input\n              label=\"Account number\"\n              inputMode=\"numeric\"\n              maxLength={10}\n              value={accountNumber}\n              onChange={(e) =>\n                edit(() => setAccountNumber(e.target.value.replace(/\\D/g, '')))\n              }\n            />\n            <Input\n              label=\"Amount (₦)\"\n              inputMode=\"decimal\"\n              value={amount}\n              error={\n                !minor && amount\n                  ? 'Enter an amount like 100 or 250.50'\n                  : undefined\n              }\n              onChange={(e) => edit(() => setAmount(e.target.value))}\n            />\n          </div>\n          <div className={styles.actions}>\n            <Button\n              variant=\"secondary\"\n              loading={lookup.isPending}\n              disabled={!bankCode || accountNumber.length !== 10}\n              onClick={() => lookup.mutate()}\n            >\n              Look up account\n            </Button>\n            {accountName && (\n              <>\n                <strong>{accountName}</strong>\n                <Button\n                  loading={send.isPending}\n                  disabled={!minor}\n                  onClick={() => void confirmSend()}\n                >\n                  Send ₦{amount}\n                </Button>\n              </>\n            )}\n          </div>\n          {(lookup.error || send.error || banks.error) && (\n            <Banner tone=\"error\">\n              {errorText(lookup.error ?? send.error ?? banks.error)}\n            </Banner>\n          )}\n          {send.data && (\n            <Banner\n              tone={\n                outcome === 'SUCCESS'\n                  ? 'success'\n                  : outcome === 'FAILED'\n                  ? 'error'\n                  : 'warning'\n              }\n            >\n              {outcome === 'SUCCESS' && 'Sent. '}\n              {outcome === 'PENDING' &&\n                'Accepted, not final yet. Check the provider account. '}\n              {outcome === 'FAILED' && 'Refused, nothing was sent. '}\n              {outcome === 'UNKNOWN' && 'Not confirmed. '}\n              {send.data.message} Reference {send.data.reference}.\n            </Banner>\n          )}\n        </>\n      )}\n    </Step>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/payout-providers/use-connect.js

@@ -0,0 +1,108 @@
+import { useState } from "react";
+import { useMutation } from "@tanstack/react-query";
+import {
+  platformAdminApi
+} from "@withpotter/platform-admin";
+function useConnect(integration, onChange, onRefresh) {
+  const { key } = integration;
+  const keyOnly = integration.auth === "apiKey";
+  const keyPair = integration.auth === "signed";
+  const login = !keyOnly && !keyPair;
+  const connected = integration.signedIn && !integration.needsSignIn;
+  const [editing, setEditing] = useState(false);
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [transactionId, setTransactionId] = useState(null);
+  const [otp, setOtp] = useState("");
+  const [apiKey, setApiKey] = useState("");
+  const [publicKey, setPublicKey] = useState("");
+  const [secretKey, setSecretKey] = useState("");
+  const [notice, setNotice] = useState(null);
+  const finish = (next, message) => {
+    setEditing(false);
+    setNotice(message);
+    onChange(next);
+    onRefresh();
+  };
+  const signIn = useMutation({
+    mutationFn: () => platformAdminApi.signInPayoutIntegration(key, email, password),
+    onSuccess: (result) => {
+      setPassword("");
+      if (result.otpRequired) {
+        setTransactionId(result.transactionId);
+        setNotice(null);
+      } else {
+        finish(result.integration, "Signed in.");
+      }
+    }
+  });
+  const verify = useMutation({
+    mutationFn: () => platformAdminApi.verifyPayoutIntegration(key, transactionId ?? "", otp),
+    onSuccess: (next) => {
+      setTransactionId(null);
+      setOtp("");
+      finish(next, "Signed in. The session renews on its own.");
+    }
+  });
+  const saveKey = useMutation({
+    mutationFn: () => platformAdminApi.savePayoutIntegrationApiKey(key, apiKey),
+    onSuccess: (next) => {
+      setApiKey("");
+      finish(next, "API key saved.");
+    }
+  });
+  const saveKeys = useMutation({
+    mutationFn: () => platformAdminApi.savePayoutIntegrationCredentials(
+      key,
+      publicKey,
+      secretKey
+    ),
+    onSuccess: (next) => {
+      setPublicKey("");
+      setSecretKey("");
+      finish(next, "Keys saved.");
+    }
+  });
+  const error = signIn.error ?? verify.error ?? saveKey.error ?? saveKeys.error;
+  const busy = signIn.isPending || verify.isPending || saveKey.isPending || saveKeys.isPending;
+  return {
+    keyOnly,
+    keyPair,
+    login,
+    connected,
+    editing,
+    setEditing,
+    email,
+    setEmail,
+    password,
+    setPassword,
+    transactionId,
+    setTransactionId,
+    otp,
+    setOtp,
+    apiKey,
+    setApiKey,
+    publicKey,
+    setPublicKey,
+    secretKey,
+    setSecretKey,
+    notice,
+    signIn,
+    verify,
+    saveKey,
+    saveKeys,
+    error,
+    busy
+  };
+}
+function connectSummary(integration, editing) {
+  const keyOnly = integration.auth === "apiKey";
+  const keyPair = integration.auth === "signed";
+  const connected = integration.signedIn && !integration.needsSignIn;
+  return connected && !editing ? keyOnly || keyPair ? `Key ending ${integration.account?.replace(/^•+/, "") ?? ""} is saved and sealed.` : `Signed in as ${integration.account}. The session renews automatically.` : keyOnly ? "Paste the secret key from the provider dashboard. It is stored sealed and only its last four characters are ever shown." : keyPair ? "Paste the public and the secret key from the provider dashboard. They are stored sealed and only the last four characters are ever shown. Nothing expires, so there is no sign-in to repeat." : "Sign in with the provider account that holds the money. The password and code are used once and never stored.";
+}
+export {
+  connectSummary,
+  useConnect
+};
+//# sourceMappingURL=use-connect.js.map

package/dist/admin/payout-providers/use-connect.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/use-connect.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useMutation } from '@tanstack/react-query';\nimport {\n  platformAdminApi,\n  type PayoutIntegration,\n} from '@withpotter/platform-admin';\n\n/** The connect step's fields and the four calls that connect an account. */\nexport function useConnect(\n  integration: PayoutIntegration,\n  onChange: (next: PayoutIntegration) => void,\n  onRefresh: () => void,\n) {\n  const { key } = integration;\n  const keyOnly = integration.auth === 'apiKey';\n  const keyPair = integration.auth === 'signed';\n  const login = !keyOnly && !keyPair;\n  const connected = integration.signedIn && !integration.needsSignIn;\n  const [editing, setEditing] = useState(false);\n  const [email, setEmail] = useState('');\n  const [password, setPassword] = useState('');\n  const [transactionId, setTransactionId] = useState<string | null>(null);\n  const [otp, setOtp] = useState('');\n  const [apiKey, setApiKey] = useState('');\n  const [publicKey, setPublicKey] = useState('');\n  const [secretKey, setSecretKey] = useState('');\n  const [notice, setNotice] = useState<string | null>(null);\n\n  const finish = (next: PayoutIntegration, message: string) => {\n    setEditing(false);\n    setNotice(message);\n    onChange(next);\n    onRefresh();\n  };\n  const signIn = useMutation({\n    mutationFn: () =>\n      platformAdminApi.signInPayoutIntegration(key, email, password),\n    onSuccess: (result) => {\n      setPassword('');\n      if (result.otpRequired) {\n        setTransactionId(result.transactionId);\n        setNotice(null);\n      } else {\n        finish(result.integration, 'Signed in.');\n      }\n    },\n  });\n  const verify = useMutation({\n    mutationFn: () =>\n      platformAdminApi.verifyPayoutIntegration(key, transactionId ?? '', otp),\n    onSuccess: (next) => {\n      setTransactionId(null);\n      setOtp('');\n      finish(next, 'Signed in. The session renews on its own.');\n    },\n  });\n  const saveKey = useMutation({\n    mutationFn: () => platformAdminApi.savePayoutIntegrationApiKey(key, apiKey),\n    onSuccess: (next) => {\n      setApiKey('');\n      finish(next, 'API key saved.');\n    },\n  });\n\n  const saveKeys = useMutation({\n    mutationFn: () =>\n      platformAdminApi.savePayoutIntegrationCredentials(\n        key,\n        publicKey,\n        secretKey,\n      ),\n    onSuccess: (next) => {\n      setPublicKey('');\n      setSecretKey('');\n      finish(next, 'Keys saved.');\n    },\n  });\n\n  const error = signIn.error ?? verify.error ?? saveKey.error ?? saveKeys.error;\n  const busy =\n    signIn.isPending ||\n    verify.isPending ||\n    saveKey.isPending ||\n    saveKeys.isPending;\n\n  return {\n    keyOnly,\n    keyPair,\n    login,\n    connected,\n    editing,\n    setEditing,\n    email,\n    setEmail,\n    password,\n    setPassword,\n    transactionId,\n    setTransactionId,\n    otp,\n    setOtp,\n    apiKey,\n    setApiKey,\n    publicKey,\n    setPublicKey,\n    secretKey,\n    setSecretKey,\n    notice,\n    signIn,\n    verify,\n    saveKey,\n    saveKeys,\n    error,\n    busy,\n  };\n}\n\n/** What step 1 says: what is saved, or what to paste or sign in with. */\nexport function connectSummary(\n  integration: PayoutIntegration,\n  editing: boolean,\n): string {\n  const keyOnly = integration.auth === 'apiKey';\n  const keyPair = integration.auth === 'signed';\n  const connected = integration.signedIn && !integration.needsSignIn;\n  return connected && !editing\n    ? keyOnly || keyPair\n      ? `Key ending ${\n          integration.account?.replace(/^•+/, '') ?? ''\n        } is saved and sealed.`\n      : `Signed in as ${integration.account}. The session renews automatically.`\n    : keyOnly\n    ? 'Paste the secret key from the provider dashboard. It is stored sealed and only its last four characters are ever shown.'\n    : keyPair\n    ? 'Paste the public and the secret key from the provider dashboard. They are stored sealed and only the last four characters are ever shown. Nothing expires, so there is no sign-in to repeat.'\n    : 'Sign in with the provider account that holds the money. The password and code are used once and never stored.';\n}\n"],"mappings":"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","names":[]}

package/dist/admin/payout-providers/verify-step.js

@@ -0,0 +1,57 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMutation } from "@tanstack/react-query";
+import { Banner, Button } from "@withpotter/ui-kit";
+import { platformAdminApi } from "@withpotter/platform-admin";
+import { errorText, when } from "./shared";
+import { Step } from "./step";
+import styles from "./payout-providers.module.css";
+function VerifyStep({
+  integration,
+  number,
+  unlocked,
+  onRefresh
+}) {
+  const test = useMutation({
+    mutationFn: () => platformAdminApi.testPayoutIntegration(integration.key),
+    onSuccess: onRefresh
+  });
+  const ok = integration.lastTestStatus === "ok";
+  const result = test.data;
+  return /* @__PURE__ */ jsxs(
+    Step,
+    {
+      number,
+      title: "Check the connection",
+      state: !unlocked ? "locked" : ok ? "done" : "active",
+      summary: !unlocked ? "Available once the account is connected." : ok ? `Connection verified on ${when(
+        integration.lastTestedAt
+      )}. The account is ready to send transfers. No money was moved.` : integration.lastTestStatus ? `The last check was \u201C${integration.lastTestStatus}\u201D. Run it again once fixed.` : "Signs in and confirms the account is ready to send transfers. No money moves.",
+      action: unlocked && ok ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: styles.link,
+          onClick: () => test.mutate(),
+          children: "Run again"
+        }
+      ) : void 0,
+      children: [
+        unlocked && !ok && /* @__PURE__ */ jsx("div", { className: styles.actions, children: /* @__PURE__ */ jsx(Button, { loading: test.isPending, onClick: () => test.mutate(), children: "Run check" }) }),
+        result && !result.ok && /* @__PURE__ */ jsx(Banner, { tone: "error", children: result.detail }),
+        test.error && /* @__PURE__ */ jsx(Banner, { tone: "error", children: errorText(test.error) }),
+        unlocked && integration.auth === "login" && integration.accessTokenExpiresAt && /* @__PURE__ */ jsxs("p", { className: styles.meta, children: [
+          /* @__PURE__ */ jsxs("span", { children: [
+            "Session token valid until ",
+            when(integration.accessTokenExpiresAt)
+          ] }),
+          /* @__PURE__ */ jsx("span", { children: "It renews on its own." })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  VerifyStep
+};
+//# sourceMappingURL=verify-step.js.map

package/dist/admin/payout-providers/verify-step.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/verify-step.tsx"],"sourcesContent":["'use client';\n\nimport { useMutation } from '@tanstack/react-query';\nimport { Banner, Button } from '@withpotter/ui-kit';\nimport type { PayoutIntegration } from '@withpotter/platform-admin';\nimport { platformAdminApi } from '@withpotter/platform-admin';\nimport { errorText, when } from './shared';\nimport { Step } from './step';\nimport styles from './payout-providers.module.css';\n\n/** Proves the connection without moving money: signs in (or renews) and checks the account is ready to send. */\nexport function VerifyStep({\n  integration,\n  number,\n  unlocked,\n  onRefresh,\n}: {\n  integration: PayoutIntegration;\n  number: number;\n  unlocked: boolean;\n  onRefresh: () => void;\n}) {\n  const test = useMutation({\n    mutationFn: () => platformAdminApi.testPayoutIntegration(integration.key),\n    onSuccess: onRefresh,\n  });\n  const ok = integration.lastTestStatus === 'ok';\n  const result = test.data;\n\n  return (\n    <Step\n      number={number}\n      title=\"Check the connection\"\n      state={!unlocked ? 'locked' : ok ? 'done' : 'active'}\n      summary={\n        !unlocked\n          ? 'Available once the account is connected.'\n          : ok\n          ? `Connection verified on ${when(\n              integration.lastTestedAt,\n            )}. The account is ready to send transfers. No money was moved.`\n          : integration.lastTestStatus\n          ? `The last check was “${integration.lastTestStatus}”. Run it again once fixed.`\n          : 'Signs in and confirms the account is ready to send transfers. No money moves.'\n      }\n      action={\n        unlocked && ok ? (\n          <button\n            type=\"button\"\n            className={styles.link}\n            onClick={() => test.mutate()}\n          >\n            Run again\n          </button>\n        ) : undefined\n      }\n    >\n      {unlocked && !ok && (\n        <div className={styles.actions}>\n          <Button loading={test.isPending} onClick={() => test.mutate()}>\n            Run check\n          </Button>\n        </div>\n      )}\n      {result && !result.ok && <Banner tone=\"error\">{result.detail}</Banner>}\n      {test.error && <Banner tone=\"error\">{errorText(test.error)}</Banner>}\n      {unlocked &&\n        integration.auth === 'login' &&\n        integration.accessTokenExpiresAt && (\n          <p className={styles.meta}>\n            <span>\n              Session token valid until {when(integration.accessTokenExpiresAt)}\n            </span>\n            <span>It renews on its own.</span>\n          </p>\n        )}\n    </Step>\n  );\n}\n"],"mappings":";AA+CU,cAuBE,YAvBF;AA7CV,SAAS,mBAAmB;AAC5B,SAAS,QAAQ,cAAc;AAE/B,SAAS,wBAAwB;AACjC,SAAS,WAAW,YAAY;AAChC,SAAS,YAAY;AACrB,OAAO,YAAY;AAGZ,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,QAAM,OAAO,YAAY;AAAA,IACvB,YAAY,MAAM,iBAAiB,sBAAsB,YAAY,GAAG;AAAA,IACxE,WAAW;AAAA,EACb,CAAC;AACD,QAAM,KAAK,YAAY,mBAAmB;AAC1C,QAAM,SAAS,KAAK;AAEpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAM;AAAA,MACN,OAAO,CAAC,WAAW,WAAW,KAAK,SAAS;AAAA,MAC5C,SACE,CAAC,WACG,6CACA,KACA,0BAA0B;AAAA,QACxB,YAAY;AAAA,MACd,CAAC,kEACD,YAAY,iBACZ,4BAAuB,YAAY,cAAc,qCACjD;AAAA,MAEN,QACE,YAAY,KACV;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAW,OAAO;AAAA,UAClB,SAAS,MAAM,KAAK,OAAO;AAAA,UAC5B;AAAA;AAAA,MAED,IACE;AAAA,MAGL;AAAA,oBAAY,CAAC,MACZ,oBAAC,SAAI,WAAW,OAAO,SACrB,8BAAC,UAAO,SAAS,KAAK,WAAW,SAAS,MAAM,KAAK,OAAO,GAAG,uBAE/D,GACF;AAAA,QAED,UAAU,CAAC,OAAO,MAAM,oBAAC,UAAO,MAAK,SAAS,iBAAO,QAAO;AAAA,QAC5D,KAAK,SAAS,oBAAC,UAAO,MAAK,SAAS,oBAAU,KAAK,KAAK,GAAE;AAAA,QAC1D,YACC,YAAY,SAAS,WACrB,YAAY,wBACV,qBAAC,OAAE,WAAW,OAAO,MACnB;AAAA,+BAAC,UAAK;AAAA;AAAA,YACuB,KAAK,YAAY,oBAAoB;AAAA,aAClE;AAAA,UACA,oBAAC,UAAK,mCAAqB;AAAA,WAC7B;AAAA;AAAA;AAAA,EAEN;AAEJ;","names":[]}