@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/payout-providers/attention-list.js

@@ -0,0 +1,135 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { Banner, Button, Input, useConfirm } from "@withpotter/ui-kit";
+import {
+  platformAdminApi
+} from "@withpotter/platform-admin";
+import { formatMinor } from "@withpotter/lib/money-minor";
+import { Panel } from "../_ui";
+import { errorText } from "./shared";
+import styles from "./payout-providers.module.css";
+import sec from "./sections.module.css";
+const QUERY_KEY = ["platform-admin", "payouts-attention"];
+const amountOf = (payout) => formatMinor(payout.amountMinor, payout.currency || "NGN");
+const age = (minutes) => minutes < 60 ? `${minutes} min` : minutes < 1440 ? `${Math.floor(minutes / 60)} h` : `${Math.floor(minutes / 1440)} d`;
+function AttentionList() {
+  const queryClient = useQueryClient();
+  const confirm = useConfirm();
+  const { data } = useQuery({
+    queryKey: QUERY_KEY,
+    queryFn: () => platformAdminApi.payoutsNeedingAttention(),
+    refetchInterval: 3e4
+  });
+  const [open, setOpen] = useState(
+    null
+  );
+  const [note, setNote] = useState("");
+  const resolve = useMutation({
+    mutationFn: (value) => platformAdminApi.resolvePayout(value.id, value.outcome, value.note),
+    onSuccess: () => {
+      setOpen(null);
+      setNote("");
+      void queryClient.invalidateQueries({ queryKey: QUERY_KEY });
+    }
+  });
+  if (!data || data.length === 0) return null;
+  const submit = async (payout) => {
+    if (!open) return;
+    const outcome = open.outcome;
+    const what = outcome === "SUCCESS" ? "The money DID reach the bank account. This marks the payout completed." : "The money did NOT leave. This returns the amount to the merchant\u2019s available balance.";
+    const ok = await confirm({
+      title: `${amountOf(payout)} to ${payout.accountName} (${payout.accountNumberMasked})`,
+      description: `${what} Only continue if you have checked the provider account. This cannot be undone.`,
+      confirmLabel: outcome === "SUCCESS" ? "Mark completed" : "Mark failed",
+      tone: "danger"
+    });
+    if (ok) resolve.mutate({ id: payout.id, outcome, note: note.trim() });
+  };
+  return /* @__PURE__ */ jsxs(
+    Panel,
+    {
+      title: "Payouts needing attention",
+      count: data.length,
+      className: "adm-section",
+      children: [
+        /* @__PURE__ */ jsx("p", { className: styles.desc, children: "Sent to the provider but not confirmed. Check the provider account for each one, then mark it completed (the money arrived) or failed (it did not leave)." }),
+        data.map((payout) => /* @__PURE__ */ jsxs("div", { className: sec.attnRow, children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("span", { className: sec.amount, children: amountOf(payout) }),
+            " to",
+            " ",
+            payout.accountName,
+            " ",
+            /* @__PURE__ */ jsxs("span", { className: styles.help, children: [
+              "(",
+              payout.accountNumberMasked,
+              ")"
+            ] }),
+            /* @__PURE__ */ jsxs("p", { className: styles.help, style: { marginTop: 4 }, children: [
+              payout.tenantSlug ?? "unknown merchant",
+              " \xB7",
+              " ",
+              payout.status === "NEEDS_REVIEW" ? "needs review" : "sent, not confirmed",
+              " ",
+              "\xB7 ",
+              age(payout.ageMinutes),
+              " ago",
+              payout.providerReference ? ` \xB7 provider ref ${payout.providerReference}` : ""
+            ] })
+          ] }),
+          open?.id === payout.id ? /* @__PURE__ */ jsxs("div", { className: sec.attnForm, children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                "aria-label": "Note",
+                label: open.outcome === "SUCCESS" ? "Mark completed: how did you check?" : "Mark failed: how did you check?",
+                placeholder: "e.g. Olive dashboard shows it sent, reference matches",
+                value: note,
+                onChange: (e) => setNote(e.target.value)
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: styles.actions, children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  size: "sm",
+                  loading: resolve.isPending,
+                  disabled: note.trim().length < 3,
+                  onClick: () => void submit(payout),
+                  children: "Confirm"
+                }
+              ),
+              /* @__PURE__ */ jsx(Button, { size: "sm", variant: "ghost", onClick: () => setOpen(null), children: "Cancel" })
+            ] })
+          ] }) : /* @__PURE__ */ jsxs("div", { className: styles.actions, children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "secondary",
+                size: "sm",
+                onClick: () => setOpen({ id: payout.id, outcome: "SUCCESS" }),
+                children: "Mark completed"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "secondary",
+                size: "sm",
+                onClick: () => setOpen({ id: payout.id, outcome: "FAILED" }),
+                children: "Mark failed"
+              }
+            )
+          ] })
+        ] }, payout.id)),
+        resolve.error && /* @__PURE__ */ jsx(Banner, { tone: "error", children: errorText(resolve.error) })
+      ]
+    }
+  );
+}
+export {
+  AttentionList
+};
+//# sourceMappingURL=attention-list.js.map

package/dist/admin/payout-providers/attention-list.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/attention-list.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';\nimport { Banner, Button, Input, useConfirm } from '@withpotter/ui-kit';\nimport {\n  platformAdminApi,\n  type AttentionPayout,\n} from '@withpotter/platform-admin';\nimport { formatMinor } from '@withpotter/lib/money-minor';\nimport { Panel } from '../_ui';\nimport { errorText } from './shared';\nimport styles from './payout-providers.module.css';\nimport sec from './sections.module.css';\n\nconst QUERY_KEY = ['platform-admin', 'payouts-attention'];\n\nconst amountOf = (payout: AttentionPayout) =>\n  formatMinor(payout.amountMinor, payout.currency || 'NGN');\n\nconst age = (minutes: number) =>\n  minutes < 60\n    ? `${minutes} min`\n    : minutes < 1440\n    ? `${Math.floor(minutes / 60)} h`\n    : `${Math.floor(minutes / 1440)} d`;\n\ntype Outcome = 'SUCCESS' | 'FAILED';\n\n/**\n * Payouts the system could not confirm: sent to the provider but never marked\n * complete (a provider with no lookup, or an answer no rule matched). An\n * operator checks the provider account and says what happened. The money moves\n * through the same settlement an automatic outcome uses.\n */\nexport function AttentionList() {\n  const queryClient = useQueryClient();\n  const confirm = useConfirm();\n  const { data } = useQuery({\n    queryKey: QUERY_KEY,\n    queryFn: () => platformAdminApi.payoutsNeedingAttention(),\n    refetchInterval: 30_000,\n  });\n  const [open, setOpen] = useState<{ id: string; outcome: Outcome } | null>(\n    null,\n  );\n  const [note, setNote] = useState('');\n  const resolve = useMutation({\n    mutationFn: (value: { id: string; outcome: Outcome; note: string }) =>\n      platformAdminApi.resolvePayout(value.id, value.outcome, value.note),\n    onSuccess: () => {\n      setOpen(null);\n      setNote('');\n      void queryClient.invalidateQueries({ queryKey: QUERY_KEY });\n    },\n  });\n\n  if (!data || data.length === 0) return null;\n\n  const submit = async (payout: AttentionPayout) => {\n    if (!open) return;\n    const outcome = open.outcome;\n    const what =\n      outcome === 'SUCCESS'\n        ? 'The money DID reach the bank account. This marks the payout completed.'\n        : 'The money did NOT leave. This returns the amount to the merchant’s available balance.';\n    const ok = await confirm({\n      title: `${amountOf(payout)} to ${payout.accountName} (${\n        payout.accountNumberMasked\n      })`,\n      description: `${what} Only continue if you have checked the provider account. This cannot be undone.`,\n      confirmLabel: outcome === 'SUCCESS' ? 'Mark completed' : 'Mark failed',\n      tone: 'danger',\n    });\n    if (ok) resolve.mutate({ id: payout.id, outcome, note: note.trim() });\n  };\n\n  return (\n    <Panel\n      title=\"Payouts needing attention\"\n      count={data.length}\n      className=\"adm-section\"\n    >\n      <p className={styles.desc}>\n        Sent to the provider but not confirmed. Check the provider account for\n        each one, then mark it completed (the money arrived) or failed (it did\n        not leave).\n      </p>\n      {data.map((payout) => (\n        <div key={payout.id} className={sec.attnRow}>\n          <div>\n            <span className={sec.amount}>{amountOf(payout)}</span> to{' '}\n            {payout.accountName}{' '}\n            <span className={styles.help}>({payout.accountNumberMasked})</span>\n            <p className={styles.help} style={{ marginTop: 4 }}>\n              {payout.tenantSlug ?? 'unknown merchant'} ·{' '}\n              {payout.status === 'NEEDS_REVIEW'\n                ? 'needs review'\n                : 'sent, not confirmed'}{' '}\n              · {age(payout.ageMinutes)} ago\n              {payout.providerReference\n                ? ` · provider ref ${payout.providerReference}`\n                : ''}\n            </p>\n          </div>\n          {open?.id === payout.id ? (\n            <div className={sec.attnForm}>\n              <Input\n                aria-label=\"Note\"\n                label={\n                  open.outcome === 'SUCCESS'\n                    ? 'Mark completed: how did you check?'\n                    : 'Mark failed: how did you check?'\n                }\n                placeholder=\"e.g. Olive dashboard shows it sent, reference matches\"\n                value={note}\n                onChange={(e) => setNote(e.target.value)}\n              />\n              <div className={styles.actions}>\n                <Button\n                  size=\"sm\"\n                  loading={resolve.isPending}\n                  disabled={note.trim().length < 3}\n                  onClick={() => void submit(payout)}\n                >\n                  Confirm\n                </Button>\n                <Button size=\"sm\" variant=\"ghost\" onClick={() => setOpen(null)}>\n                  Cancel\n                </Button>\n              </div>\n            </div>\n          ) : (\n            <div className={styles.actions}>\n              <Button\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={() => setOpen({ id: payout.id, outcome: 'SUCCESS' })}\n              >\n                Mark completed\n              </Button>\n              <Button\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={() => setOpen({ id: payout.id, outcome: 'FAILED' })}\n              >\n                Mark failed\n              </Button>\n            </div>\n          )}\n        </div>\n      ))}\n      {resolve.error && (\n        <Banner tone=\"error\">{errorText(resolve.error)}</Banner>\n      )}\n    </Panel>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -0,0 +1,180 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Banner, Button, Input } from "@withpotter/ui-kit";
+import { errorText } from "./shared";
+import { Step } from "./step";
+import { connectSummary, useConnect } from "./use-connect";
+import styles from "./payout-providers.module.css";
+function ConnectStep({
+  integration,
+  onChange,
+  onRefresh
+}) {
+  const { steps } = integration;
+  const {
+    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
+  } = useConnect(integration, onChange, onRefresh);
+  const open = !connected || editing;
+  return /* @__PURE__ */ jsxs(
+    Step,
+    {
+      number: 1,
+      title: keyOnly ? "API key" : keyPair ? "API keys" : "Account",
+      state: connected && !editing ? "done" : "active",
+      summary: connectSummary(integration, editing),
+      action: (connected || editing) && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: styles.link,
+          onClick: () => setEditing(!editing),
+          children: editing ? "Cancel" : keyOnly || keyPair ? "Replace keys" : "Sign in again"
+        }
+      ),
+      children: [
+        open && keyOnly && steps.includes("apiKey") && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("div", { className: styles.fields, children: /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Secret API key",
+              type: "password",
+              autoComplete: "off",
+              placeholder: "sk_live_\u2026",
+              value: apiKey,
+              onChange: (e) => setApiKey(e.target.value.trim())
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { className: styles.actions, children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              loading: saveKey.isPending,
+              disabled: busy || apiKey.length < 8,
+              onClick: () => saveKey.mutate(),
+              children: "Save key"
+            }
+          ) })
+        ] }),
+        open && keyPair && steps.includes("publicKey") && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs("div", { className: styles.fields, children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                label: "Public key",
+                autoComplete: "off",
+                value: publicKey,
+                onChange: (e) => setPublicKey(e.target.value.trim())
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                label: "Secret key",
+                type: "password",
+                autoComplete: "off",
+                value: secretKey,
+                onChange: (e) => setSecretKey(e.target.value.trim())
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: styles.actions, children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              loading: saveKeys.isPending,
+              disabled: busy || publicKey.length < 8 || secretKey.length < 8,
+              onClick: () => saveKeys.mutate(),
+              children: "Save keys"
+            }
+          ) })
+        ] }),
+        open && login && !transactionId && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs("div", { className: styles.fields, children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                label: "Account email",
+                type: "email",
+                autoComplete: "off",
+                value: email,
+                onChange: (e) => setEmail(e.target.value)
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                label: "Password",
+                type: "password",
+                autoComplete: "off",
+                value: password,
+                onChange: (e) => setPassword(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: styles.actions, children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              loading: signIn.isPending,
+              disabled: busy || !email || !password,
+              onClick: () => signIn.mutate(),
+              children: steps.includes("otp") ? "Send verification code" : "Sign in"
+            }
+          ) })
+        ] }),
+        open && login && transactionId && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Banner, { tone: "neutral", children: "A verification code was sent to the account email. Enter it to finish signing in." }),
+          /* @__PURE__ */ jsx("div", { className: styles.fields, children: /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Verification code",
+              inputMode: "numeric",
+              value: otp,
+              onChange: (e) => setOtp(e.target.value.replace(/\D/g, ""))
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: styles.actions, children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                loading: verify.isPending,
+                disabled: busy || otp.length < 4,
+                onClick: () => verify.mutate(),
+                children: "Verify and sign in"
+              }
+            ),
+            /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: () => setTransactionId(null), children: "Start over" })
+          ] })
+        ] }),
+        error ? /* @__PURE__ */ jsx(Banner, { tone: "error", children: errorText(error) }) : notice ? /* @__PURE__ */ jsx(Banner, { tone: "success", children: notice }) : null
+      ]
+    }
+  );
+}
+export {
+  ConnectStep
+};
+//# sourceMappingURL=connect-step.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/payout-providers/connect-step.tsx"],"sourcesContent":["'use client';\n\nimport { Banner, Button, Input } from '@withpotter/ui-kit';\nimport type { PayoutIntegration } from '@withpotter/platform-admin';\nimport { errorText } from './shared';\nimport { Step } from './step';\nimport { connectSummary, useConnect } from './use-connect';\nimport styles from './payout-providers.module.css';\n\n/**\n * Connects the account with the steps the provider declares: an email and\n * password followed by an emailed code, a single secret API key, or a public and\n * a secret key that every request is signed with. Secrets are sent once; the\n * password and code are never stored, the keys are stored sealed.\n */\nexport function ConnectStep({\n  integration,\n  onChange,\n  onRefresh,\n}: {\n  integration: PayoutIntegration;\n  onChange: (next: PayoutIntegration) => void;\n  onRefresh: () => void;\n}) {\n  const { steps } = integration;\n  const {\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  } = useConnect(integration, onChange, onRefresh);\n  const open = !connected || editing;\n\n  return (\n    <Step\n      number={1}\n      title={keyOnly ? 'API key' : keyPair ? 'API keys' : 'Account'}\n      state={connected && !editing ? 'done' : 'active'}\n      summary={connectSummary(integration, editing)}\n      action={\n        (connected || editing) && (\n          <button\n            type=\"button\"\n            className={styles.link}\n            onClick={() => setEditing(!editing)}\n          >\n            {editing\n              ? 'Cancel'\n              : keyOnly || keyPair\n              ? 'Replace keys'\n              : 'Sign in again'}\n          </button>\n        )\n      }\n    >\n      {open && keyOnly && steps.includes('apiKey') && (\n        <>\n          <div className={styles.fields}>\n            <Input\n              label=\"Secret API key\"\n              type=\"password\"\n              autoComplete=\"off\"\n              placeholder=\"sk_live_…\"\n              value={apiKey}\n              onChange={(e) => setApiKey(e.target.value.trim())}\n            />\n          </div>\n          <div className={styles.actions}>\n            <Button\n              loading={saveKey.isPending}\n              disabled={busy || apiKey.length < 8}\n              onClick={() => saveKey.mutate()}\n            >\n              Save key\n            </Button>\n          </div>\n        </>\n      )}\n\n      {open && keyPair && steps.includes('publicKey') && (\n        <>\n          <div className={styles.fields}>\n            <Input\n              label=\"Public key\"\n              autoComplete=\"off\"\n              value={publicKey}\n              onChange={(e) => setPublicKey(e.target.value.trim())}\n            />\n            <Input\n              label=\"Secret key\"\n              type=\"password\"\n              autoComplete=\"off\"\n              value={secretKey}\n              onChange={(e) => setSecretKey(e.target.value.trim())}\n            />\n          </div>\n          <div className={styles.actions}>\n            <Button\n              loading={saveKeys.isPending}\n              disabled={busy || publicKey.length < 8 || secretKey.length < 8}\n              onClick={() => saveKeys.mutate()}\n            >\n              Save keys\n            </Button>\n          </div>\n        </>\n      )}\n\n      {open && login && !transactionId && (\n        <>\n          <div className={styles.fields}>\n            <Input\n              label=\"Account email\"\n              type=\"email\"\n              autoComplete=\"off\"\n              value={email}\n              onChange={(e) => setEmail(e.target.value)}\n            />\n            <Input\n              label=\"Password\"\n              type=\"password\"\n              autoComplete=\"off\"\n              value={password}\n              onChange={(e) => setPassword(e.target.value)}\n            />\n          </div>\n          <div className={styles.actions}>\n            <Button\n              loading={signIn.isPending}\n              disabled={busy || !email || !password}\n              onClick={() => signIn.mutate()}\n            >\n              {steps.includes('otp') ? 'Send verification code' : 'Sign in'}\n            </Button>\n          </div>\n        </>\n      )}\n\n      {open && login && transactionId && (\n        <>\n          <Banner tone=\"neutral\">\n            A verification code was sent to the account email. Enter it to\n            finish signing in.\n          </Banner>\n          <div className={styles.fields}>\n            <Input\n              label=\"Verification code\"\n              inputMode=\"numeric\"\n              value={otp}\n              onChange={(e) => setOtp(e.target.value.replace(/\\D/g, ''))}\n            />\n          </div>\n          <div className={styles.actions}>\n            <Button\n              loading={verify.isPending}\n              disabled={busy || otp.length < 4}\n              onClick={() => verify.mutate()}\n            >\n              Verify and sign in\n            </Button>\n            <Button variant=\"ghost\" onClick={() => setTransactionId(null)}>\n              Start over\n            </Button>\n          </div>\n        </>\n      )}\n\n      {error ? (\n        <Banner tone=\"error\">{errorText(error)}</Banner>\n      ) : notice ? (\n        <Banner tone=\"success\">{notice}</Banner>\n      ) : null}\n    </Step>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/payout-providers/editor/auth-section.js

@@ -0,0 +1,166 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Input } from "@withpotter/ui-kit";
+import { CallEditor } from "./call-editor";
+import { ConditionsEditor } from "./condition-editor";
+import { Group, Toggle } from "./fields";
+import { Section, SourceEditor, newCall } from "./flow-parts";
+import styles from "../payout-providers.module.css";
+function AuthSection({
+  draft,
+  update,
+  login
+}) {
+  const loginAuth = () => draft.auth;
+  const setLogin = (mutate) => update((next) => mutate(next.auth));
+  return /* @__PURE__ */ jsxs(Section, { title: "Authentication", summary: login ? "Login" : "API key", children: [
+    /* @__PURE__ */ jsxs("div", { className: styles.fields, children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          label: "Header name",
+          value: draft.auth.header.name,
+          onChange: (e) => update((next) => next.auth.header.name = e.target.value)
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          label: "Header value",
+          hint: "{{token}} is the access token or API key",
+          value: draft.auth.header.template,
+          onChange: (e) => update((next) => next.auth.header.template = e.target.value)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(
+      Toggle,
+      {
+        checked: Boolean(draft.auth.pin),
+        onChange: (pin) => update((next) => next.auth.pin = pin),
+        label: "Ask for a transaction PIN (available to transfers as {{pin}})"
+      }
+    ),
+    login && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Group, { title: "Sign-in call", children: /* @__PURE__ */ jsx(
+        CallEditor,
+        {
+          call: loginAuth().login,
+          onChange: (call) => setLogin((auth) => auth.login = call),
+          variables: ["email", "password"],
+          allowAuthHost: true
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Group, { title: "Signed in when\u2026", children: /* @__PURE__ */ jsx(
+        ConditionsEditor,
+        {
+          value: loginAuth().successWhen,
+          onChange: (successWhen) => setLogin((auth) => auth.successWhen = successWhen)
+        }
+      ) }),
+      /* @__PURE__ */ jsxs(Group, { title: "Emailed verification code", children: [
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            checked: Boolean(loginAuth().otp),
+            onChange: (on) => setLogin(
+              (auth) => auth.otp = on ? { requiredWhen: [], verify: newCall("/verify", "POST") } : void 0
+            ),
+            label: "The provider asks for a code after the password"
+          }
+        ),
+        loginAuth().otp && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("span", { className: styles.label, children: "The provider asks for a code when\u2026" }),
+          /* @__PURE__ */ jsx(
+            ConditionsEditor,
+            {
+              value: loginAuth().otp.requiredWhen,
+              onChange: (requiredWhen) => setLogin(
+                (auth) => auth.otp && (auth.otp.requiredWhen = requiredWhen)
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: styles.label, children: "Verify call" }),
+          /* @__PURE__ */ jsx(
+            CallEditor,
+            {
+              call: loginAuth().otp.verify,
+              onChange: (call) => setLogin((auth) => auth.otp && (auth.otp.verify = call)),
+              variables: ["otp"],
+              allowAuthHost: true
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Cookie to send back as x-csrf-token (optional)",
+              value: loginAuth().otp.csrfCookie ?? "",
+              onChange: (e) => setLogin(
+                (auth) => auth.otp && (auth.otp.csrfCookie = e.target.value || void 0)
+              )
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(Group, { title: "Where the tokens are in the answer", children: [
+        /* @__PURE__ */ jsx(
+          SourceEditor,
+          {
+            label: "Access token",
+            value: loginAuth().tokens.access,
+            onChange: (value) => value && setLogin((auth) => auth.tokens.access = value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          SourceEditor,
+          {
+            label: "Refresh token (optional)",
+            value: loginAuth().tokens.refresh,
+            onChange: (value) => setLogin((auth) => auth.tokens.refresh = value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          SourceEditor,
+          {
+            label: "Account id (optional)",
+            value: loginAuth().tokens.externalId,
+            onChange: (value) => setLogin((auth) => auth.tokens.externalId = value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          SourceEditor,
+          {
+            label: "Account email (optional)",
+            value: loginAuth().tokens.email,
+            onChange: (value) => setLogin((auth) => auth.tokens.email = value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs(Group, { title: "Renewing the session", children: [
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            checked: Boolean(loginAuth().renew),
+            onChange: (on) => setLogin(
+              (auth) => auth.renew = on ? { ...newCall("/refresh", "POST"), host: "auth" } : void 0
+            ),
+            label: "Get a new access token with the refresh token, without a code"
+          }
+        ),
+        loginAuth().renew && /* @__PURE__ */ jsx(
+          CallEditor,
+          {
+            call: loginAuth().renew,
+            onChange: (call) => setLogin((auth) => auth.renew = call),
+            variables: ["refreshToken"],
+            allowAuthHost: true
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  AuthSection
+};
+//# sourceMappingURL=auth-section.js.map

package/dist/admin/payout-providers/editor/auth-section.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/admin/payout-providers/editor/auth-section.tsx"],"sourcesContent":["'use client';\n\nimport { Input } from '@withpotter/ui-kit';\nimport type {\n  PayoutFlowDefinition,\n  PayoutLoginAuth,\n} from '@withpotter/platform-admin';\nimport { CallEditor } from './call-editor';\nimport { ConditionsEditor } from './condition-editor';\nimport { Group, Toggle } from './fields';\nimport { Section, SourceEditor, newCall } from './flow-parts';\nimport styles from '../payout-providers.module.css';\n\nexport type UpdateFlow = (mutate: (next: PayoutFlowDefinition) => void) => void;\n\n/** How the flow authenticates: the header, the PIN and, for login flows, the sign-in calls. */\nexport function AuthSection({\n  draft,\n  update,\n  login,\n}: {\n  draft: PayoutFlowDefinition;\n  update: UpdateFlow;\n  login: boolean;\n}) {\n  const loginAuth = () => draft.auth as PayoutLoginAuth;\n  const setLogin = (mutate: (auth: PayoutLoginAuth) => void) =>\n    update((next) => mutate(next.auth as PayoutLoginAuth));\n\n  return (\n    <Section title=\"Authentication\" summary={login ? 'Login' : 'API key'}>\n      <div className={styles.fields}>\n        <Input\n          label=\"Header name\"\n          value={draft.auth.header.name}\n          onChange={(e) =>\n            update((next) => (next.auth.header.name = e.target.value))\n          }\n        />\n        <Input\n          label=\"Header value\"\n          hint=\"{{token}} is the access token or API key\"\n          value={draft.auth.header.template}\n          onChange={(e) =>\n            update((next) => (next.auth.header.template = e.target.value))\n          }\n        />\n      </div>\n      <Toggle\n        checked={Boolean(draft.auth.pin)}\n        onChange={(pin) => update((next) => (next.auth.pin = pin))}\n        label=\"Ask for a transaction PIN (available to transfers as {{pin}})\"\n      />\n      {login && (\n        <>\n          <Group title=\"Sign-in call\">\n            <CallEditor\n              call={loginAuth().login}\n              onChange={(call) => setLogin((auth) => (auth.login = call))}\n              variables={['email', 'password']}\n              allowAuthHost\n            />\n          </Group>\n          <Group title=\"Signed in when…\">\n            <ConditionsEditor\n              value={loginAuth().successWhen}\n              onChange={(successWhen) =>\n                setLogin((auth) => (auth.successWhen = successWhen))\n              }\n            />\n          </Group>\n          <Group title=\"Emailed verification code\">\n            <Toggle\n              checked={Boolean(loginAuth().otp)}\n              onChange={(on) =>\n                setLogin(\n                  (auth) =>\n                    (auth.otp = on\n                      ? { requiredWhen: [], verify: newCall('/verify', 'POST') }\n                      : undefined),\n                )\n              }\n              label=\"The provider asks for a code after the password\"\n            />\n            {loginAuth().otp && (\n              <>\n                <span className={styles.label}>\n                  The provider asks for a code when…\n                </span>\n                <ConditionsEditor\n                  value={loginAuth().otp!.requiredWhen}\n                  onChange={(requiredWhen) =>\n                    setLogin(\n                      (auth) =>\n                        auth.otp && (auth.otp.requiredWhen = requiredWhen),\n                    )\n                  }\n                />\n                <span className={styles.label}>Verify call</span>\n                <CallEditor\n                  call={loginAuth().otp!.verify}\n                  onChange={(call) =>\n                    setLogin((auth) => auth.otp && (auth.otp.verify = call))\n                  }\n                  variables={['otp']}\n                  allowAuthHost\n                />\n                <Input\n                  label=\"Cookie to send back as x-csrf-token (optional)\"\n                  value={loginAuth().otp!.csrfCookie ?? ''}\n                  onChange={(e) =>\n                    setLogin(\n                      (auth) =>\n                        auth.otp &&\n                        (auth.otp.csrfCookie = e.target.value || undefined),\n                    )\n                  }\n                />\n              </>\n            )}\n          </Group>\n          <Group title=\"Where the tokens are in the answer\">\n            <SourceEditor\n              label=\"Access token\"\n              value={loginAuth().tokens.access}\n              onChange={(value) =>\n                value && setLogin((auth) => (auth.tokens.access = value))\n              }\n            />\n            <SourceEditor\n              label=\"Refresh token (optional)\"\n              value={loginAuth().tokens.refresh}\n              onChange={(value) =>\n                setLogin((auth) => (auth.tokens.refresh = value))\n              }\n            />\n            <SourceEditor\n              label=\"Account id (optional)\"\n              value={loginAuth().tokens.externalId}\n              onChange={(value) =>\n                setLogin((auth) => (auth.tokens.externalId = value))\n              }\n            />\n            <SourceEditor\n              label=\"Account email (optional)\"\n              value={loginAuth().tokens.email}\n              onChange={(value) =>\n                setLogin((auth) => (auth.tokens.email = value))\n              }\n            />\n          </Group>\n          <Group title=\"Renewing the session\">\n            <Toggle\n              checked={Boolean(loginAuth().renew)}\n              onChange={(on) =>\n                setLogin(\n                  (auth) =>\n                    (auth.renew = on\n                      ? { ...newCall('/refresh', 'POST'), host: 'auth' }\n                      : undefined),\n                )\n              }\n              label=\"Get a new access token with the refresh token, without a code\"\n            />\n            {loginAuth().renew && (\n              <CallEditor\n                call={loginAuth().renew!}\n                onChange={(call) => setLogin((auth) => (auth.renew = call))}\n                variables={['refreshToken']}\n                allowAuthHost\n              />\n            )}\n          </Group>\n        </>\n      )}\n    </Section>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/payout-providers/editor/call-editor.js

@@ -0,0 +1,107 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Input, Textarea } from "@withpotter/ui-kit";
+import { KeyValueEditor, SelectField, Variables } from "./fields";
+import styles from "../payout-providers.module.css";
+import ed from "./editor.module.css";
+function CallEditor({
+  call,
+  onChange,
+  variables,
+  allowAuthHost
+}) {
+  const [bodyText, setBodyText] = useState(
+    call.body === void 0 ? "" : JSON.stringify(call.body, null, 2)
+  );
+  const [bodyError, setBodyError] = useState(null);
+  const changeBody = (text) => {
+    setBodyText(text);
+    if (!text.trim()) {
+      setBodyError(null);
+      onChange({ ...call, body: void 0 });
+      return;
+    }
+    try {
+      onChange({ ...call, body: JSON.parse(text) });
+      setBodyError(null);
+    } catch {
+      setBodyError("The body must be valid JSON");
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: ed.call, children: [
+    /* @__PURE__ */ jsxs("div", { className: ed.row, children: [
+      /* @__PURE__ */ jsx(
+        SelectField,
+        {
+          label: "Method",
+          value: call.method,
+          options: [
+            { value: "GET", label: "GET" },
+            { value: "POST", label: "POST" },
+            { value: "PUT", label: "PUT" }
+          ],
+          onChange: (method) => onChange({ ...call, method })
+        }
+      ),
+      allowAuthHost && /* @__PURE__ */ jsx(
+        SelectField,
+        {
+          label: "Host",
+          value: call.host,
+          options: [
+            { value: "api", label: "API host" },
+            { value: "auth", label: "Auth host" }
+          ],
+          onChange: (host) => onChange({ ...call, host })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          label: "Path",
+          value: call.path,
+          onChange: (e) => onChange({ ...call, path: e.target.value })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(Variables, { names: variables }),
+    /* @__PURE__ */ jsx("details", { className: ed.more, children: /* @__PURE__ */ jsxs("div", { className: ed.list8, children: [
+      /* @__PURE__ */ jsx("summary", { children: "Query, headers and body" }),
+      /* @__PURE__ */ jsx("span", { className: styles.label, children: "Query string" }),
+      /* @__PURE__ */ jsx(
+        KeyValueEditor,
+        {
+          value: call.query,
+          onChange: (query) => onChange({ ...call, query }),
+          keyLabel: "Parameter"
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: styles.label, children: "Extra headers" }),
+      /* @__PURE__ */ jsx(
+        KeyValueEditor,
+        {
+          value: call.headers,
+          onChange: (headers) => onChange({ ...call, headers }),
+          keyLabel: "Header"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          label: "Body (JSON)",
+          className: ed.mono,
+          rows: 6,
+          spellCheck: false,
+          value: bodyText,
+          onChange: (e) => changeBody(e.target.value)
+        }
+      ),
+      bodyError && /* @__PURE__ */ jsx("p", { className: ed.errorText, children: bodyError })
+    ] }) })
+  ] });
+}
+export {
+  CallEditor
+};
+//# sourceMappingURL=call-editor.js.map