@withpotter/pages-admin 0.13.0-next.101

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/admin/payout-providers/editor/call-editor.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { Input, Textarea } from '@withpotter/ui-kit';\nimport type { PayoutCall } from '@withpotter/platform-admin';\nimport { KeyValueEditor, SelectField, Variables } from './fields';\nimport styles from '../payout-providers.module.css';\nimport ed from './editor.module.css';\n\n/** One HTTP call: method, host, path, query, headers and a JSON body template. */\nexport function CallEditor({\n  call,\n  onChange,\n  variables,\n  allowAuthHost,\n}: {\n  call: PayoutCall;\n  onChange: (next: PayoutCall) => void;\n  /** The `{{values}}` this call may use. */\n  variables: string[];\n  allowAuthHost?: boolean;\n}) {\n  const [bodyText, setBodyText] = useState(\n    call.body === undefined ? '' : JSON.stringify(call.body, null, 2),\n  );\n  const [bodyError, setBodyError] = useState<string | null>(null);\n\n  const changeBody = (text: string) => {\n    setBodyText(text);\n    if (!text.trim()) {\n      setBodyError(null);\n      onChange({ ...call, body: undefined });\n      return;\n    }\n    try {\n      onChange({ ...call, body: JSON.parse(text) });\n      setBodyError(null);\n    } catch {\n      setBodyError('The body must be valid JSON');\n    }\n  };\n\n  return (\n    <div className={ed.call}>\n      <div className={ed.row}>\n        <SelectField\n          label=\"Method\"\n          value={call.method}\n          options={[\n            { value: 'GET', label: 'GET' },\n            { value: 'POST', label: 'POST' },\n            { value: 'PUT', label: 'PUT' },\n          ]}\n          onChange={(method) => onChange({ ...call, method })}\n        />\n        {allowAuthHost && (\n          <SelectField\n            label=\"Host\"\n            value={call.host}\n            options={[\n              { value: 'api', label: 'API host' },\n              { value: 'auth', label: 'Auth host' },\n            ]}\n            onChange={(host) => onChange({ ...call, host })}\n          />\n        )}\n        <Input\n          label=\"Path\"\n          value={call.path}\n          onChange={(e) => onChange({ ...call, path: e.target.value })}\n        />\n      </div>\n      <Variables names={variables} />\n      <details className={ed.more}>\n        <div className={ed.list8}>\n          <summary>Query, headers and body</summary>\n          <span className={styles.label}>Query string</span>\n          <KeyValueEditor\n            value={call.query}\n            onChange={(query) => onChange({ ...call, query })}\n            keyLabel=\"Parameter\"\n          />\n          <span className={styles.label}>Extra headers</span>\n          <KeyValueEditor\n            value={call.headers}\n            onChange={(headers) => onChange({ ...call, headers })}\n            keyLabel=\"Header\"\n          />\n          <Textarea\n            label=\"Body (JSON)\"\n            className={ed.mono}\n            rows={6}\n            spellCheck={false}\n            value={bodyText}\n            onChange={(e) => changeBody(e.target.value)}\n          />\n          {bodyError && <p className={ed.errorText}>{bodyError}</p>}\n        </div>\n      </details>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -0,0 +1,109 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button, Input } from "@withpotter/ui-kit";
+import { SelectField, formatValue, parseValue } from "./fields";
+import styles from "../payout-providers.module.css";
+import ed from "./editor.module.css";
+const OPS = [
+  { value: "equals", label: "is" },
+  { value: "notEquals", label: "is not" },
+  { value: "in", label: "is one of" },
+  { value: "contains", label: "contains" },
+  { value: "matches", label: "matches pattern" },
+  { value: "truthy", label: "is set / true" },
+  { value: "falsy", label: "is empty / false" },
+  { value: "exists", label: "exists" },
+  { value: "notExists", label: "does not exist" }
+];
+const NEEDS_VALUE = [
+  "equals",
+  "notEquals",
+  "in",
+  "contains",
+  "matches"
+];
+const blankCondition = () => ({
+  path: "",
+  op: "equals",
+  value: ""
+});
+function ConditionsEditor({
+  value,
+  onChange,
+  withMessage,
+  addLabel = "Add condition"
+}) {
+  const set = (index, patch) => onChange(
+    value.map(
+      (condition, i) => i === index ? { ...condition, ...patch } : condition
+    )
+  );
+  return /* @__PURE__ */ jsxs("div", { className: ed.list8, children: [
+    value.map((condition, index) => /* @__PURE__ */ jsxs("div", { className: ed.row, children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          "aria-label": "Path in the answer",
+          placeholder: "data.status",
+          value: condition.path,
+          onChange: (e) => set(index, { path: e.target.value })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        SelectField,
+        {
+          label: "Test",
+          value: condition.op,
+          options: OPS,
+          onChange: (op) => set(index, {
+            op,
+            ...NEEDS_VALUE.includes(op) ? {} : { value: void 0 }
+          })
+        }
+      ),
+      NEEDS_VALUE.includes(condition.op) && /* @__PURE__ */ jsx(
+        Input,
+        {
+          "aria-label": "Value",
+          placeholder: condition.op === "in" ? "success, completed" : "value",
+          value: formatValue(condition.value),
+          onChange: (e) => set(index, {
+            value: condition.op === "in" ? e.target.value.split(",").map((item) => item.trim()).filter(Boolean).map(parseValue) : condition.op === "contains" || condition.op === "matches" ? e.target.value : parseValue(e.target.value)
+          })
+        }
+      ),
+      withMessage && /* @__PURE__ */ jsx(
+        Input,
+        {
+          "aria-label": "Message when this fails",
+          placeholder: "Message when this fails",
+          value: condition.message ?? "",
+          onChange: (e) => set(index, { message: e.target.value || void 0 })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: `${styles.link} ${styles.remove}`,
+          onClick: () => onChange(value.filter((_c, i) => i !== index)),
+          children: "Remove"
+        }
+      )
+    ] }, index)),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "secondary",
+        size: "sm",
+        onClick: () => onChange([...value, blankCondition()]),
+        children: addLabel
+      }
+    )
+  ] });
+}
+export {
+  ConditionsEditor,
+  blankCondition
+};
+//# sourceMappingURL=condition-editor.js.map

package/dist/admin/payout-providers/editor/condition-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/admin/payout-providers/editor/condition-editor.tsx"],"sourcesContent":["'use client';\n\nimport { Button, Input } from '@withpotter/ui-kit';\nimport type {\n  PayoutCondition,\n  PayoutConditionOp,\n} from '@withpotter/platform-admin';\nimport { SelectField, formatValue, parseValue } from './fields';\nimport styles from '../payout-providers.module.css';\nimport ed from './editor.module.css';\n\nconst OPS: Array<{ value: PayoutConditionOp; label: string }> = [\n  { value: 'equals', label: 'is' },\n  { value: 'notEquals', label: 'is not' },\n  { value: 'in', label: 'is one of' },\n  { value: 'contains', label: 'contains' },\n  { value: 'matches', label: 'matches pattern' },\n  { value: 'truthy', label: 'is set / true' },\n  { value: 'falsy', label: 'is empty / false' },\n  { value: 'exists', label: 'exists' },\n  { value: 'notExists', label: 'does not exist' },\n];\n\nconst NEEDS_VALUE: PayoutConditionOp[] = [\n  'equals',\n  'notEquals',\n  'in',\n  'contains',\n  'matches',\n];\n\nexport const blankCondition = (): PayoutCondition => ({\n  path: '',\n  op: 'equals',\n  value: '',\n});\n\n/** Rows of \"<path> <is / is one of / …> <value>\". Paths are dotted (`data.status`); `a|b` tries each. `$status` is the HTTP status. */\nexport function ConditionsEditor({\n  value,\n  onChange,\n  withMessage,\n  addLabel = 'Add condition',\n}: {\n  value: PayoutCondition[];\n  onChange: (next: PayoutCondition[]) => void;\n  /** Also ask for the message shown when the condition does not hold. */\n  withMessage?: boolean;\n  addLabel?: string;\n}) {\n  const set = (index: number, patch: Partial<PayoutCondition>) =>\n    onChange(\n      value.map((condition, i) =>\n        i === index ? { ...condition, ...patch } : condition,\n      ),\n    );\n\n  return (\n    <div className={ed.list8}>\n      {value.map((condition, index) => (\n        <div className={ed.row} key={index}>\n          <Input\n            aria-label=\"Path in the answer\"\n            placeholder=\"data.status\"\n            value={condition.path}\n            onChange={(e) => set(index, { path: e.target.value })}\n          />\n          <SelectField\n            label=\"Test\"\n            value={condition.op}\n            options={OPS}\n            onChange={(op) =>\n              set(index, {\n                op,\n                ...(NEEDS_VALUE.includes(op) ? {} : { value: undefined }),\n              })\n            }\n          />\n          {NEEDS_VALUE.includes(condition.op) && (\n            <Input\n              aria-label=\"Value\"\n              placeholder={\n                condition.op === 'in' ? 'success, completed' : 'value'\n              }\n              value={formatValue(condition.value)}\n              onChange={(e) =>\n                set(index, {\n                  value:\n                    condition.op === 'in'\n                      ? e.target.value\n                          .split(',')\n                          .map((item) => item.trim())\n                          .filter(Boolean)\n                          .map(parseValue)\n                      : condition.op === 'contains' ||\n                        condition.op === 'matches'\n                      ? e.target.value\n                      : parseValue(e.target.value),\n                })\n              }\n            />\n          )}\n          {withMessage && (\n            <Input\n              aria-label=\"Message when this fails\"\n              placeholder=\"Message when this fails\"\n              value={condition.message ?? ''}\n              onChange={(e) =>\n                set(index, { message: e.target.value || undefined })\n              }\n            />\n          )}\n          <button\n            type=\"button\"\n            className={`${styles.link} ${styles.remove}`}\n            onClick={() => onChange(value.filter((_c, i) => i !== index))}\n          >\n            Remove\n          </button>\n        </div>\n      ))}\n      <Button\n        variant=\"secondary\"\n        size=\"sm\"\n        onClick={() => onChange([...value, blankCondition()])}\n      >\n        {addLabel}\n      </Button>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -0,0 +1,123 @@
+/* The flow editor: sections, groups, call rows and value chips. */
+
+/* ---- Flow editor ---- */
+.section {
+  padding: 12px 16px;
+  border: 1px solid var(--border-subtle);
+  border-radius: var(--adm-card-radius);
+}
+
+.sectionBody {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-top: 12px;
+}
+
+.group {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  min-width: 0;
+  margin: 0;
+  padding: 12px;
+  border: 1px solid var(--border-subtle);
+  border-radius: 8px;
+}
+
+.group > legend {
+  padding: 0 4px;
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--text-primary);
+}
+
+.call {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-end;
+  gap: 8px;
+  width: 100%;
+}
+
+.row > * {
+  flex: 1 1 140px;
+  min-width: 0;
+}
+
+.row > button {
+  flex: 0 0 auto;
+}
+
+.more > summary {
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--text-secondary);
+  cursor: pointer;
+}
+
+.more[open] > summary {
+  margin-bottom: 10px;
+}
+
+.list8 {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 8px;
+}
+
+.chip {
+  margin-right: 4px;
+  padding: 1px 6px;
+  border-radius: 4px;
+  background: var(--adm-hover);
+  font-size: 12px;
+  color: var(--text-secondary);
+}
+
+.mono {
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 12px;
+}
+
+.errorText {
+  margin: 0;
+  font-size: 12px;
+  color: var(--error);
+}
+
+.toggle {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  font-size: 13px;
+  color: var(--text-primary);
+}
+
+.stepCard {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  padding: 12px;
+  border: 1px solid var(--border-default);
+  border-radius: 8px;
+}
+
+.stepCardHead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 13px;
+}
+
+.errors {
+  margin: 4px 0 0;
+  padding-left: 18px;
+}

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

@@ -0,0 +1,144 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Button, Input, Select, Toggle as Switch } from "@withpotter/ui-kit";
+import styles from "../payout-providers.module.css";
+import ed from "./editor.module.css";
+function parseValue(text) {
+  const value = text.trim();
+  if (value === "true") return true;
+  if (value === "false") return false;
+  if (value !== "" && /^-?\d+(\.\d+)?$/.test(value)) return Number(value);
+  return value;
+}
+const formatValue = (value) => Array.isArray(value) ? value.join(", ") : value === void 0 || value === null ? "" : String(value);
+function Variables({ names }) {
+  if (names.length === 0) return null;
+  return /* @__PURE__ */ jsxs("p", { className: styles.help, children: [
+    "Values you can use:",
+    " ",
+    names.map((name) => /* @__PURE__ */ jsx("code", { className: ed.chip, children: `{{${name}}}` }, name))
+  ] });
+}
+function KeyValueEditor({
+  value,
+  onChange,
+  keyLabel = "Name",
+  valueLabel = "Value"
+}) {
+  const entries = Object.entries(value ?? {});
+  const [draftKey, setDraftKey] = useState("");
+  const commit = (next) => onChange(next.length ? Object.fromEntries(next) : void 0);
+  return /* @__PURE__ */ jsxs("div", { className: ed.list8, children: [
+    entries.map(([name, text], index) => /* @__PURE__ */ jsxs("div", { className: ed.row, children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          "aria-label": keyLabel,
+          value: name,
+          onChange: (e) => commit(
+            entries.map(
+              (entry, i) => i === index ? [e.target.value, entry[1]] : entry
+            )
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          "aria-label": valueLabel,
+          value: String(text),
+          onChange: (e) => commit(
+            entries.map(
+              (entry, i) => i === index ? [entry[0], e.target.value] : entry
+            )
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: `${styles.link} ${styles.remove}`,
+          onClick: () => commit(entries.filter((_entry, i) => i !== index)),
+          children: "Remove"
+        }
+      )
+    ] }, name)),
+    /* @__PURE__ */ jsxs("div", { className: ed.row, children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          "aria-label": `New ${keyLabel.toLowerCase()}`,
+          placeholder: `New ${keyLabel.toLowerCase()}`,
+          value: draftKey,
+          onChange: (e) => setDraftKey(e.target.value)
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "secondary",
+          size: "sm",
+          disabled: !draftKey.trim() || draftKey.trim() in (value ?? {}),
+          onClick: () => {
+            commit([...entries, [draftKey.trim(), ""]]);
+            setDraftKey("");
+          },
+          children: "Add"
+        }
+      )
+    ] })
+  ] });
+}
+function Group({
+  title,
+  hint,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("fieldset", { className: ed.group, children: [
+    /* @__PURE__ */ jsx("legend", { children: title }),
+    hint && /* @__PURE__ */ jsx("p", { className: styles.help, children: hint }),
+    children
+  ] });
+}
+function Toggle({
+  checked,
+  onChange,
+  label
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: ed.toggle, children: [
+    /* @__PURE__ */ jsx(Switch, { checked, onChange, label }),
+    /* @__PURE__ */ jsx("span", { children: label })
+  ] });
+}
+function SelectField({
+  label,
+  value,
+  options,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("span", { className: styles.label, children: label }),
+    /* @__PURE__ */ jsx(
+      Select,
+      {
+        size: "sm",
+        ariaLabel: label,
+        value,
+        options,
+        onChange: (next) => onChange(next)
+      }
+    )
+  ] });
+}
+export {
+  Group,
+  KeyValueEditor,
+  SelectField,
+  Toggle,
+  Variables,
+  formatValue,
+  parseValue
+};
+//# sourceMappingURL=fields.js.map

package/dist/admin/payout-providers/editor/fields.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/admin/payout-providers/editor/fields.tsx"],"sourcesContent":["'use client';\n\nimport { useState, type ReactNode } from 'react';\nimport { Button, Input, Select, Toggle as Switch } from '@withpotter/ui-kit';\nimport styles from '../payout-providers.module.css';\nimport ed from './editor.module.css';\n\n/** A text that is a number or a boolean is stored as one: the provider compares real values, not strings. */\nexport function parseValue(text: string): unknown {\n  const value = text.trim();\n  if (value === 'true') return true;\n  if (value === 'false') return false;\n  if (value !== '' && /^-?\\d+(\\.\\d+)?$/.test(value)) return Number(value);\n  return value;\n}\n\nexport const formatValue = (value: unknown): string =>\n  Array.isArray(value)\n    ? value.join(', ')\n    : value === undefined || value === null\n    ? ''\n    : String(value);\n\nexport function Variables({ names }: { names: string[] }) {\n  if (names.length === 0) return null;\n  return (\n    <p className={styles.help}>\n      Values you can use:{' '}\n      {names.map((name) => (\n        <code key={name} className={ed.chip}>{`{{${name}}}`}</code>\n      ))}\n    </p>\n  );\n}\n\n/** Name and value rows, for query strings and headers. */\nexport function KeyValueEditor({\n  value,\n  onChange,\n  keyLabel = 'Name',\n  valueLabel = 'Value',\n}: {\n  value: Record<string, string> | undefined;\n  onChange: (next: Record<string, string> | undefined) => void;\n  keyLabel?: string;\n  valueLabel?: string;\n}) {\n  const entries = Object.entries(value ?? {});\n  const [draftKey, setDraftKey] = useState('');\n  const commit = (next: Array<[string, string]>) =>\n    onChange(next.length ? Object.fromEntries(next) : undefined);\n\n  return (\n    <div className={ed.list8}>\n      {entries.map(([name, text], index) => (\n        <div className={ed.row} key={name}>\n          <Input\n            aria-label={keyLabel}\n            value={name}\n            onChange={(e) =>\n              commit(\n                entries.map((entry, i) =>\n                  i === index ? [e.target.value, entry[1]] : entry,\n                ),\n              )\n            }\n          />\n          <Input\n            aria-label={valueLabel}\n            value={String(text)}\n            onChange={(e) =>\n              commit(\n                entries.map((entry, i) =>\n                  i === index ? [entry[0], e.target.value] : entry,\n                ),\n              )\n            }\n          />\n          <button\n            type=\"button\"\n            className={`${styles.link} ${styles.remove}`}\n            onClick={() => commit(entries.filter((_entry, i) => i !== index))}\n          >\n            Remove\n          </button>\n        </div>\n      ))}\n      <div className={ed.row}>\n        <Input\n          aria-label={`New ${keyLabel.toLowerCase()}`}\n          placeholder={`New ${keyLabel.toLowerCase()}`}\n          value={draftKey}\n          onChange={(e) => setDraftKey(e.target.value)}\n        />\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          disabled={!draftKey.trim() || draftKey.trim() in (value ?? {})}\n          onClick={() => {\n            commit([...entries, [draftKey.trim(), '']]);\n            setDraftKey('');\n          }}\n        >\n          Add\n        </Button>\n      </div>\n    </div>\n  );\n}\n\nexport function Group({\n  title,\n  hint,\n  children,\n}: {\n  title: string;\n  hint?: ReactNode;\n  children: ReactNode;\n}) {\n  return (\n    <fieldset className={ed.group}>\n      <legend>{title}</legend>\n      {hint && <p className={styles.help}>{hint}</p>}\n      {children}\n    </fieldset>\n  );\n}\n\nexport function Toggle({\n  checked,\n  onChange,\n  label,\n}: {\n  checked: boolean;\n  onChange: (next: boolean) => void;\n  label: string;\n}) {\n  return (\n    <div className={ed.toggle}>\n      <Switch checked={checked} onChange={onChange} label={label} />\n      <span>{label}</span>\n    </div>\n  );\n}\n\nexport function SelectField<T extends string>({\n  label,\n  value,\n  options,\n  onChange,\n}: {\n  label: string;\n  value: T;\n  options: Array<{ value: T; label: string }>;\n  onChange: (next: T) => void;\n}) {\n  return (\n    <div>\n      <span className={styles.label}>{label}</span>\n      <Select\n        size=\"sm\"\n        ariaLabel={label}\n        value={value}\n        options={options}\n        onChange={(next) => onChange(next as T)}\n      />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -0,0 +1,160 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import { useMutation } from "@tanstack/react-query";
+import { Banner, Button, Input } from "@withpotter/ui-kit";
+import {
+  platformAdminApi
+} from "@withpotter/platform-admin";
+import { errorText } from "../shared";
+import { AuthSection } from "./auth-section";
+import { Section } from "./flow-parts";
+import { BanksSection, CheckSection, LookupSection } from "./flow-sections";
+import { TransferSection } from "./transfer-section";
+import styles from "../payout-providers.module.css";
+import ed from "./editor.module.css";
+const TRANSFER_VARS = [
+  "reference",
+  "amountMinor",
+  "amountMajor",
+  "currency",
+  "bankCode",
+  "accountNumber",
+  "accountName",
+  "narration"
+];
+const hostOf = (value) => {
+  try {
+    return new URL(value).host;
+  } catch {
+    return value;
+  }
+};
+const clone = (value) => JSON.parse(JSON.stringify(value));
+function FlowEditor({
+  integration,
+  onChange
+}) {
+  const [label, setLabel] = useState(integration.label);
+  const [draft, setDraft] = useState(
+    () => clone(integration.definition)
+  );
+  const [errors, setErrors] = useState([]);
+  const login = draft.auth.type === "login";
+  const dirty = label !== integration.label || JSON.stringify(draft) !== JSON.stringify(integration.definition);
+  const update = (mutate) => setDraft((current) => {
+    const next = clone(current);
+    mutate(next);
+    return next;
+  });
+  useEffect(() => {
+    if (!dirty) {
+      setErrors([]);
+      return;
+    }
+    const timer = setTimeout(() => {
+      platformAdminApi.validatePayoutFlow(draft).then((result) => setErrors(result.errors)).catch(() => void 0);
+    }, 600);
+    return () => clearTimeout(timer);
+  }, [draft, dirty]);
+  const save = useMutation({
+    mutationFn: () => platformAdminApi.updatePayoutFlow(integration.key, {
+      label,
+      definition: draft
+    }),
+    onSuccess: (next) => {
+      setErrors([]);
+      onChange(next);
+    }
+  });
+  const baseVars = useMemo(
+    () => [...TRANSFER_VARS, ...draft.auth.pin ? ["pin"] : []],
+    [draft.auth.pin]
+  );
+  const varsAt = (stepIndex) => [
+    ...baseVars,
+    ...draft.transfer.prepare.slice(0, stepIndex).flatMap((step) => Object.keys(step.extract ?? {}))
+  ];
+  const sendVars = varsAt(draft.transfer.prepare.length);
+  return /* @__PURE__ */ jsxs("div", { className: styles.stack, children: [
+    /* @__PURE__ */ jsxs(Section, { title: "Basics", summary: hostOf(draft.apiBaseUrl), open: true, children: [
+      /* @__PURE__ */ jsxs("div", { className: styles.fields, children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: "Name",
+            value: label,
+            onChange: (e) => setLabel(e.target.value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: "API host",
+            value: draft.apiBaseUrl,
+            onChange: (e) => update((next) => next.apiBaseUrl = e.target.value)
+          }
+        ),
+        login && /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: "Auth host",
+            value: draft.authBaseUrl ?? "",
+            onChange: (e) => update((next) => next.authBaseUrl = e.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("p", { className: styles.help, children: [
+        "Auth type:",
+        " ",
+        /* @__PURE__ */ jsx("strong", { children: login ? "login (email and password)" : "API key" }),
+        ". To change it, create a new flow. Changing a host signs the account out and removes its saved credentials."
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(AuthSection, { draft, update, login }),
+    /* @__PURE__ */ jsx(CheckSection, { draft, update, login }),
+    /* @__PURE__ */ jsx(BanksSection, { draft, update, login }),
+    /* @__PURE__ */ jsx(
+      TransferSection,
+      {
+        draft,
+        update,
+        login,
+        varsAt,
+        sendVars
+      }
+    ),
+    /* @__PURE__ */ jsx(LookupSection, { draft, update, login }),
+    errors.length > 0 && /* @__PURE__ */ jsx(Banner, { tone: "error", title: "Fix these before saving", children: /* @__PURE__ */ jsx("ul", { className: ed.errors, children: errors.map((error) => /* @__PURE__ */ jsx("li", { children: error }, error)) }) }),
+    save.error && /* @__PURE__ */ jsx(Banner, { tone: "error", children: errorText(save.error) }),
+    /* @__PURE__ */ jsxs("div", { className: styles.actions, children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          loading: save.isPending,
+          disabled: !dirty || errors.length > 0,
+          onClick: () => save.mutate(),
+          children: "Save flow"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          disabled: !dirty,
+          onClick: () => {
+            setDraft(clone(integration.definition));
+            setLabel(integration.label);
+            setErrors([]);
+          },
+          children: "Discard changes"
+        }
+      ),
+      save.isSuccess && !dirty && /* @__PURE__ */ jsx("span", { className: styles.help, children: "Saved." })
+    ] })
+  ] });
+}
+export {
+  FlowEditor
+};
+//# sourceMappingURL=flow-editor.js.map

package/dist/admin/payout-providers/editor/flow-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/admin/payout-providers/editor/flow-editor.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useMemo, useState } from 'react';\nimport { useMutation } from '@tanstack/react-query';\nimport { Banner, Button, Input } from '@withpotter/ui-kit';\nimport {\n  platformAdminApi,\n  type PayoutFlowDefinition,\n  type PayoutIntegration,\n} from '@withpotter/platform-admin';\nimport { errorText } from '../shared';\nimport { AuthSection } from './auth-section';\nimport { Section } from './flow-parts';\nimport { BanksSection, CheckSection, LookupSection } from './flow-sections';\nimport { TransferSection } from './transfer-section';\nimport styles from '../payout-providers.module.css';\nimport ed from './editor.module.css';\n\nconst TRANSFER_VARS = [\n  'reference',\n  'amountMinor',\n  'amountMajor',\n  'currency',\n  'bankCode',\n  'accountNumber',\n  'accountName',\n  'narration',\n];\n\n/** The host of an address, or what has been typed so far: never throws while someone is still typing. */\nconst hostOf = (value: string): string => {\n  try {\n    return new URL(value).host;\n  } catch {\n    return value;\n  }\n};\n\nconst clone = <T,>(value: T): T => JSON.parse(JSON.stringify(value)) as T;\n\n/**\n * Edits a flow: how to authenticate, which calls to make and how to read the\n * answers. The server re-checks everything before saving, and the rules that\n * keep money safe are fixed in code, so a mistake here cannot make a transfer\n * count as sent when it was not.\n */\nexport function FlowEditor({\n  integration,\n  onChange,\n}: {\n  integration: PayoutIntegration;\n  onChange: (next: PayoutIntegration) => void;\n}) {\n  const [label, setLabel] = useState(integration.label);\n  const [draft, setDraft] = useState<PayoutFlowDefinition>(() =>\n    clone(integration.definition),\n  );\n  const [errors, setErrors] = useState<string[]>([]);\n  const login = draft.auth.type === 'login';\n  const dirty =\n    label !== integration.label ||\n    JSON.stringify(draft) !== JSON.stringify(integration.definition);\n\n  const update = (mutate: (next: PayoutFlowDefinition) => void) =>\n    setDraft((current) => {\n      const next = clone(current);\n      mutate(next);\n      return next;\n    });\n\n  // Ask the server what is wrong, as the admin edits, so the problems are listed before saving.\n  useEffect(() => {\n    if (!dirty) {\n      setErrors([]);\n      return;\n    }\n    const timer = setTimeout(() => {\n      platformAdminApi\n        .validatePayoutFlow(draft)\n        .then((result) => setErrors(result.errors))\n        .catch(() => undefined);\n    }, 600);\n    return () => clearTimeout(timer);\n  }, [draft, dirty]);\n\n  const save = useMutation({\n    mutationFn: () =>\n      platformAdminApi.updatePayoutFlow(integration.key, {\n        label,\n        definition: draft,\n      }),\n    onSuccess: (next) => {\n      setErrors([]);\n      onChange(next);\n    },\n  });\n\n  const baseVars = useMemo(\n    () => [...TRANSFER_VARS, ...(draft.auth.pin ? ['pin'] : [])],\n    [draft.auth.pin],\n  );\n  const varsAt = (stepIndex: number) => [\n    ...baseVars,\n    ...draft.transfer.prepare\n      .slice(0, stepIndex)\n      .flatMap((step) => Object.keys(step.extract ?? {})),\n  ];\n  const sendVars = varsAt(draft.transfer.prepare.length);\n\n  return (\n    <div className={styles.stack}>\n      <Section title=\"Basics\" summary={hostOf(draft.apiBaseUrl)} open>\n        <div className={styles.fields}>\n          <Input\n            label=\"Name\"\n            value={label}\n            onChange={(e) => setLabel(e.target.value)}\n          />\n          <Input\n            label=\"API host\"\n            value={draft.apiBaseUrl}\n            onChange={(e) =>\n              update((next) => (next.apiBaseUrl = e.target.value))\n            }\n          />\n          {login && (\n            <Input\n              label=\"Auth host\"\n              value={draft.authBaseUrl ?? ''}\n              onChange={(e) =>\n                update((next) => (next.authBaseUrl = e.target.value))\n              }\n            />\n          )}\n        </div>\n        <p className={styles.help}>\n          Auth type:{' '}\n          <strong>{login ? 'login (email and password)' : 'API key'}</strong>.\n          To change it, create a new flow. Changing a host signs the account out\n          and removes its saved credentials.\n        </p>\n      </Section>\n\n      <AuthSection draft={draft} update={update} login={login} />\n\n      <CheckSection draft={draft} update={update} login={login} />\n\n      <BanksSection draft={draft} update={update} login={login} />\n      <TransferSection\n        draft={draft}\n        update={update}\n        login={login}\n        varsAt={varsAt}\n        sendVars={sendVars}\n      />\n      <LookupSection draft={draft} update={update} login={login} />\n\n      {errors.length > 0 && (\n        <Banner tone=\"error\" title=\"Fix these before saving\">\n          <ul className={ed.errors}>\n            {errors.map((error) => (\n              <li key={error}>{error}</li>\n            ))}\n          </ul>\n        </Banner>\n      )}\n      {save.error && <Banner tone=\"error\">{errorText(save.error)}</Banner>}\n      <div className={styles.actions}>\n        <Button\n          loading={save.isPending}\n          disabled={!dirty || errors.length > 0}\n          onClick={() => save.mutate()}\n        >\n          Save flow\n        </Button>\n        <Button\n          variant=\"ghost\"\n          disabled={!dirty}\n          onClick={() => {\n            setDraft(clone(integration.definition));\n            setLabel(integration.label);\n            setErrors([]);\n          }}\n        >\n          Discard changes\n        </Button>\n        {save.isSuccess && !dirty && (\n          <span className={styles.help}>Saved.</span>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/payout-providers/editor/flow-parts.js

@@ -0,0 +1,69 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Input } from "@withpotter/ui-kit";
+import { SelectField } from "./fields";
+import styles from "../payout-providers.module.css";
+import ed from "./editor.module.css";
+const newCall = (path, method = "GET") => ({ method, host: "api", path });
+function Section({
+  title,
+  summary,
+  children,
+  open
+}) {
+  return /* @__PURE__ */ jsxs("details", { className: `${styles.disclosure} ${ed.section}`, open, children: [
+    /* @__PURE__ */ jsxs("summary", { children: [
+      title,
+      summary && /* @__PURE__ */ jsx("span", { className: styles.summaryHint, children: summary })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: ed.sectionBody, children })
+  ] });
+}
+function SourceEditor({
+  label,
+  value,
+  onChange
+}) {
+  const kind = value?.from ?? "none";
+  return /* @__PURE__ */ jsxs("div", { className: ed.row, children: [
+    /* @__PURE__ */ jsx(
+      SelectField,
+      {
+        label,
+        value: kind,
+        options: [
+          { value: "none", label: "Not used" },
+          { value: "body", label: "In the answer body" },
+          { value: "cookie", label: "In a cookie" }
+        ],
+        onChange: (next) => onChange(
+          next === "none" ? void 0 : next === "body" ? { from: "body", path: "" } : { from: "cookie", name: "" }
+        )
+      }
+    ),
+    value?.from === "body" && /* @__PURE__ */ jsx(
+      Input,
+      {
+        label: "Path",
+        placeholder: "data.token",
+        value: value.path,
+        onChange: (e) => onChange({ from: "body", path: e.target.value })
+      }
+    ),
+    value?.from === "cookie" && /* @__PURE__ */ jsx(
+      Input,
+      {
+        label: "Cookie name",
+        placeholder: "access_token",
+        value: value.name,
+        onChange: (e) => onChange({ from: "cookie", name: e.target.value })
+      }
+    )
+  ] });
+}
+export {
+  Section,
+  SourceEditor,
+  newCall
+};
+//# sourceMappingURL=flow-parts.js.map