@lunora/studio 1.0.0-alpha.4 → 1.0.0-alpha.41

package/dist/packem_chunks/payments-panel.js

@@ -0,0 +1,186 @@
+import { E as ErrorAlert } from '../packem_shared/error-alert-CXjqyGw9.js';
+import { B as Badge } from '../packem_shared/badge-B2PKA1-5.js';
+import { C as Card, a as CardContent } from '../packem_shared/card-DURq3ElK.js';
+import { E as EmptyState } from '../packem_shared/empty-state-DY_oe0k6.js';
+import { T as Table, a as TableHeader, b as TableRow, c as TableHead, d as TableBody, e as TableCell } from '../packem_shared/table-DsCa9Qp9.js';
+import { u as useAdminQuery } from '../packem_shared/use-admin-query-CfHYWx5n.js';
+import { useAutoRefresh } from '../packem_shared/DEFAULT_AUTO_REFRESH_MS-Vxwaxx51.js';
+import { useT } from '../packem_shared/DEFAULT_LOCALE-CiX4W7Kr.js';
+import { ADMIN_FUNCTIONS } from '../packem_shared/ADMIN_FUNCTIONS-BHHJi3Gb.js';
+import { i as formatTimestamp } from '../packem_shared/internal-CYcbqMjX.js';
+import { jsxDEV } from 'react/jsx-dev-runtime';
+
+const ACTIVE_STATES = /* @__PURE__ */ new Set(["active", "trialing"]);
+const ALERT_STATES = /* @__PURE__ */ new Set(["past_due", "unpaid"]);
+const readField = (row, key) => {
+  if (row[key] !== void 0) {
+    return row[key];
+  }
+  const raw = row["__doc__"];
+  if (typeof raw === "string") {
+    try {
+      const parsed = JSON.parse(raw);
+      if (parsed !== null && typeof parsed === "object" && !Array.isArray(parsed)) {
+        return parsed[key];
+      }
+    } catch {
+    }
+  }
+  return void 0;
+};
+const text = (value) => {
+  if (typeof value === "string") {
+    return value;
+  }
+  return typeof value === "number" || typeof value === "bigint" || typeof value === "boolean" ? String(value) : "";
+};
+const badgeVariant = (state) => {
+  if (ACTIVE_STATES.has(state)) {
+    return "default";
+  }
+  return ALERT_STATES.has(state) ? "destructive" : "outline";
+};
+const PaymentsPanel = ({
+  limit = 100
+}) => {
+  const t = useT();
+  const subscriptionsQuery = useAdminQuery(ADMIN_FUNCTIONS.readTablePage, {
+    filters: [],
+    limit,
+    offset: 0,
+    orderBy: [],
+    search: "",
+    table: "subscriptions"
+  });
+  const eventsQuery = useAdminQuery(ADMIN_FUNCTIONS.readTablePage, {
+    filters: [],
+    limit: 25,
+    offset: 0,
+    orderBy: [],
+    search: "",
+    table: "events"
+  });
+  useAutoRefresh(() => {
+    subscriptionsQuery.refetch();
+    eventsQuery.refetch();
+  }, true);
+  const subscriptions = subscriptionsQuery.data?.rows ?? [];
+  const events = eventsQuery.data?.rows ?? [];
+  const error = subscriptionsQuery.error ?? eventsQuery.error;
+  const errorSource = subscriptionsQuery.error === null ? eventsQuery.errorSource : subscriptionsQuery.errorSource;
+  const activeCount = subscriptions.filter((row) => ACTIVE_STATES.has(text(readField(row, "state")))).length;
+  const recentEvents = events.toSorted((a, b) => Number(readField(b, "processedAt") ?? 0) - Number(readField(a, "processedAt") ?? 0));
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: "flex flex-col gap-4",
+    "data-testid": "payments-panel",
+    children: [/* @__PURE__ */ jsxDEV("div", {
+      className: "flex items-center gap-2",
+      "data-testid": "payments-summary",
+      children: /* @__PURE__ */ jsxDEV(Card, {
+        className: "justify-between gap-0 py-0",
+        children: [/* @__PURE__ */ jsxDEV("div", {
+          className: "flex flex-col gap-2.5 p-4",
+          children: [/* @__PURE__ */ jsxDEV("span", {
+            className: "font-mono text-[11px] tracking-wide text-muted-foreground uppercase",
+            children: t("Subscriptions")
+          }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+            className: "flex items-center gap-2",
+            children: [/* @__PURE__ */ jsxDEV("span", {
+              className: "text-2xl font-semibold tabular-nums text-foreground",
+              children: activeCount
+            }, void 0, false), /* @__PURE__ */ jsxDEV(Badge, {
+              variant: "default",
+              children: t("{count} active", {
+                count: activeCount
+              })
+            }, void 0, false)]
+          }, void 0, true)]
+        }, void 0, true), /* @__PURE__ */ jsxDEV("div", {
+          className: "border-t border-border bg-muted/50 px-4 py-2.5 text-[11px] text-muted-foreground",
+          children: t("{total} total", {
+            total: subscriptions.length
+          })
+        }, void 0, false)]
+      }, void 0, true)
+    }, void 0, false), error === null ? void 0 : /* @__PURE__ */ jsxDEV(ErrorAlert, {
+      error: errorSource
+    }, void 0, false), subscriptions.length === 0 && !subscriptionsQuery.isLoading ? /* @__PURE__ */ jsxDEV(EmptyState, {
+      testId: "payments-empty",
+      title: t("No subscriptions yet")
+    }, void 0, false) : /* @__PURE__ */ jsxDEV(Card, {
+      className: "overflow-hidden py-0",
+      children: /* @__PURE__ */ jsxDEV(CardContent, {
+        className: "px-0",
+        children: /* @__PURE__ */ jsxDEV(Table, {
+          children: [/* @__PURE__ */ jsxDEV(TableHeader, {
+            children: /* @__PURE__ */ jsxDEV(TableRow, {
+              children: [/* @__PURE__ */ jsxDEV(TableHead, {
+                children: t("Provider")
+              }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+                children: t("Reference")
+              }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+                children: t("Plan")
+              }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+                children: t("State")
+              }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+                children: t("Renews")
+              }, void 0, false)]
+            }, void 0, true)
+          }, void 0, false), /* @__PURE__ */ jsxDEV(TableBody, {
+            children: subscriptions.map((row_0) => {
+              const state = text(readField(row_0, "state"));
+              return /* @__PURE__ */ jsxDEV(TableRow, {
+                "data-testid": "payment-subscription-row",
+                children: [/* @__PURE__ */ jsxDEV(TableCell, {
+                  children: text(readField(row_0, "provider"))
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                  children: text(readField(row_0, "referenceId"))
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                  children: text(readField(row_0, "priceId"))
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                  children: /* @__PURE__ */ jsxDEV(Badge, {
+                    variant: badgeVariant(state),
+                    children: state
+                  }, void 0, false)
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                  children: formatTimestamp(readField(row_0, "currentPeriodEnd"))
+                }, void 0, false)]
+              }, text(readField(row_0, "providerSubscriptionId")), true);
+            })
+          }, void 0, false)]
+        }, void 0, true)
+      }, void 0, false)
+    }, void 0, false), /* @__PURE__ */ jsxDEV(Card, {
+      className: "overflow-hidden py-0",
+      children: [/* @__PURE__ */ jsxDEV("header", {
+        className: "border-b border-border px-4 py-3",
+        children: /* @__PURE__ */ jsxDEV("span", {
+          className: "font-mono text-[11px] tracking-wide text-muted-foreground uppercase",
+          children: t("Recent webhook events")
+        }, void 0, false)
+      }, void 0, false), /* @__PURE__ */ jsxDEV(CardContent, {
+        className: "px-0",
+        children: /* @__PURE__ */ jsxDEV(Table, {
+          children: /* @__PURE__ */ jsxDEV(TableBody, {
+            children: recentEvents.map((row_1) => /* @__PURE__ */ jsxDEV(TableRow, {
+              "data-testid": "payment-event-row",
+              children: [/* @__PURE__ */ jsxDEV(TableCell, {
+                children: text(readField(row_1, "provider"))
+              }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                className: "font-medium",
+                children: text(readField(row_1, "type"))
+              }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                className: "text-muted-foreground",
+                children: text(readField(row_1, "providerEventId"))
+              }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                children: formatTimestamp(readField(row_1, "processedAt"))
+              }, void 0, false)]
+            }, text(readField(row_1, "providerEventId")), true))
+          }, void 0, false)
+        }, void 0, false)
+      }, void 0, false)]
+    }, void 0, true)]
+  }, void 0, true);
+};
+
+export { PaymentsPanel };