@fonderie/react-admin-screens 1.4.0 → 1.5.0

package/dist/index.cjs

@@ -1589,7 +1589,9 @@ var import_react_admin10 = require("@fonderie/react-admin");
 var import_react5 = require("react");
 var import_jsx_runtime11 = require("react/jsx-runtime");
 function SubscriberBilling({ client, subscriber }) {
-  const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_react_admin10.useAdminSubscriber)(client, subscriber, { limit: 20 });
+  const [currency, setCurrency] = (0, import_react5.useState)("");
+  const [currencyDraft, setCurrencyDraft] = (0, import_react5.useState)("");
+  const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_react_admin10.useAdminSubscriber)(client, subscriber, { limit: 20, ...currency ? { currency } : {} });
   const [amount, setAmount] = (0, import_react5.useState)("");
   const [note, setNote] = (0, import_react5.useState)("");
   const [granted, setGranted] = (0, import_react5.useState)(null);
@@ -1630,7 +1632,42 @@ function SubscriberBilling({ client, subscriber }) {
         subscription?.providerSubscriptionId ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { style: { ...styles.statHint, fontFamily: "var(--fonderie-mono,monospace)" }, children: subscription.providerSubscriptionId }) : null
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: styles.card, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { style: styles.statLabel, children: "Credits" }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              gap: 8
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { style: styles.statLabel, children: "Credits" }),
+              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                "form",
+                {
+                  style: { display: "flex", gap: 4 },
+                  onSubmit: (e) => {
+                    e.preventDefault();
+                    setCurrency(currencyDraft.trim().toUpperCase());
+                  },
+                  children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                    "input",
+                    {
+                      value: currencyDraft,
+                      onChange: (e) => setCurrencyDraft(e.target.value),
+                      placeholder: wallet?.currency ?? "currency",
+                      maxLength: 8,
+                      style: { ...styles.input, height: 26, width: 84, fontSize: 12 },
+                      "aria-label": "Wallet currency",
+                      title: "Show the wallet in another currency"
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        ),
         wallet ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: styles.statValue, children: [
             wallet.balance,
@@ -2318,10 +2355,8 @@ var import_react_admin14 = require("@fonderie/react-admin");
 var import_react8 = require("react");
 var import_jsx_runtime15 = require("react/jsx-runtime");
 function AuditScreen({ client, pageSize = 50 }) {
-  const [draft, setDraft] = (0, import_react8.useState)({ workspaceId: "", type: "", actorId: "" });
-  const [filter, setFilter] = (0, import_react8.useState)(
-    {}
-  );
+  const [draft, setDraft] = (0, import_react8.useState)({ workspaceId: "", type: "", actorId: "", from: "", to: "" });
+  const [filter, setFilter] = (0, import_react8.useState)({});
   const { events, hasMore, isLoading, error, refresh, loadMore } = (0, import_react_admin14.useAdminAudit)(client, {
     ...filter,
     limit: pageSize
@@ -2353,13 +2388,38 @@ function AuditScreen({ client, pageSize = 50 }) {
           setFilter({
             ...draft.workspaceId.trim() ? { workspaceId: draft.workspaceId.trim() } : {},
             ...draft.type.trim() ? { type: draft.type.trim() } : {},
-            ...draft.actorId.trim() ? { actorId: draft.actorId.trim() } : {}
+            ...draft.actorId.trim() ? { actorId: draft.actorId.trim() } : {},
+            // Dates are whole days in the operator's time zone: "to" includes that day.
+            ...draft.from ? { from: /* @__PURE__ */ new Date(`${draft.from}T00:00:00`) } : {},
+            ...draft.to ? { to: /* @__PURE__ */ new Date(`${draft.to}T23:59:59.999`) } : {}
           });
         },
         children: [
           field("workspaceId", "workspace id (all if empty)"),
           field("type", "event type"),
           field("actorId", "actor id"),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            "input",
+            {
+              type: "date",
+              value: draft.from,
+              onChange: (e) => setDraft({ ...draft, from: e.target.value }),
+              style: styles.input,
+              "aria-label": "From date",
+              title: "From (inclusive)"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            "input",
+            {
+              type: "date",
+              value: draft.to,
+              onChange: (e) => setDraft({ ...draft, to: e.target.value }),
+              style: styles.input,
+              "aria-label": "To date",
+              title: "To (inclusive)"
+            }
+          ),
           /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("button", { type: "submit", style: styles.buttonPrimary, disabled: isLoading, children: [
             /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "search", size: 14 }),
             "Filter"
@@ -2484,7 +2544,8 @@ function AdminShell({
   envLabel,
   footer,
   operators = false,
-  currentOperator
+  currentOperator,
+  publicConfigUrl
 }) {
   const narrow = useNarrow();
   const [drawer, setDrawer] = (0, import_react9.useState)(false);
@@ -2566,7 +2627,7 @@ function AdminShell({
       ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { style: { ...styles.status, padding: "32px 40px" }, children: "Pass an AuthAdminClient to look up users here." });
       break;
     case "settings":
-      body = !configClient ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { style: { ...styles.status, padding: "32px 40px" }, children: "Pass a ConfigAdminClient to manage config and secrets here." }) : editing && editing.kind !== "template" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+      body = !configClient ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { style: { ...styles.status, padding: "32px 40px" }, children: "Pass a ConfigAdminClient to manage config and secrets here." }) : editing && (editing.kind === "config" || editing.kind === "secret") ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { padding: "24px 40px 0" }, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("button", { type: "button", style: styles.buttonGhost, onClick: () => setEditing(null), children: [
           /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Icon, { name: "back", size: 14 }),
           "Config & secrets"
@@ -2577,24 +2638,52 @@ function AdminShell({
             client: configClient,
             kind: editing.kind,
             configKey: editing.key,
-            ...environment !== void 0 ? { environment } : {},
-            onSaved: () => setEditing(null)
-          }
+            ...editing.environment !== void 0 ? { environment: editing.environment } : environment !== void 0 ? { environment } : {},
+            ...editing.environments ? { environments: editing.environments } : {},
+            onSaved: () => setEditing(null),
+            onDeleted: () => setEditing(null)
+          },
+          `${editing.kind}:${editing.key}:${editing.environment ?? ""}`
         )
       ] }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         import_react_config_admin_screens.ConfigListScreen,
         {
           client: configClient,
           ...environment !== void 0 ? { environment } : {},
-          onSelectConfig: (key) => setEditing({ kind: "config", key }),
-          onSelectSecret: (key) => setEditing({ kind: "secret", key }),
-          onCreateConfig: () => setEditing({ kind: "config", key: "" }),
-          onCreateSecret: () => setEditing({ kind: "secret", key: "" })
+          ...publicConfigUrl ? { publicConfigUrl } : {},
+          onSelectConfig: (key, env) => setEditing({ kind: "config", key, environment: env }),
+          onSelectSecret: (key, env) => setEditing({ kind: "secret", key, environment: env }),
+          onCreateConfig: (c) => setEditing({
+            kind: "config",
+            key: "",
+            environments: c.environments,
+            ...c.environment ? { environment: c.environment } : {}
+          }),
+          onCreateSecret: (c) => setEditing({
+            kind: "secret",
+            key: "",
+            environments: c.environments,
+            ...c.environment ? { environment: c.environment } : {}
+          })
         }
       );
       break;
     case "templates":
-      body = !courierClient ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { style: { ...styles.status, padding: "32px 40px" }, children: "Pass a CourierAdminClient to manage templates here." }) : editing?.kind === "template" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+      body = !courierClient ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { style: { ...styles.status, padding: "32px 40px" }, children: "Pass a CourierAdminClient to manage templates here." }) : editing?.kind === "template-new" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { padding: "24px 40px 0" }, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("button", { type: "button", style: styles.buttonGhost, onClick: () => setEditing(null), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Icon, { name: "back", size: 14 }),
+          "Templates"
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          import_react_courier_admin_screens.TemplateCreateScreen,
+          {
+            client: courierClient,
+            ...editing.type ? { type: editing.type } : {},
+            ...editing.locales ? { locales: editing.locales } : {},
+            onCreated: (c) => setEditing({ kind: "template", type: c.type, locale: c.locale, system: false })
+          }
+        )
+      ] }) : editing?.kind === "template" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { padding: "24px 40px 0" }, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("button", { type: "button", style: styles.buttonGhost, onClick: () => setEditing(null), children: [
           /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Icon, { name: "back", size: 14 }),
           "Templates"
@@ -2604,14 +2693,25 @@ function AdminShell({
           {
             client: courierClient,
             type: editing.type,
-            onSaved: () => setEditing(null)
-          }
+            locale: editing.locale,
+            system: editing.system,
+            onSaved: () => setEditing(null),
+            onDeleted: () => setEditing(null),
+            onAddLocale: (type) => setEditing({ kind: "template-new", type })
+          },
+          `${editing.type}:${editing.locale ?? ""}`
         )
       ] }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         import_react_courier_admin_screens.TemplateListScreen,
         {
           client: courierClient,
-          onSelectTemplate: (t2) => setEditing({ kind: "template", type: t2.type })
+          onSelectTemplate: (t2) => setEditing({
+            kind: "template",
+            type: t2.type,
+            locale: t2.locale ?? null,
+            system: t2.system === true
+          }),
+          onCreateTemplate: (c) => setEditing({ kind: "template-new", locales: c.locales })
         }
       );
       break;