@fonderie/vue-admin-screens 1.4.0 → 1.5.0

package/dist/index.cjs

@@ -1755,16 +1755,22 @@ function useSubscriptionIndex(client) {
 // src/screens/SubscriberBilling.ts
 var import_vue_admin10 = require("@fonderie/vue-admin");
 var import_vue13 = require("vue");
-var SubscriberBilling = (0, import_vue13.defineComponent)({
-  name: "FonderieSubscriberBilling",
+var SubscriberBillingInner = (0, import_vue13.defineComponent)({
+  name: "FonderieSubscriberBillingInner",
   props: {
     client: { type: Object, required: true },
     subscriberType: { type: String, required: true },
-    subscriberId: { type: String, required: true }
+    subscriberId: { type: String, required: true },
+    currency: { type: String, default: "" }
   },
-  setup(props) {
+  emits: { "change-currency": (_currency) => true },
+  setup(props, { emit }) {
     const subscriber = (0, import_vue13.computed)(() => ({ type: props.subscriberType, id: props.subscriberId }));
-    const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_vue_admin10.useAdminSubscriber)(props.client, subscriber, { limit: 20 });
+    const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_vue_admin10.useAdminSubscriber)(props.client, subscriber, {
+      limit: 20,
+      ...props.currency ? { currency: props.currency } : {}
+    });
+    const currencyDraft = (0, import_vue13.ref)(props.currency);
     const amount = (0, import_vue13.ref)("");
     const note = (0, import_vue13.ref)("");
     const granted = (0, import_vue13.ref)(null);
@@ -1805,7 +1811,43 @@ var SubscriberBilling = (0, import_vue13.defineComponent)({
             ) : null
           ]),
           (0, import_vue13.h)("div", { style: styles.card }, [
-            (0, import_vue13.h)("div", { style: styles.statLabel }, "Credits"),
+            (0, import_vue13.h)(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  justifyContent: "space-between",
+                  alignItems: "center",
+                  gap: "8px"
+                }
+              },
+              [
+                (0, import_vue13.h)("div", { style: styles.statLabel }, "Credits"),
+                (0, import_vue13.h)(
+                  "form",
+                  {
+                    style: { display: "flex", gap: "4px" },
+                    onSubmit: (e) => {
+                      e.preventDefault();
+                      emit("change-currency", currencyDraft.value.trim().toUpperCase());
+                    }
+                  },
+                  [
+                    (0, import_vue13.h)("input", {
+                      value: currencyDraft.value,
+                      onInput: (e) => {
+                        currencyDraft.value = e.target.value;
+                      },
+                      placeholder: w?.currency ?? "currency",
+                      maxlength: 8,
+                      style: { ...styles.input, height: "26px", width: "84px", fontSize: "12px" },
+                      "aria-label": "Wallet currency",
+                      title: "Show the wallet in another currency"
+                    })
+                  ]
+                )
+              ]
+            ),
             ...w ? [
               (0, import_vue13.h)("div", { style: styles.statValue }, [
                 `${w.balance} `,
@@ -1902,6 +1944,27 @@ var SubscriberBilling = (0, import_vue13.defineComponent)({
     };
   }
 });
+var SubscriberBilling = (0, import_vue13.defineComponent)({
+  name: "FonderieSubscriberBilling",
+  props: {
+    client: { type: Object, required: true },
+    subscriberType: { type: String, required: true },
+    subscriberId: { type: String, required: true }
+  },
+  setup(props) {
+    const currency = (0, import_vue13.ref)("");
+    return () => (0, import_vue13.h)(SubscriberBillingInner, {
+      key: `${props.subscriberType}:${props.subscriberId}:${currency.value}`,
+      client: props.client,
+      subscriberType: props.subscriberType,
+      subscriberId: props.subscriberId,
+      currency: currency.value,
+      "onChange-currency": (c) => {
+        currency.value = c;
+      }
+    });
+  }
+});
 
 // src/screens/UsersScreen.ts
 var UsersScreen = (0, import_vue14.defineComponent)({
@@ -2431,7 +2494,7 @@ var AuditScreen = (0, import_vue17.defineComponent)({
     pageSize: { type: Number, default: 50 }
   },
   setup(props) {
-    const draft = (0, import_vue17.ref)({ workspaceId: "", type: "", actorId: "" });
+    const draft = (0, import_vue17.ref)({ workspaceId: "", type: "", actorId: "", from: "", to: "" });
     const query = (0, import_vue17.ref)({ limit: props.pageSize });
     const { events, hasMore, isLoading, error, refresh, loadMore } = (0, import_vue_admin14.useAdminAudit)(
       props.client,
@@ -2460,7 +2523,10 @@ var AuditScreen = (0, import_vue17.defineComponent)({
               limit: props.pageSize,
               ...d.workspaceId.trim() ? { workspaceId: d.workspaceId.trim() } : {},
               ...d.type.trim() ? { type: d.type.trim() } : {},
-              ...d.actorId.trim() ? { actorId: d.actorId.trim() } : {}
+              ...d.actorId.trim() ? { actorId: d.actorId.trim() } : {},
+              // Dates are whole days in the operator's time zone: "to" includes that day.
+              ...d.from ? { from: /* @__PURE__ */ new Date(`${d.from}T00:00:00`) } : {},
+              ...d.to ? { to: /* @__PURE__ */ new Date(`${d.to}T23:59:59.999`) } : {}
             };
           }
         },
@@ -2468,6 +2534,16 @@ var AuditScreen = (0, import_vue17.defineComponent)({
           field("workspaceId", "workspace id (all if empty)"),
           field("type", "event type"),
           field("actorId", "actor id"),
+          ...["from", "to"].map(
+            (k) => (0, import_vue17.h)("input", {
+              type: "date",
+              value: draft.value[k],
+              onInput: (e) => draft.value = { ...draft.value, [k]: e.target.value },
+              style: styles.input,
+              "aria-label": k === "from" ? "From date" : "To date",
+              title: k === "from" ? "From (inclusive)" : "To (inclusive)"
+            })
+          ),
           (0, import_vue17.h)(
             "button",
             { type: "submit", style: styles.buttonPrimary, disabled: isLoading.value },
@@ -2573,7 +2649,10 @@ var AdminShell = (0, import_vue18.defineComponent)({
     // shows the Operators page.
     operators: { type: Boolean, default: false },
     // The signed-in operator's email, when a person (not a token) is signed in.
-    currentOperator: { type: String, default: void 0 }
+    currentOperator: { type: String, default: void 0 },
+    // Where the app serves GET /config/public — marks public keys on the
+    // Config page and previews exactly what frontends receive.
+    publicConfigUrl: { type: String, default: void 0 }
   },
   // `footer` slot: pinned to the bottom of the sidebar — session controls
   // (theme, sign out). The React shell takes the same thing as a `footer` prop.
@@ -2652,43 +2731,83 @@ var AdminShell = (0, import_vue18.defineComponent)({
           const cc = props.configClient;
           if (!cc) return missing("Pass a ConfigAdminClient to manage config and secrets here.");
           const e = editing.value;
-          if (e && e.kind !== "template")
+          if (e && (e.kind === "config" || e.kind === "secret")) {
+            const env = e.environment ?? props.environment;
             return [
               back("Config & secrets"),
               (0, import_vue18.h)(import_vue_config_admin_screens.ConfigEditorScreen, {
+                key: `${e.kind}:${e.key}:${e.environment ?? ""}`,
                 client: cc,
                 kind: e.kind,
                 configKey: e.key,
-                ...props.environment !== void 0 ? { environment: props.environment } : {},
-                onSaved: () => editing.value = null
+                ...env !== void 0 ? { environment: env } : {},
+                ...e.environments ? { environments: e.environments } : {},
+                onSaved: () => editing.value = null,
+                onDeleted: () => editing.value = null
               })
             ];
+          }
+          const create = (kind) => (c2) => editing.value = {
+            kind,
+            key: "",
+            environments: c2.environments,
+            ...c2.environment ? { environment: c2.environment } : {}
+          };
           return (0, import_vue18.h)(import_vue_config_admin_screens.ConfigListScreen, {
             client: cc,
             ...props.environment !== void 0 ? { environment: props.environment } : {},
-            "onSelect-config": (key) => editing.value = { kind: "config", key },
-            "onSelect-secret": (key) => editing.value = { kind: "secret", key },
+            ...props.publicConfigUrl ? { publicConfigUrl: props.publicConfigUrl } : {},
+            "onSelect-config": (key, environment) => editing.value = { kind: "config", key, environment },
+            "onSelect-secret": (key, environment) => editing.value = { kind: "secret", key, environment },
             allowCreate: true,
-            "onCreate-config": () => editing.value = { kind: "config", key: "" },
-            "onCreate-secret": () => editing.value = { kind: "secret", key: "" }
+            "onCreate-config": create("config"),
+            "onCreate-secret": create("secret")
           });
         }
         case "templates": {
           const kc = props.courierClient;
           if (!kc) return missing("Pass a CourierAdminClient to manage templates here.");
           const e = editing.value;
+          if (e?.kind === "template-new")
+            return [
+              back("Templates"),
+              (0, import_vue18.h)(import_vue_courier_admin_screens.TemplateCreateScreen, {
+                client: kc,
+                ...e.type ? { type: e.type } : {},
+                ...e.locales ? { locales: e.locales } : {},
+                onCreated: (c2) => editing.value = {
+                  kind: "template",
+                  type: c2.type,
+                  locale: c2.locale,
+                  system: false
+                }
+              })
+            ];
           if (e?.kind === "template")
             return [
               back("Templates"),
               (0, import_vue18.h)(import_vue_courier_admin_screens.TemplateEditorScreen, {
+                key: `${e.type}:${e.locale ?? ""}`,
                 client: kc,
                 type: e.type,
-                onSaved: () => editing.value = null
+                locale: e.locale,
+                system: e.system,
+                allowAddLocale: true,
+                onSaved: () => editing.value = null,
+                onDeleted: () => editing.value = null,
+                "onAdd-locale": (type) => editing.value = { kind: "template-new", type }
               })
             ];
           return (0, import_vue18.h)(import_vue_courier_admin_screens.TemplateListScreen, {
             client: kc,
-            "onSelect-template": (t2) => editing.value = { kind: "template", type: t2.type }
+            allowCreate: true,
+            "onSelect-template": (t2) => editing.value = {
+              kind: "template",
+              type: t2.type,
+              locale: t2.locale ?? null,
+              system: t2.system === true
+            },
+            "onCreate-template": (c2) => editing.value = { kind: "template-new", locales: c2.locales }
           });
         }
       }