@burdenoff/microfe-billing 2026.601.4 → 2026.601.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/billing/modules/usage/pages/UsagePage.js +310 -308
  2. package/dist/billing/modules/usage/pages/UsagePage.js.map +1 -1
  3. package/package.json +1 -1
package/dist/billing/modules/usage/pages/UsagePage.js CHANGED
@@ -3,20 +3,20 @@ import { statusTokens as t } from "../../../shared/utils/tokens.js";
3
3
  import { formatDateTime as n, formatNumber as r, formatRelativeTime as i } from "../../../shared/utils/format.js";
4
4
  import { useBillingPermissions as a } from "../../../hooks/useBillingPermissions.js";
5
5
  import { useBillingAccountsForUsage as o, useEnhancedUsagePage as s, useQuotaUsageDetails as c, useWorkspaceQuotaHistory as l } from "../hooks/useUsage.js";
6
- import { useCallback as u, useDeferredValue as d, useMemo as f, useState as p } from "react";
7
- import { AlertCircle as m, AlertTriangle as h, CheckCircle as g, ChevronDown as _, ChevronLeft as v, ChevronRight as y, Clock as b, Info as x, Layers as S, Package as C, RefreshCw as w, Search as T, X as E, XCircle as D } from "lucide-react";
8
- import { Fragment as O, jsx as k, jsxs as A } from "react/jsx-runtime";
9
- import { useI18n as ee } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
6
+ import { useCallback as u, useDeferredValue as ee, useMemo as d, useState as f } from "react";
7
+ import { AlertCircle as p, AlertTriangle as m, CheckCircle as h, ChevronDown as g, ChevronLeft as _, ChevronRight as v, Clock as y, Info as b, Layers as x, Package as S, RefreshCw as C, Search as w, X as T, XCircle as E } from "lucide-react";
8
+ import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
9
+ import { useI18n as te } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
10
10
  //#region src/billing/modules/usage/pages/UsagePage.tsx
11
- var j = ({ status: e, className: n = "size-4" }) => {
11
+ var A = ({ status: e, className: n = "size-4" }) => {
12
12
  switch (e) {
13
- case "EXHAUSTED": return /* @__PURE__ */ k(D, { className: `${n} ${t.error.icon}` });
14
- case "CRITICAL": return /* @__PURE__ */ k(h, { className: `${n} ${t.error.icon}` });
15
- case "WARNING": return /* @__PURE__ */ k(m, { className: `${n} ${t.warning.icon}` });
16
- case "HEALTHY": return /* @__PURE__ */ k(g, { className: `${n} ${t.success.icon}` });
17
- default: return /* @__PURE__ */ k(x, { className: `${n} ${t.neutral.icon}` });
13
+ case "EXHAUSTED": return /* @__PURE__ */ O(E, { className: `${n} ${t.error.icon}` });
14
+ case "CRITICAL": return /* @__PURE__ */ O(m, { className: `${n} ${t.error.icon}` });
15
+ case "WARNING": return /* @__PURE__ */ O(p, { className: `${n} ${t.warning.icon}` });
16
+ case "HEALTHY": return /* @__PURE__ */ O(h, { className: `${n} ${t.success.icon}` });
17
+ default: return /* @__PURE__ */ O(b, { className: `${n} ${t.neutral.icon}` });
18
18
  }
19
- }, M = ({ status: e }) => /* @__PURE__ */ k("span", {
19
+ }, j = ({ status: e }) => /* @__PURE__ */ O("span", {
20
20
  className: `px-2 py-0.5 text-xs font-medium rounded ${{
21
21
  EXHAUSTED: `${t.error.bg} ${t.error.text}`,
22
22
  CRITICAL: `${t.error.bg} ${t.error.text}`,
@@ -25,11 +25,11 @@ var j = ({ status: e, className: n = "size-4" }) => {
25
25
  INACTIVE: `${t.neutral.bg} ${t.neutral.text}`
26
26
  }[e]}`,
27
27
  children: e
28
- }), N = ({ percentage: e, status: n }) => {
28
+ }), M = ({ percentage: e, status: n }) => {
29
29
  let r = Math.min(100, Math.max(0, e));
30
- return /* @__PURE__ */ k("div", {
30
+ return /* @__PURE__ */ O("div", {
31
31
  className: "w-full bg-muted rounded-full h-2.5 overflow-hidden",
32
- children: /* @__PURE__ */ k("div", {
32
+ children: /* @__PURE__ */ O("div", {
33
33
  className: `h-full rounded-full transition-all duration-300 ${{
34
34
  EXHAUSTED: t.error.dot,
35
35
  CRITICAL: t.error.dot,
@@ -40,7 +40,7 @@ var j = ({ status: e, className: n = "size-4" }) => {
40
40
  style: { width: `${r}%` }
41
41
  })
42
42
  });
43
- }, P = ({ label: e, value: n, icon: r, color: i, isActive: a, onClick: o }) => {
43
+ }, N = ({ label: e, value: n, icon: r, color: i, isActive: a, onClick: o }) => {
44
44
  let s = {
45
45
  blue: t.info,
46
46
  emerald: t.success,
@@ -66,60 +66,60 @@ var j = ({ status: e, className: n = "size-4" }) => {
66
66
  red: t.error.icon,
67
67
  gray: t.neutral.icon
68
68
  };
69
- return /* @__PURE__ */ A("button", {
69
+ return /* @__PURE__ */ k("button", {
70
70
  type: "button",
71
71
  onClick: o,
72
72
  className: `border rounded-lg p-4 w-full text-left transition-all ${c[i]} ${o ? "cursor-pointer hover:shadow-md" : ""} ${a ? l[i] : ""}`,
73
- children: [/* @__PURE__ */ A("div", {
73
+ children: [/* @__PURE__ */ k("div", {
74
74
  className: "flex items-center gap-2 mb-2",
75
- children: [/* @__PURE__ */ k("span", {
75
+ children: [/* @__PURE__ */ O("span", {
76
76
  className: u[i],
77
77
  children: r
78
- }), /* @__PURE__ */ k("span", {
78
+ }), /* @__PURE__ */ O("span", {
79
79
  className: "text-sm text-muted-foreground",
80
80
  children: e
81
81
  })]
82
- }), /* @__PURE__ */ k("p", {
82
+ }), /* @__PURE__ */ O("p", {
83
83
  className: "text-2xl font-bold text-foreground",
84
84
  children: n
85
85
  })]
86
86
  });
87
- }, F = ({ quota: e, planLabel: t, onClick: n }) => {
87
+ }, P = ({ quota: e, planLabel: t, onClick: n }) => {
88
88
  let i = e.totalLimit != null && e.totalLimit > 0 && !e.noLimit;
89
- return /* @__PURE__ */ A("tr", {
89
+ return /* @__PURE__ */ k("tr", {
90
90
  onClick: n,
91
91
  className: "cursor-pointer hover:bg-muted/40 transition-colors border-b border-border last:border-b-0",
92
92
  children: [
93
- /* @__PURE__ */ A("td", {
93
+ /* @__PURE__ */ k("td", {
94
94
  className: "px-4 py-3",
95
95
  children: [
96
- /* @__PURE__ */ k("span", {
96
+ /* @__PURE__ */ O("span", {
97
97
  className: "text-sm font-medium text-primary hover:underline capitalize",
98
98
  children: e.displayName || e.name.replace(/_/g, " ")
99
99
  }),
100
- /* @__PURE__ */ k("span", {
100
+ /* @__PURE__ */ O("span", {
101
101
  className: "block text-xs font-mono text-muted-foreground mt-0.5",
102
102
  children: e.name
103
103
  }),
104
- e.description && /* @__PURE__ */ k("span", {
104
+ e.description && /* @__PURE__ */ O("span", {
105
105
  className: "block text-xs text-muted-foreground mt-0.5 max-w-[220px] truncate",
106
106
  children: e.description
107
107
  }),
108
- e.quotaCount > 1 && /* @__PURE__ */ A("span", {
108
+ e.quotaCount > 1 && /* @__PURE__ */ k("span", {
109
109
  className: "block text-xs text-muted-foreground mt-0.5",
110
110
  children: [e.quotaCount, " assignments"]
111
111
  })
112
112
  ]
113
113
  }),
114
- t !== void 0 && /* @__PURE__ */ k("td", {
114
+ t !== void 0 && /* @__PURE__ */ O("td", {
115
115
  className: "px-4 py-3 text-sm text-muted-foreground whitespace-nowrap",
116
116
  children: t
117
117
  }),
118
- /* @__PURE__ */ k("td", {
118
+ /* @__PURE__ */ O("td", {
119
119
  className: "px-4 py-3",
120
- children: /* @__PURE__ */ A("div", {
120
+ children: /* @__PURE__ */ k("div", {
121
121
  className: "space-y-1.5",
122
- children: [/* @__PURE__ */ A("span", {
122
+ children: [/* @__PURE__ */ k("span", {
123
123
  className: "text-sm text-foreground tabular-nums",
124
124
  children: [
125
125
  r(e.totalUsed),
@@ -127,58 +127,58 @@ var j = ({ status: e, className: n = "size-4" }) => {
127
127
  i ? r(e.totalLimit) : "∞",
128
128
  e.unit ? ` ${e.unit}` : ""
129
129
  ]
130
- }), /* @__PURE__ */ k(N, {
130
+ }), /* @__PURE__ */ O(M, {
131
131
  percentage: i ? e.usagePercentage : 0,
132
132
  status: e.status
133
133
  })]
134
134
  })
135
135
  }),
136
- /* @__PURE__ */ k("td", {
136
+ /* @__PURE__ */ O("td", {
137
137
  className: "px-4 py-3 text-sm text-muted-foreground tabular-nums whitespace-nowrap",
138
138
  children: i ? r(e.totalLimit) : "∞"
139
139
  }),
140
- /* @__PURE__ */ k("td", {
140
+ /* @__PURE__ */ O("td", {
141
141
  className: "px-4 py-3",
142
- children: /* @__PURE__ */ k(M, { status: e.status })
142
+ children: /* @__PURE__ */ O(j, { status: e.status })
143
143
  })
144
144
  ]
145
145
  });
146
- }, te = ({ quotas: e, planLabel: t, showPlanColumn: n = !0, onQuotaClick: r }) => /* @__PURE__ */ k("div", {
146
+ }, ne = ({ quotas: e, planLabel: t, showPlanColumn: n = !0, onQuotaClick: r }) => /* @__PURE__ */ O("div", {
147
147
  className: "overflow-x-auto rounded-lg border border-border bg-card",
148
- children: /* @__PURE__ */ A("table", {
148
+ children: /* @__PURE__ */ k("table", {
149
149
  className: "w-full text-left",
150
- children: [/* @__PURE__ */ k("thead", { children: /* @__PURE__ */ A("tr", {
150
+ children: [/* @__PURE__ */ O("thead", { children: /* @__PURE__ */ k("tr", {
151
151
  className: "border-b border-border bg-muted/30",
152
152
  children: [
153
- /* @__PURE__ */ k("th", {
153
+ /* @__PURE__ */ O("th", {
154
154
  className: "px-4 py-2.5 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
155
155
  children: "Quotas"
156
156
  }),
157
- n && /* @__PURE__ */ k("th", {
157
+ n && /* @__PURE__ */ O("th", {
158
158
  className: "px-4 py-2.5 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
159
159
  children: "Plan"
160
160
  }),
161
- /* @__PURE__ */ k("th", {
161
+ /* @__PURE__ */ O("th", {
162
162
  className: "px-4 py-2.5 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
163
163
  children: "Current Usage"
164
164
  }),
165
- /* @__PURE__ */ k("th", {
165
+ /* @__PURE__ */ O("th", {
166
166
  className: "px-4 py-2.5 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
167
167
  children: "Limit"
168
168
  }),
169
- /* @__PURE__ */ k("th", {
169
+ /* @__PURE__ */ O("th", {
170
170
  className: "px-4 py-2.5 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
171
171
  children: "Status"
172
172
  })
173
173
  ]
174
- }) }), /* @__PURE__ */ k("tbody", { children: e.map((e) => /* @__PURE__ */ k(F, {
174
+ }) }), /* @__PURE__ */ O("tbody", { children: e.map((e) => /* @__PURE__ */ O(P, {
175
175
  quota: e,
176
176
  planLabel: n ? t : void 0,
177
177
  onClick: () => r(e)
178
178
  }, e.name)) })]
179
179
  })
180
- }), ne = ({ subscription: e, onQuotaClick: n, defaultExpanded: r = !0 }) => {
181
- let [i, a] = p(r), o = {
180
+ }), re = ({ subscription: e, onQuotaClick: n, defaultExpanded: r = !0 }) => {
181
+ let [i, a] = f(r), o = {
182
182
  active: `${t.success.bg} ${t.success.text}`,
183
183
  trialing: `${t.info.bg} ${t.info.text}`,
184
184
  past_due: `${t.warning.bg} ${t.warning.text}`,
@@ -186,27 +186,27 @@ var j = ({ status: e, className: n = "size-4" }) => {
186
186
  expired: `${t.neutral.bg} ${t.neutral.text}`,
187
187
  upgraded: `${t.primary.bg} ${t.primary.text}`
188
188
  };
189
- return /* @__PURE__ */ A("div", {
189
+ return /* @__PURE__ */ k("div", {
190
190
  className: "border border-border rounded-lg bg-card overflow-hidden",
191
191
  children: [
192
- /* @__PURE__ */ A("button", {
192
+ /* @__PURE__ */ k("button", {
193
193
  type: "button",
194
194
  onClick: () => a(!i),
195
195
  className: "w-full flex items-center justify-between p-4 hover:bg-muted/50 transition-colors",
196
- children: [/* @__PURE__ */ A("div", {
196
+ children: [/* @__PURE__ */ k("div", {
197
197
  className: "flex items-center gap-3",
198
- children: [/* @__PURE__ */ k(C, { className: "size-5 text-primary" }), /* @__PURE__ */ A("div", {
198
+ children: [/* @__PURE__ */ O(S, { className: "size-5 text-primary" }), /* @__PURE__ */ k("div", {
199
199
  className: "text-left",
200
- children: [/* @__PURE__ */ A("div", {
200
+ children: [/* @__PURE__ */ k("div", {
201
201
  className: "flex items-center gap-2",
202
- children: [/* @__PURE__ */ k("span", {
202
+ children: [/* @__PURE__ */ O("span", {
203
203
  className: "font-medium text-foreground",
204
204
  children: "Subscription"
205
- }), /* @__PURE__ */ k("span", {
205
+ }), /* @__PURE__ */ O("span", {
206
206
  className: `px-2 py-0.5 text-xs font-medium rounded capitalize ${o[e.status.toLowerCase()] || o.active}`,
207
207
  children: e.status
208
208
  })]
209
- }), /* @__PURE__ */ A("p", {
209
+ }), /* @__PURE__ */ k("p", {
210
210
  className: "text-xs text-muted-foreground",
211
211
  children: [
212
212
  e.aggregatedQuotas.length,
@@ -215,65 +215,65 @@ var j = ({ status: e, className: n = "size-4" }) => {
215
215
  ]
216
216
  })]
217
217
  })]
218
- }), k(i ? _ : y, { className: "size-5 text-muted-foreground" })]
218
+ }), O(i ? g : v, { className: "size-5 text-muted-foreground" })]
219
219
  }),
220
- i && e.aggregatedQuotas.length > 0 && /* @__PURE__ */ k("div", {
220
+ i && e.aggregatedQuotas.length > 0 && /* @__PURE__ */ O("div", {
221
221
  className: "border-t border-border",
222
- children: /* @__PURE__ */ k(te, {
222
+ children: /* @__PURE__ */ O(ne, {
223
223
  quotas: e.aggregatedQuotas,
224
224
  planLabel: e.planName || e.productId || void 0,
225
225
  showPlanColumn: !!(e.planName || e.productId),
226
226
  onQuotaClick: n
227
227
  })
228
228
  }),
229
- i && e.aggregatedQuotas.length === 0 && /* @__PURE__ */ k("div", {
229
+ i && e.aggregatedQuotas.length === 0 && /* @__PURE__ */ O("div", {
230
230
  className: "border-t border-border p-6 text-center",
231
- children: /* @__PURE__ */ k("p", {
231
+ children: /* @__PURE__ */ O("p", {
232
232
  className: "text-sm text-muted-foreground",
233
233
  children: "No quotas assigned to this subscription"
234
234
  })
235
235
  })
236
236
  ]
237
237
  });
238
- }, re = ({ quota: a, onClose: o }) => {
239
- let [s, u] = p([null]), d = s[s.length - 1] ?? null, f = s.length, { workspaceId: m } = e(), h = a.quotaAssignments[0]?.id, { usages: g, hasNextPage: _, nextCursor: b, isLoading: x } = c(h, 10, d, m), { snapshots: S, isLoading: C } = l(m, a.name, 24), w = () => {
240
- b && u((e) => [...e, b]);
241
- }, T = () => {
238
+ }, ie = ({ quota: a, onClose: o }) => {
239
+ let [s, u] = f([null]), ee = s[s.length - 1] ?? null, d = s.length, { workspaceId: p } = e(), m = a.quotaAssignments[0]?.id, { usages: h, hasNextPage: g, nextCursor: y, isLoading: b } = c(m, 10, ee, p), { snapshots: x, isLoading: S } = l(p, a.name, 24), C = () => {
240
+ y && u((e) => [...e, y]);
241
+ }, w = () => {
242
242
  s.length > 1 && u((e) => e.slice(0, -1));
243
243
  };
244
- return /* @__PURE__ */ A("div", {
244
+ return /* @__PURE__ */ k("div", {
245
245
  className: "fixed inset-0 z-50 flex items-center justify-center",
246
- children: [/* @__PURE__ */ k("div", {
246
+ children: [/* @__PURE__ */ O("div", {
247
247
  className: "absolute inset-0 bg-overlay-scrim",
248
248
  onClick: o
249
- }), /* @__PURE__ */ A("div", {
249
+ }), /* @__PURE__ */ k("div", {
250
250
  className: "relative bg-background border border-border rounded-lg shadow-xl max-w-2xl w-full mx-4 max-h-[90vh] overflow-auto",
251
251
  role: "dialog",
252
252
  "aria-modal": "true",
253
253
  "aria-labelledby": "quota-detail-title",
254
254
  children: [
255
- /* @__PURE__ */ A("div", {
255
+ /* @__PURE__ */ k("div", {
256
256
  className: "sticky top-0 bg-background border-b border-border p-4 flex items-center justify-between",
257
- children: [/* @__PURE__ */ A("div", {
257
+ children: [/* @__PURE__ */ k("div", {
258
258
  className: "flex items-center gap-3",
259
- children: [/* @__PURE__ */ k(j, {
259
+ children: [/* @__PURE__ */ O(A, {
260
260
  status: a.status,
261
261
  className: "size-5"
262
- }), /* @__PURE__ */ A("div", { children: [
263
- /* @__PURE__ */ k("h2", {
262
+ }), /* @__PURE__ */ k("div", { children: [
263
+ /* @__PURE__ */ O("h2", {
264
264
  id: "quota-detail-title",
265
265
  className: "text-lg font-semibold capitalize",
266
266
  children: a.displayName || a.name.replace(/_/g, " ")
267
267
  }),
268
- /* @__PURE__ */ k("p", {
268
+ /* @__PURE__ */ O("p", {
269
269
  className: "text-xs font-mono text-muted-foreground",
270
270
  children: a.name
271
271
  }),
272
- a.description && /* @__PURE__ */ k("p", {
272
+ a.description && /* @__PURE__ */ O("p", {
273
273
  className: "text-sm text-muted-foreground mt-0.5",
274
274
  children: a.description
275
275
  }),
276
- /* @__PURE__ */ A("p", {
276
+ /* @__PURE__ */ k("p", {
277
277
  className: "text-sm text-muted-foreground mt-0.5",
278
278
  children: [
279
279
  a.quotaCount,
@@ -282,33 +282,33 @@ var j = ({ status: e, className: n = "size-4" }) => {
282
282
  ]
283
283
  })
284
284
  ] })]
285
- }), /* @__PURE__ */ k("button", {
285
+ }), /* @__PURE__ */ O("button", {
286
286
  type: "button",
287
287
  onClick: o,
288
288
  className: "p-1 rounded-md hover:bg-muted/50 transition-colors",
289
289
  "aria-label": "Close quota details",
290
- children: /* @__PURE__ */ k(E, { className: "size-5" })
290
+ children: /* @__PURE__ */ O(T, { className: "size-5" })
291
291
  })]
292
292
  }),
293
- /* @__PURE__ */ A("div", {
293
+ /* @__PURE__ */ k("div", {
294
294
  className: "p-4 border-b border-border",
295
- children: [/* @__PURE__ */ A("div", {
295
+ children: [/* @__PURE__ */ k("div", {
296
296
  className: "mb-4",
297
297
  children: [
298
- /* @__PURE__ */ A("div", {
298
+ /* @__PURE__ */ k("div", {
299
299
  className: "flex items-center justify-between mb-2",
300
- children: [/* @__PURE__ */ k("span", {
300
+ children: [/* @__PURE__ */ O("span", {
301
301
  className: "text-sm text-muted-foreground",
302
302
  children: "Usage"
303
- }), /* @__PURE__ */ k(M, { status: a.status })]
303
+ }), /* @__PURE__ */ O(j, { status: a.status })]
304
304
  }),
305
- /* @__PURE__ */ k(N, {
305
+ /* @__PURE__ */ O(M, {
306
306
  percentage: a.usagePercentage,
307
307
  status: a.status
308
308
  }),
309
- /* @__PURE__ */ A("div", {
309
+ /* @__PURE__ */ k("div", {
310
310
  className: "flex items-center justify-between mt-2 text-sm",
311
- children: [/* @__PURE__ */ A("span", {
311
+ children: [/* @__PURE__ */ k("span", {
312
312
  className: "font-medium",
313
313
  children: [
314
314
  r(a.totalUsed),
@@ -317,44 +317,44 @@ var j = ({ status: e, className: n = "size-4" }) => {
317
317
  a.totalLimit != null && a.totalLimit > 0 ? r(a.totalLimit) : "∞",
318
318
  a.unit && ` ${a.unit}`
319
319
  ]
320
- }), /* @__PURE__ */ k("span", {
320
+ }), /* @__PURE__ */ O("span", {
321
321
  className: "text-muted-foreground",
322
322
  children: a.totalLimit != null && a.totalLimit > 0 ? `${Math.round(a.usagePercentage)}% used` : "Unlimited"
323
323
  })]
324
324
  })
325
325
  ]
326
- }), a.quotaCount > 1 && /* @__PURE__ */ A("div", {
326
+ }), a.quotaCount > 1 && /* @__PURE__ */ k("div", {
327
327
  className: "mt-4",
328
- children: [/* @__PURE__ */ k("h3", {
328
+ children: [/* @__PURE__ */ O("h3", {
329
329
  className: "text-sm font-medium text-foreground mb-3",
330
330
  children: "Quota Breakdown"
331
- }), /* @__PURE__ */ k("div", {
331
+ }), /* @__PURE__ */ O("div", {
332
332
  className: "border border-border rounded-lg overflow-hidden divide-y divide-border",
333
333
  children: [...a.quotaAssignments].sort((e, t) => (e.endtime ? new Date(e.endtime).getTime() : Infinity) - (t.endtime ? new Date(t.endtime).getTime() : Infinity)).map((e) => {
334
334
  let n = e.endtime ? new Date(e.endtime) : null, i = /* @__PURE__ */ new Date(), a = n && n < i, o = n ? Math.ceil((n.getTime() - i.getTime()) / (1440 * 60 * 1e3)) : null, s = o !== null && o > 0 && o <= 7;
335
- return /* @__PURE__ */ A("div", {
335
+ return /* @__PURE__ */ k("div", {
336
336
  className: `flex items-center justify-between px-3 py-2.5 ${a ? "bg-muted/30" : s ? t.warning.bg : "bg-background"}`,
337
- children: [/* @__PURE__ */ A("div", {
337
+ children: [/* @__PURE__ */ k("div", {
338
338
  className: "flex items-center gap-2",
339
- children: [s && !a && /* @__PURE__ */ k("span", { className: `size-2 rounded-full ${t.warning.dot} animate-pulse` }), /* @__PURE__ */ A("div", {
339
+ children: [s && !a && /* @__PURE__ */ O("span", { className: `size-2 rounded-full ${t.warning.dot} animate-pulse` }), /* @__PURE__ */ k("div", {
340
340
  className: "flex flex-col",
341
- children: [/* @__PURE__ */ k("span", {
341
+ children: [/* @__PURE__ */ O("span", {
342
342
  className: `text-sm ${a ? "text-muted-foreground" : "text-foreground"}`,
343
343
  children: n ? n.toLocaleDateString("en-US", {
344
344
  month: "short",
345
345
  day: "numeric",
346
346
  year: "numeric"
347
347
  }) : "No expiry"
348
- }), /* @__PURE__ */ k("span", {
348
+ }), /* @__PURE__ */ O("span", {
349
349
  className: `text-xs ${a ? "text-destructive" : s ? t.warning.text : "text-muted-foreground"}`,
350
350
  children: a ? "Expired" : o === null ? "Never expires" : o === 0 ? "Expires today" : o === 1 ? "Expires tomorrow" : `${o} days left`
351
351
  })]
352
352
  })]
353
- }), /* @__PURE__ */ k("div", {
353
+ }), /* @__PURE__ */ O("div", {
354
354
  className: "text-right",
355
- children: /* @__PURE__ */ A("span", {
355
+ children: /* @__PURE__ */ k("span", {
356
356
  className: `text-sm font-semibold ${a ? "text-muted-foreground" : "text-foreground"}`,
357
- children: [r(e.used), /* @__PURE__ */ A("span", {
357
+ children: [r(e.used), /* @__PURE__ */ k("span", {
358
358
  className: "text-muted-foreground font-normal",
359
359
  children: [
360
360
  " / ",
@@ -369,34 +369,34 @@ var j = ({ status: e, className: n = "size-4" }) => {
369
369
  })]
370
370
  })]
371
371
  }),
372
- (C || S.length > 0) && /* @__PURE__ */ A("div", {
372
+ (S || x.length > 0) && /* @__PURE__ */ k("div", {
373
373
  className: "p-4 border-t border-border",
374
- children: [/* @__PURE__ */ k("h3", {
374
+ children: [/* @__PURE__ */ O("h3", {
375
375
  className: "text-sm font-medium text-foreground mb-3",
376
376
  children: "Live Value History"
377
- }), C ? /* @__PURE__ */ k("div", {
377
+ }), S ? /* @__PURE__ */ O("div", {
378
378
  className: "space-y-1.5",
379
379
  children: [
380
380
  1,
381
381
  2,
382
382
  3
383
- ].map((e) => /* @__PURE__ */ k("div", { className: "h-8 bg-muted animate-pulse rounded" }, e))
384
- }) : /* @__PURE__ */ k("div", {
383
+ ].map((e) => /* @__PURE__ */ O("div", { className: "h-8 bg-muted animate-pulse rounded" }, e))
384
+ }) : /* @__PURE__ */ O("div", {
385
385
  className: "space-y-1.5",
386
- children: S.map((e) => /* @__PURE__ */ A("div", {
386
+ children: x.map((e) => /* @__PURE__ */ k("div", {
387
387
  className: "flex items-center justify-between px-3 py-2 bg-muted/30 rounded-md",
388
- children: [/* @__PURE__ */ k("span", {
388
+ children: [/* @__PURE__ */ O("span", {
389
389
  className: "text-xs text-muted-foreground",
390
390
  children: n(e.snapshotAt)
391
- }), /* @__PURE__ */ A("span", {
391
+ }), /* @__PURE__ */ k("span", {
392
392
  className: "text-sm font-medium text-foreground tabular-nums",
393
393
  children: [
394
394
  r(e.value),
395
- a.unit && /* @__PURE__ */ k("span", {
395
+ a.unit && /* @__PURE__ */ O("span", {
396
396
  className: "text-xs text-muted-foreground ml-1",
397
397
  children: a.unit
398
398
  }),
399
- !e.noLimit && e.limit != null && /* @__PURE__ */ A("span", {
399
+ !e.noLimit && e.limit != null && /* @__PURE__ */ k("span", {
400
400
  className: "text-xs text-muted-foreground ml-1",
401
401
  children: ["/ ", r(e.limit)]
402
402
  })
@@ -405,36 +405,36 @@ var j = ({ status: e, className: n = "size-4" }) => {
405
405
  }, e.id))
406
406
  })]
407
407
  }),
408
- /* @__PURE__ */ A("div", {
408
+ /* @__PURE__ */ k("div", {
409
409
  className: "p-4",
410
410
  children: [
411
- /* @__PURE__ */ k("h3", {
411
+ /* @__PURE__ */ O("h3", {
412
412
  className: "text-sm font-medium text-foreground mb-3",
413
413
  children: "Recent Usage"
414
414
  }),
415
- a.isCollectorBased ? /* @__PURE__ */ k("p", {
415
+ a.isCollectorBased ? /* @__PURE__ */ O("p", {
416
416
  className: "text-sm text-muted-foreground text-center py-6",
417
417
  children: "Usage is tracked via system metrics, individual event records are not available for this quota."
418
- }) : x ? /* @__PURE__ */ k("div", {
418
+ }) : b ? /* @__PURE__ */ O("div", {
419
419
  className: "space-y-2",
420
420
  children: [
421
421
  1,
422
422
  2,
423
423
  3
424
- ].map((e) => /* @__PURE__ */ k("div", { className: "h-12 bg-muted animate-pulse rounded" }, e))
425
- }) : g.length === 0 ? /* @__PURE__ */ k("p", {
424
+ ].map((e) => /* @__PURE__ */ O("div", { className: "h-12 bg-muted animate-pulse rounded" }, e))
425
+ }) : h.length === 0 ? /* @__PURE__ */ O("p", {
426
426
  className: "text-sm text-muted-foreground text-center py-6",
427
427
  children: "No usage records found"
428
- }) : /* @__PURE__ */ k("div", {
428
+ }) : /* @__PURE__ */ O("div", {
429
429
  className: "space-y-2",
430
- children: g.map((e) => /* @__PURE__ */ A("div", {
430
+ children: h.map((e) => /* @__PURE__ */ k("div", {
431
431
  className: "flex items-center justify-between p-3 border border-border rounded-lg",
432
- children: [/* @__PURE__ */ A("div", {
432
+ children: [/* @__PURE__ */ k("div", {
433
433
  className: "flex-1 min-w-0",
434
- children: [/* @__PURE__ */ k("p", {
434
+ children: [/* @__PURE__ */ O("p", {
435
435
  className: "text-sm font-medium text-foreground",
436
436
  children: e.description || "Usage recorded"
437
- }), /* @__PURE__ */ A("p", {
437
+ }), /* @__PURE__ */ k("p", {
438
438
  className: "text-xs text-muted-foreground",
439
439
  children: [
440
440
  i(e.timestamp),
@@ -442,42 +442,42 @@ var j = ({ status: e, className: n = "size-4" }) => {
442
442
  n(e.timestamp)
443
443
  ]
444
444
  })]
445
- }), /* @__PURE__ */ k("span", {
445
+ }), /* @__PURE__ */ O("span", {
446
446
  className: "text-sm font-medium text-foreground ml-4",
447
447
  children: r(e.amount)
448
448
  })]
449
449
  }, e.id))
450
450
  }),
451
- !a.isCollectorBased && (s.length > 1 || _) && /* @__PURE__ */ A("div", {
451
+ !a.isCollectorBased && (s.length > 1 || g) && /* @__PURE__ */ k("div", {
452
452
  className: "flex items-center justify-center gap-2 mt-4",
453
453
  children: [
454
- /* @__PURE__ */ k("button", {
454
+ /* @__PURE__ */ O("button", {
455
455
  type: "button",
456
- onClick: T,
456
+ onClick: w,
457
457
  disabled: s.length === 1,
458
458
  className: "px-3 py-1.5 text-sm border border-border rounded-md disabled:opacity-50",
459
459
  "aria-label": "Previous usage page",
460
- children: /* @__PURE__ */ k(v, { className: "size-4" })
460
+ children: /* @__PURE__ */ O(_, { className: "size-4" })
461
461
  }),
462
- /* @__PURE__ */ A("span", {
462
+ /* @__PURE__ */ k("span", {
463
463
  className: "text-sm text-muted-foreground",
464
- children: ["Page ", f]
464
+ children: ["Page ", d]
465
465
  }),
466
- /* @__PURE__ */ k("button", {
466
+ /* @__PURE__ */ O("button", {
467
467
  type: "button",
468
- onClick: w,
469
- disabled: !_,
468
+ onClick: C,
469
+ disabled: !g,
470
470
  className: "px-3 py-1.5 text-sm border border-border rounded-md disabled:opacity-50",
471
471
  "aria-label": "Next usage page",
472
- children: /* @__PURE__ */ k(y, { className: "size-4" })
472
+ children: /* @__PURE__ */ O(v, { className: "size-4" })
473
473
  })
474
474
  ]
475
475
  })
476
476
  ]
477
477
  }),
478
- /* @__PURE__ */ k("div", {
478
+ /* @__PURE__ */ O("div", {
479
479
  className: "sticky bottom-0 bg-background border-t border-border p-4",
480
- children: /* @__PURE__ */ k("button", {
480
+ children: /* @__PURE__ */ O("button", {
481
481
  type: "button",
482
482
  onClick: o,
483
483
  className: "w-full py-2 px-4 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors",
@@ -487,456 +487,458 @@ var j = ({ status: e, className: n = "size-4" }) => {
487
487
  ]
488
488
  })]
489
489
  });
490
- }, I = () => {
491
- let { t: n } = ee(), r = (e, t) => {
490
+ }, F = () => {
491
+ let { t: n } = te(), r = (e, t) => {
492
492
  let r = n(e);
493
493
  return r === e ? t : r;
494
- }, i = a(), [c, l] = p(() => {
494
+ }, i = a(), [c, l] = f(() => {
495
495
  if (!(typeof window > "u")) return new URLSearchParams(window.location.search).get("billingAccountId") || void 0;
496
- }), [v, y] = p(null), [x, M] = p(""), [N, F] = p("all"), [I, L] = p("active"), ie = d(x), { billingAccounts: R, isLoading: ae } = o(), oe = (R.find((e) => e.isDefault) ?? R[0])?.id, z = c ?? oe, { workspaceId: se, navigate: ce, basePath: le } = e(), ue = u((e) => {
497
- ce(`${le}${e}`);
498
- }, [ce, le]), { dashboard: B, pooledQuotas: V, activeSubscriptions: H, pastSubscriptions: U, isLoading: de, isPastSubscriptionsLoading: W, error: G, refetch: K, loadMorePastSubscriptions: fe, hasMorePastSubscriptions: pe, isLoadingMorePast: me, pastSubscriptionsCount: he } = s({
496
+ }), [_, v] = f(null), [b, j] = f(""), [M, P] = f("all"), [F, I] = f("active"), L = ee(b), { billingAccounts: R, isLoading: ae } = o(), oe = (R.find((e) => e.isDefault) ?? R[0])?.id, z = c ?? oe, { workspaceId: se, navigate: B, basePath: V } = e();
497
+ u((e) => {
498
+ B(`${V}${e}`);
499
+ }, [B, V]);
500
+ let { dashboard: H, pooledQuotas: U, activeSubscriptions: W, pastSubscriptions: G, isLoading: ce, isPastSubscriptionsLoading: K, error: le, refetch: ue, loadMorePastSubscriptions: de, hasMorePastSubscriptions: fe, isLoadingMorePast: pe, pastSubscriptionsCount: me } = s({
499
501
  billingAccountId: z,
500
502
  workspaceId: se,
501
- searchQuery: ie || void 0,
502
- viewMode: I
503
- }), q = u((e) => N === "all" ? !0 : N === "healthy" ? e.status === "HEALTHY" : N === "warning" ? e.status === "WARNING" : N === "critical" ? e.status === "CRITICAL" || e.status === "EXHAUSTED" : !0, [N]), J = f(() => V.filter(q), [V, q]), Y = f(() => N === "all" ? H : H.map((e) => ({
503
+ searchQuery: L || void 0,
504
+ viewMode: F
505
+ }), q = u((e) => M === "all" ? !0 : M === "healthy" ? e.status === "HEALTHY" : M === "warning" ? e.status === "WARNING" : M === "critical" ? e.status === "CRITICAL" || e.status === "EXHAUSTED" : !0, [M]), J = d(() => U.filter(q), [U, q]), Y = d(() => M === "all" ? W : W.map((e) => ({
504
506
  ...e,
505
507
  aggregatedQuotas: e.aggregatedQuotas.filter(q)
506
508
  })).filter((e) => e.aggregatedQuotas.length > 0), [
507
- H,
508
- N,
509
+ W,
510
+ M,
509
511
  q
510
- ]), X = f(() => N === "all" ? U : U.map((e) => ({
512
+ ]), X = d(() => M === "all" ? G : G.map((e) => ({
511
513
  ...e,
512
514
  aggregatedQuotas: e.aggregatedQuotas.filter(q)
513
515
  })).filter((e) => e.aggregatedQuotas.length > 0), [
514
- U,
515
- N,
516
+ G,
517
+ M,
516
518
  q
517
- ]), Z = f(() => I === "active" ? {
519
+ ]), Z = d(() => F === "active" ? {
518
520
  active: Y,
519
521
  past: []
520
- } : I === "past" ? {
522
+ } : F === "past" ? {
521
523
  active: [],
522
524
  past: X
523
525
  } : {
524
526
  active: Y,
525
527
  past: X
526
528
  }, [
527
- I,
529
+ F,
528
530
  Y,
529
531
  X
530
- ]), Q = x !== "" || N !== "all", ge = ie !== x, _e = () => {
531
- M(""), F("all");
532
+ ]), Q = b !== "" || M !== "all", he = L !== b, ge = () => {
533
+ j(""), P("all");
532
534
  }, $ = (e) => {
533
- F((t) => t === e ? "all" : e);
535
+ P((t) => t === e ? "all" : e);
534
536
  };
535
- if (!i.canViewUsage) return /* @__PURE__ */ k("div", {
537
+ if (!i.canViewUsage) return /* @__PURE__ */ O("div", {
536
538
  className: "flex items-center justify-center h-full min-h-[400px]",
537
- children: /* @__PURE__ */ A("div", {
539
+ children: /* @__PURE__ */ k("div", {
538
540
  className: "text-center space-y-2",
539
541
  children: [
540
- /* @__PURE__ */ k("div", {
542
+ /* @__PURE__ */ O("div", {
541
543
  className: "size-12 mx-auto rounded-full bg-muted flex items-center justify-center",
542
- children: /* @__PURE__ */ k(h, { className: "size-6 text-muted-foreground" })
544
+ children: /* @__PURE__ */ O(m, { className: "size-6 text-muted-foreground" })
543
545
  }),
544
- /* @__PURE__ */ k("h2", {
546
+ /* @__PURE__ */ O("h2", {
545
547
  className: "text-lg font-semibold text-foreground",
546
548
  children: "Access Denied"
547
549
  }),
548
- /* @__PURE__ */ k("p", {
550
+ /* @__PURE__ */ O("p", {
549
551
  className: "text-sm text-muted-foreground max-w-sm",
550
552
  children: "You don't have permission to view usage data."
551
553
  })
552
554
  ]
553
555
  })
554
556
  });
555
- if ((ae || de) && !B) return /* @__PURE__ */ A("div", {
557
+ if ((ae || ce) && !H) return /* @__PURE__ */ k("div", {
556
558
  className: "space-y-6 p-6",
557
559
  children: [
558
- /* @__PURE__ */ k("div", { className: "h-8 w-48 bg-muted animate-pulse rounded" }),
559
- /* @__PURE__ */ k("div", {
560
+ /* @__PURE__ */ O("div", { className: "h-8 w-48 bg-muted animate-pulse rounded" }),
561
+ /* @__PURE__ */ O("div", {
560
562
  className: "grid grid-cols-2 sm:grid-cols-4 gap-4",
561
563
  children: [
562
564
  1,
563
565
  2,
564
566
  3,
565
567
  4
566
- ].map((e) => /* @__PURE__ */ k("div", { className: "h-24 bg-muted animate-pulse rounded-lg" }, e))
568
+ ].map((e) => /* @__PURE__ */ O("div", { className: "h-24 bg-muted animate-pulse rounded-lg" }, e))
567
569
  }),
568
- /* @__PURE__ */ k("div", { className: "h-64 bg-muted animate-pulse rounded-lg" })
570
+ /* @__PURE__ */ O("div", { className: "h-64 bg-muted animate-pulse rounded-lg" })
569
571
  ]
570
572
  });
571
- if (G) return /* @__PURE__ */ k("div", {
573
+ if (le) return /* @__PURE__ */ O("div", {
572
574
  className: "flex items-center justify-center h-full min-h-[400px]",
573
- children: /* @__PURE__ */ A("div", {
575
+ children: /* @__PURE__ */ k("div", {
574
576
  className: "text-center space-y-4",
575
577
  children: [
576
- /* @__PURE__ */ k("div", {
578
+ /* @__PURE__ */ O("div", {
577
579
  className: "size-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center",
578
- children: /* @__PURE__ */ k(h, { className: "size-6 text-destructive" })
580
+ children: /* @__PURE__ */ O(m, { className: "size-6 text-destructive" })
579
581
  }),
580
- /* @__PURE__ */ k("h2", {
582
+ /* @__PURE__ */ O("h2", {
581
583
  className: "text-lg font-semibold text-foreground",
582
584
  children: "Failed to load usage data"
583
585
  }),
584
- /* @__PURE__ */ k("p", {
586
+ /* @__PURE__ */ O("p", {
585
587
  className: "text-sm text-muted-foreground",
586
- children: G.message
588
+ children: le.message
587
589
  }),
588
- /* @__PURE__ */ k("button", {
590
+ /* @__PURE__ */ O("button", {
589
591
  type: "button",
590
- onClick: () => K(),
592
+ onClick: () => ue(),
591
593
  className: "px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors",
592
594
  children: "Try Again"
593
595
  })
594
596
  ]
595
597
  })
596
598
  });
597
- let ve = R.find((e) => e.id === z);
598
- return /* @__PURE__ */ A("div", {
599
+ let _e = R.find((e) => e.id === z);
600
+ return /* @__PURE__ */ k("div", {
599
601
  className: "space-y-6 p-6",
600
602
  children: [
601
- /* @__PURE__ */ A("div", {
603
+ /* @__PURE__ */ k("div", {
602
604
  className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
603
- children: [/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("h1", {
605
+ children: [/* @__PURE__ */ k("div", { children: [/* @__PURE__ */ O("h1", {
604
606
  className: "text-2xl font-bold text-foreground",
605
607
  children: r("billing.usage.title", "Usage")
606
- }), /* @__PURE__ */ k("p", {
608
+ }), /* @__PURE__ */ O("p", {
607
609
  className: "text-sm text-muted-foreground mt-1",
608
610
  children: "Monitor your resource consumption and quota usage"
609
- })] }), /* @__PURE__ */ A("div", {
611
+ })] }), /* @__PURE__ */ k("div", {
610
612
  className: "flex items-center gap-3",
611
- children: [R.length > 1 && /* @__PURE__ */ k("select", {
613
+ children: [R.length > 1 && /* @__PURE__ */ O("select", {
612
614
  value: z || "",
613
615
  onChange: (e) => l(e.target.value),
614
616
  className: "px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary w-full sm:min-w-[200px]",
615
- children: R.map((e) => /* @__PURE__ */ k("option", {
617
+ children: R.map((e) => /* @__PURE__ */ O("option", {
616
618
  value: e.id,
617
619
  children: e.name
618
620
  }, e.id))
619
- }), /* @__PURE__ */ k("button", {
621
+ }), /* @__PURE__ */ O("button", {
620
622
  type: "button",
621
- onClick: () => K(),
623
+ onClick: () => ue(),
622
624
  className: "p-2 border border-border rounded-md hover:bg-muted/50 transition-colors",
623
625
  title: "Refresh",
624
- children: /* @__PURE__ */ k(w, { className: "size-4" })
626
+ children: /* @__PURE__ */ O(C, { className: "size-4" })
625
627
  })]
626
628
  })]
627
629
  }),
628
- /* @__PURE__ */ A("div", {
630
+ /* @__PURE__ */ k("div", {
629
631
  className: "flex flex-col gap-3 sm:flex-row sm:items-center",
630
632
  children: [
631
- /* @__PURE__ */ A("div", {
633
+ /* @__PURE__ */ k("div", {
632
634
  className: "relative flex-1 max-w-md",
633
635
  children: [
634
- /* @__PURE__ */ k(T, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }),
635
- /* @__PURE__ */ k("input", {
636
+ /* @__PURE__ */ O(w, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }),
637
+ /* @__PURE__ */ O("input", {
636
638
  type: "text",
637
- value: x,
638
- onChange: (e) => M(e.target.value),
639
- placeholder: `Search ${I === "past" ? "past" : I === "all" ? "all" : "active"} quotas...`,
639
+ value: b,
640
+ onChange: (e) => j(e.target.value),
641
+ placeholder: `Search ${F === "past" ? "past" : F === "all" ? "all" : "active"} quotas...`,
640
642
  className: "w-full pl-9 pr-3 py-2 text-sm border border-border rounded-md bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary"
641
643
  }),
642
- (x || ge) && /* @__PURE__ */ k("button", {
644
+ (b || he) && /* @__PURE__ */ O("button", {
643
645
  type: "button",
644
- onClick: () => M(""),
646
+ onClick: () => j(""),
645
647
  className: "absolute right-2 top-1/2 -translate-y-1/2 p-1 rounded hover:bg-muted/50",
646
- children: ge ? /* @__PURE__ */ k(w, { className: "size-3 text-muted-foreground animate-spin" }) : /* @__PURE__ */ k(E, { className: "size-3 text-muted-foreground" })
648
+ children: he ? /* @__PURE__ */ O(C, { className: "size-3 text-muted-foreground animate-spin" }) : /* @__PURE__ */ O(T, { className: "size-3 text-muted-foreground" })
647
649
  })
648
650
  ]
649
651
  }),
650
- /* @__PURE__ */ A("div", {
652
+ /* @__PURE__ */ k("div", {
651
653
  className: "flex items-center bg-muted/50 rounded-lg p-1 border border-border",
652
- children: [/* @__PURE__ */ A("button", {
654
+ children: [/* @__PURE__ */ k("button", {
653
655
  type: "button",
654
- onClick: () => L("active"),
655
- className: `flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-md transition-all ${I === "active" ? "bg-background text-foreground shadow-sm font-medium" : "text-muted-foreground hover:text-foreground"}`,
656
- children: [/* @__PURE__ */ k(C, { className: "size-3.5" }), "Active"]
657
- }), /* @__PURE__ */ A("button", {
656
+ onClick: () => I("active"),
657
+ className: `flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-md transition-all ${F === "active" ? "bg-background text-foreground shadow-sm font-medium" : "text-muted-foreground hover:text-foreground"}`,
658
+ children: [/* @__PURE__ */ O(S, { className: "size-3.5" }), "Active"]
659
+ }), /* @__PURE__ */ k("button", {
658
660
  type: "button",
659
- onClick: () => L("past"),
660
- disabled: W && I !== "past",
661
- className: `flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-md transition-all ${I === "past" ? "bg-background text-foreground shadow-sm font-medium" : "text-muted-foreground hover:text-foreground"} ${W && I !== "past" ? "opacity-70" : ""}`,
662
- children: [W && I === "past" ? /* @__PURE__ */ k(w, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ k(b, { className: "size-3.5" }), "Past"]
661
+ onClick: () => I("past"),
662
+ disabled: K && F !== "past",
663
+ className: `flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-md transition-all ${F === "past" ? "bg-background text-foreground shadow-sm font-medium" : "text-muted-foreground hover:text-foreground"} ${K && F !== "past" ? "opacity-70" : ""}`,
664
+ children: [K && F === "past" ? /* @__PURE__ */ O(C, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ O(y, { className: "size-3.5" }), "Past"]
663
665
  })]
664
666
  }),
665
- Q && /* @__PURE__ */ A("button", {
667
+ Q && /* @__PURE__ */ k("button", {
666
668
  type: "button",
667
- onClick: _e,
669
+ onClick: ge,
668
670
  className: "flex items-center gap-1.5 px-3 py-1.5 text-sm text-muted-foreground hover:text-foreground border border-border rounded-md hover:bg-muted/50 transition-colors",
669
- children: [/* @__PURE__ */ k(E, { className: "size-3" }), "Clear filters"]
671
+ children: [/* @__PURE__ */ O(T, { className: "size-3" }), "Clear filters"]
670
672
  })
671
673
  ]
672
674
  }),
673
- ve && /* @__PURE__ */ A("div", {
675
+ _e && /* @__PURE__ */ k("div", {
674
676
  className: "text-sm text-muted-foreground",
675
677
  children: [
676
678
  "Viewing usage for",
677
679
  " ",
678
- /* @__PURE__ */ k("span", {
680
+ /* @__PURE__ */ O("span", {
679
681
  className: "font-medium text-foreground",
680
- children: ve.name
682
+ children: _e.name
681
683
  })
682
684
  ]
683
685
  }),
684
- B && /* @__PURE__ */ A("div", {
686
+ H && /* @__PURE__ */ k("div", {
685
687
  className: "grid grid-cols-2 sm:grid-cols-4 gap-4",
686
688
  children: [
687
- /* @__PURE__ */ k(P, {
689
+ /* @__PURE__ */ O(N, {
688
690
  label: "Total Quotas",
689
- value: B.totalQuotas,
690
- icon: /* @__PURE__ */ k(S, { className: "size-5" }),
691
+ value: H.totalQuotas,
692
+ icon: /* @__PURE__ */ O(x, { className: "size-5" }),
691
693
  color: "blue",
692
- isActive: N === "all",
693
- onClick: () => F("all")
694
+ isActive: M === "all",
695
+ onClick: () => P("all")
694
696
  }),
695
- /* @__PURE__ */ k(P, {
697
+ /* @__PURE__ */ O(N, {
696
698
  label: "Healthy",
697
- value: B.healthyQuotas,
698
- icon: /* @__PURE__ */ k(g, { className: "size-5" }),
699
+ value: H.healthyQuotas,
700
+ icon: /* @__PURE__ */ O(h, { className: "size-5" }),
699
701
  color: "emerald",
700
- isActive: N === "healthy",
702
+ isActive: M === "healthy",
701
703
  onClick: () => $("healthy")
702
704
  }),
703
- /* @__PURE__ */ k(P, {
705
+ /* @__PURE__ */ O(N, {
704
706
  label: "Warning",
705
- value: B.warningQuotas,
706
- icon: /* @__PURE__ */ k(m, { className: "size-5" }),
707
+ value: H.warningQuotas,
708
+ icon: /* @__PURE__ */ O(p, { className: "size-5" }),
707
709
  color: "amber",
708
- isActive: N === "warning",
710
+ isActive: M === "warning",
709
711
  onClick: () => $("warning")
710
712
  }),
711
- /* @__PURE__ */ k(P, {
713
+ /* @__PURE__ */ O(N, {
712
714
  label: "Critical / Exhausted",
713
- value: B.criticalQuotas + B.exhaustedQuotas,
714
- icon: /* @__PURE__ */ k(h, { className: "size-5" }),
715
+ value: H.criticalQuotas + H.exhaustedQuotas,
716
+ icon: /* @__PURE__ */ O(m, { className: "size-5" }),
715
717
  color: "red",
716
- isActive: N === "critical",
718
+ isActive: M === "critical",
717
719
  onClick: () => $("critical")
718
720
  })
719
721
  ]
720
722
  }),
721
- B && (B.warningQuotas > 0 || B.criticalQuotas > 0 || B.exhaustedQuotas > 0) && /* @__PURE__ */ A("div", {
722
- className: `flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between p-4 rounded-lg border ${B.criticalQuotas > 0 || B.exhaustedQuotas > 0 ? `${t.error.bg} ${t.error.border}` : `${t.warning.bg} ${t.warning.border}`}`,
723
- children: [/* @__PURE__ */ A("div", {
723
+ H && (H.warningQuotas > 0 || H.criticalQuotas > 0 || H.exhaustedQuotas > 0) && /* @__PURE__ */ k("div", {
724
+ className: `flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between p-4 rounded-lg border ${H.criticalQuotas > 0 || H.exhaustedQuotas > 0 ? `${t.error.bg} ${t.error.border}` : `${t.warning.bg} ${t.warning.border}`}`,
725
+ children: [/* @__PURE__ */ k("div", {
724
726
  className: "flex items-center gap-3",
725
- children: [B.criticalQuotas > 0 || B.exhaustedQuotas > 0 ? /* @__PURE__ */ k(D, { className: `size-5 shrink-0 ${t.error.icon}` }) : /* @__PURE__ */ k(m, { className: `size-5 shrink-0 ${t.warning.icon}` }), /* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("p", {
726
- className: `text-sm font-medium ${B.criticalQuotas > 0 || B.exhaustedQuotas > 0 ? t.error.text : t.warning.text}`,
727
- children: B.criticalQuotas > 0 || B.exhaustedQuotas > 0 ? `${B.criticalQuotas + B.exhaustedQuotas} quota${B.criticalQuotas + B.exhaustedQuotas === 1 ? "" : "s"} exhausted or critical` : `${B.warningQuotas} quota${B.warningQuotas === 1 ? "" : "s"} approaching the limit`
728
- }), /* @__PURE__ */ k("p", {
727
+ children: [H.criticalQuotas > 0 || H.exhaustedQuotas > 0 ? /* @__PURE__ */ O(E, { className: `size-5 shrink-0 ${t.error.icon}` }) : /* @__PURE__ */ O(p, { className: `size-5 shrink-0 ${t.warning.icon}` }), /* @__PURE__ */ k("div", { children: [/* @__PURE__ */ O("p", {
728
+ className: `text-sm font-medium ${H.criticalQuotas > 0 || H.exhaustedQuotas > 0 ? t.error.text : t.warning.text}`,
729
+ children: H.criticalQuotas > 0 || H.exhaustedQuotas > 0 ? `${H.criticalQuotas + H.exhaustedQuotas} quota${H.criticalQuotas + H.exhaustedQuotas === 1 ? "" : "s"} exhausted or critical` : `${H.warningQuotas} quota${H.warningQuotas === 1 ? "" : "s"} approaching the limit`
730
+ }), /* @__PURE__ */ O("p", {
729
731
  className: "text-xs text-muted-foreground mt-0.5",
730
732
  children: "Contact support to request a quota increase for your plan."
731
733
  })] })]
732
- }), /* @__PURE__ */ k("button", {
734
+ }), /* @__PURE__ */ O("button", {
733
735
  type: "button",
734
- onClick: () => ue("/support/tickets"),
735
- className: `shrink-0 px-4 py-2 text-sm font-medium rounded-md border transition-colors ${B.criticalQuotas > 0 || B.exhaustedQuotas > 0 ? "bg-destructive text-destructive-foreground border-destructive hover:bg-destructive/90" : "border-status-warning-border text-status-warning-text hover:bg-status-warning-bg-subtle"}`,
736
+ onClick: () => B("/support/tickets"),
737
+ className: `shrink-0 px-4 py-2 text-sm font-medium rounded-md border transition-colors ${H.criticalQuotas > 0 || H.exhaustedQuotas > 0 ? "bg-destructive text-destructive-foreground border-destructive hover:bg-destructive/90" : "border-status-warning-border text-status-warning-text hover:bg-status-warning-bg-subtle"}`,
736
738
  children: "Request more quota"
737
739
  })]
738
740
  }),
739
- (Q || I !== "active") && /* @__PURE__ */ A("div", {
741
+ (Q || F !== "active") && /* @__PURE__ */ k("div", {
740
742
  className: "flex items-center gap-2 text-sm text-muted-foreground flex-wrap",
741
743
  children: [
742
- /* @__PURE__ */ A("span", { children: [
744
+ /* @__PURE__ */ k("span", { children: [
743
745
  "Showing",
744
746
  " ",
745
- Z.active.reduce((e, t) => e + t.aggregatedQuotas.length, 0) + Z.past.reduce((e, t) => e + t.aggregatedQuotas.length, 0) + (I === "past" ? 0 : J.length),
747
+ Z.active.reduce((e, t) => e + t.aggregatedQuotas.length, 0) + Z.past.reduce((e, t) => e + t.aggregatedQuotas.length, 0) + (F === "past" ? 0 : J.length),
746
748
  " ",
747
749
  "quotas"
748
750
  ] }),
749
- /* @__PURE__ */ A("span", {
751
+ /* @__PURE__ */ k("span", {
750
752
  className: "px-2 py-0.5 bg-primary/10 text-primary rounded text-xs capitalize",
751
- children: [I === "active" ? "Active" : I === "past" ? "Past" : "All", " subscriptions"]
753
+ children: [F === "active" ? "Active" : F === "past" ? "Past" : "All", " subscriptions"]
752
754
  }),
753
- N !== "all" && /* @__PURE__ */ k("span", {
755
+ M !== "all" && /* @__PURE__ */ O("span", {
754
756
  className: "px-2 py-0.5 bg-muted rounded text-xs capitalize",
755
- children: N === "critical" ? "Critical / Exhausted" : N
757
+ children: M === "critical" ? "Critical / Exhausted" : M
756
758
  }),
757
- x && /* @__PURE__ */ A("span", {
759
+ b && /* @__PURE__ */ k("span", {
758
760
  className: "px-2 py-0.5 bg-muted rounded text-xs",
759
761
  children: [
760
762
  "“",
761
- x,
763
+ b,
762
764
  "”"
763
765
  ]
764
766
  })
765
767
  ]
766
768
  }),
767
- Z.active.length > 0 && /* @__PURE__ */ A("section", { children: [/* @__PURE__ */ A("h2", {
769
+ Z.active.length > 0 && /* @__PURE__ */ k("section", { children: [/* @__PURE__ */ k("h2", {
768
770
  className: "text-lg font-semibold text-foreground mb-4 flex items-center gap-2",
769
- children: [/* @__PURE__ */ k(C, { className: "size-5 text-primary" }), I === "all" ? "Active Subscription Quotas" : "Subscription Quotas"]
770
- }), /* @__PURE__ */ k("div", {
771
+ children: [/* @__PURE__ */ O(S, { className: "size-5 text-primary" }), F === "all" ? "Active Subscription Quotas" : "Subscription Quotas"]
772
+ }), /* @__PURE__ */ O("div", {
771
773
  className: "space-y-4",
772
- children: Z.active.map((e) => /* @__PURE__ */ k(ne, {
774
+ children: Z.active.map((e) => /* @__PURE__ */ O(re, {
773
775
  subscription: e,
774
- onQuotaClick: y,
776
+ onQuotaClick: v,
775
777
  defaultExpanded: !0
776
778
  }, e.id))
777
779
  })] }),
778
- Z.past.length > 0 && /* @__PURE__ */ A("section", { children: [/* @__PURE__ */ A("h2", {
780
+ Z.past.length > 0 && /* @__PURE__ */ k("section", { children: [/* @__PURE__ */ k("h2", {
779
781
  className: "text-lg font-semibold text-foreground mb-4 flex items-center gap-2",
780
782
  children: [
781
- /* @__PURE__ */ k(b, { className: "size-5 text-muted-foreground" }),
783
+ /* @__PURE__ */ O(y, { className: "size-5 text-muted-foreground" }),
782
784
  "Past Subscription Quotas",
783
- /* @__PURE__ */ k("span", {
785
+ /* @__PURE__ */ O("span", {
784
786
  className: "text-xs font-normal text-muted-foreground",
785
787
  children: "(Canceled / Expired / Upgraded)"
786
788
  }),
787
- he > 0 && /* @__PURE__ */ A("span", {
789
+ me > 0 && /* @__PURE__ */ k("span", {
788
790
  className: "text-xs font-normal px-2 py-0.5 bg-muted rounded-full",
789
791
  children: [
790
792
  Z.past.length,
791
- pe ? "+" : "",
793
+ fe ? "+" : "",
792
794
  " of ",
793
- he
795
+ me
794
796
  ]
795
797
  })
796
798
  ]
797
- }), /* @__PURE__ */ A("div", {
799
+ }), /* @__PURE__ */ k("div", {
798
800
  className: "space-y-4",
799
- children: [Z.past.map((e) => /* @__PURE__ */ k(ne, {
801
+ children: [Z.past.map((e) => /* @__PURE__ */ O(re, {
800
802
  subscription: e,
801
- onQuotaClick: y,
802
- defaultExpanded: I === "past"
803
- }, e.id)), pe && /* @__PURE__ */ k("div", {
803
+ onQuotaClick: v,
804
+ defaultExpanded: F === "past"
805
+ }, e.id)), fe && /* @__PURE__ */ O("div", {
804
806
  className: "flex justify-center pt-2",
805
- children: /* @__PURE__ */ k("button", {
807
+ children: /* @__PURE__ */ O("button", {
806
808
  type: "button",
807
- onClick: fe,
808
- disabled: me,
809
+ onClick: de,
810
+ disabled: pe,
809
811
  className: "flex items-center gap-2 px-4 py-2 text-sm font-medium text-muted-foreground hover:text-foreground border border-border rounded-md hover:bg-muted/50 transition-colors disabled:opacity-50",
810
- children: me ? /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(w, { className: "size-4 animate-spin" }), "Loading…"] }) : /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(_, { className: "size-4" }), "Load more past subscriptions"] })
812
+ children: pe ? /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O(C, { className: "size-4 animate-spin" }), "Loading…"] }) : /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O(g, { className: "size-4" }), "Load more past subscriptions"] })
811
813
  })
812
814
  })]
813
815
  })] }),
814
- I !== "past" && J.length > 0 && /* @__PURE__ */ A("section", { children: [/* @__PURE__ */ A("h2", {
816
+ F !== "past" && J.length > 0 && /* @__PURE__ */ k("section", { children: [/* @__PURE__ */ k("h2", {
815
817
  className: "text-lg font-semibold text-foreground mb-4 flex items-center gap-2",
816
818
  children: [
817
- /* @__PURE__ */ k(S, { className: `size-5 ${t.info.icon}` }),
819
+ /* @__PURE__ */ O(x, { className: `size-5 ${t.info.icon}` }),
818
820
  "Pooled Quotas",
819
- /* @__PURE__ */ k("span", {
821
+ /* @__PURE__ */ O("span", {
820
822
  className: "text-xs font-normal text-muted-foreground",
821
823
  children: "(Shared across all products)"
822
824
  })
823
825
  ]
824
- }), /* @__PURE__ */ k(te, {
826
+ }), /* @__PURE__ */ O(ne, {
825
827
  quotas: J,
826
828
  showPlanColumn: !1,
827
- onQuotaClick: y
829
+ onQuotaClick: v
828
830
  })] }),
829
- I === "active" && H.length === 0 && V.length === 0 && !Q && /* @__PURE__ */ A("div", {
831
+ F === "active" && W.length === 0 && U.length === 0 && !Q && /* @__PURE__ */ k("div", {
830
832
  className: "flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg",
831
833
  children: [
832
- /* @__PURE__ */ k("div", {
834
+ /* @__PURE__ */ O("div", {
833
835
  className: "size-12 rounded-full bg-muted flex items-center justify-center mb-4",
834
- children: /* @__PURE__ */ k(S, { className: "size-6 text-muted-foreground" })
836
+ children: /* @__PURE__ */ O(x, { className: "size-6 text-muted-foreground" })
835
837
  }),
836
- /* @__PURE__ */ k("h3", {
838
+ /* @__PURE__ */ O("h3", {
837
839
  className: "text-lg font-medium text-foreground",
838
840
  children: "No active quotas found"
839
841
  }),
840
- /* @__PURE__ */ k("p", {
842
+ /* @__PURE__ */ O("p", {
841
843
  className: "text-sm text-muted-foreground mt-1 text-center max-w-sm",
842
844
  children: "Quotas will appear here once you have active subscriptions or pooled allocations."
843
845
  })
844
846
  ]
845
847
  }),
846
- I === "past" && U.length === 0 && !Q && !W && /* @__PURE__ */ A("div", {
848
+ F === "past" && G.length === 0 && !Q && !K && /* @__PURE__ */ k("div", {
847
849
  className: "flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg",
848
850
  children: [
849
- /* @__PURE__ */ k("div", {
851
+ /* @__PURE__ */ O("div", {
850
852
  className: "size-12 rounded-full bg-muted flex items-center justify-center mb-4",
851
- children: /* @__PURE__ */ k(b, { className: "size-6 text-muted-foreground" })
853
+ children: /* @__PURE__ */ O(y, { className: "size-6 text-muted-foreground" })
852
854
  }),
853
- /* @__PURE__ */ k("h3", {
855
+ /* @__PURE__ */ O("h3", {
854
856
  className: "text-lg font-medium text-foreground",
855
857
  children: "No past subscriptions"
856
858
  }),
857
- /* @__PURE__ */ k("p", {
859
+ /* @__PURE__ */ O("p", {
858
860
  className: "text-sm text-muted-foreground mt-1 text-center max-w-sm",
859
861
  children: "You don't have any canceled, expired, or upgraded subscriptions yet."
860
862
  }),
861
- /* @__PURE__ */ k("button", {
863
+ /* @__PURE__ */ O("button", {
862
864
  type: "button",
863
- onClick: () => L("active"),
865
+ onClick: () => I("active"),
864
866
  className: "mt-4 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors",
865
867
  children: "View active subscriptions"
866
868
  })
867
869
  ]
868
870
  }),
869
- I === "past" && W && /* @__PURE__ */ k("div", {
871
+ F === "past" && K && /* @__PURE__ */ O("div", {
870
872
  className: "space-y-4",
871
873
  children: [
872
874
  1,
873
875
  2,
874
876
  3
875
- ].map((e) => /* @__PURE__ */ k("div", { className: "h-24 bg-muted animate-pulse rounded-lg" }, e))
877
+ ].map((e) => /* @__PURE__ */ O("div", { className: "h-24 bg-muted animate-pulse rounded-lg" }, e))
876
878
  }),
877
- Q && Z.active.length === 0 && Z.past.length === 0 && (I === "past" || J.length === 0) && /* @__PURE__ */ A("div", {
879
+ Q && Z.active.length === 0 && Z.past.length === 0 && (F === "past" || J.length === 0) && /* @__PURE__ */ k("div", {
878
880
  className: "flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg",
879
881
  children: [
880
- /* @__PURE__ */ k("div", {
882
+ /* @__PURE__ */ O("div", {
881
883
  className: "size-12 rounded-full bg-muted flex items-center justify-center mb-4",
882
- children: N !== "all" && !x ? /* @__PURE__ */ k(j, {
883
- status: N === "healthy" ? "HEALTHY" : N === "warning" ? "WARNING" : "CRITICAL",
884
+ children: M !== "all" && !b ? /* @__PURE__ */ O(A, {
885
+ status: M === "healthy" ? "HEALTHY" : M === "warning" ? "WARNING" : "CRITICAL",
884
886
  className: "size-6"
885
- }) : /* @__PURE__ */ k(T, { className: "size-6 text-muted-foreground" })
887
+ }) : /* @__PURE__ */ O(w, { className: "size-6 text-muted-foreground" })
886
888
  }),
887
- /* @__PURE__ */ k("h3", {
889
+ /* @__PURE__ */ O("h3", {
888
890
  className: "text-lg font-medium text-foreground",
889
- children: N !== "all" && !x ? `No ${N === "critical" ? "critical or exhausted" : N} quotas` : "No matching quotas"
891
+ children: M !== "all" && !b ? `No ${M === "critical" ? "critical or exhausted" : M} quotas` : "No matching quotas"
890
892
  }),
891
- /* @__PURE__ */ k("p", {
893
+ /* @__PURE__ */ O("p", {
892
894
  className: "text-sm text-muted-foreground mt-1 text-center max-w-sm",
893
- children: N !== "all" && !x ? /* @__PURE__ */ A(O, { children: ["All your quotas are in a different status.", B && /* @__PURE__ */ A("span", {
895
+ children: M !== "all" && !b ? /* @__PURE__ */ k(D, { children: ["All your quotas are in a different status.", H && /* @__PURE__ */ k("span", {
894
896
  className: "block mt-1",
895
897
  children: [
896
898
  "You have ",
897
- B.healthyQuotas,
899
+ H.healthyQuotas,
898
900
  " healthy, ",
899
- B.warningQuotas,
901
+ H.warningQuotas,
900
902
  " warning, and ",
901
- B.criticalQuotas + B.exhaustedQuotas,
903
+ H.criticalQuotas + H.exhaustedQuotas,
902
904
  " critical quotas."
903
905
  ]
904
- })] }) : /* @__PURE__ */ A(O, { children: [
906
+ })] }) : /* @__PURE__ */ k(D, { children: [
905
907
  "No quotas match your current search or filter criteria in",
906
908
  " ",
907
- I === "past" ? "past" : I === "all" ? "any" : "active",
909
+ F === "past" ? "past" : F === "all" ? "any" : "active",
908
910
  " ",
909
911
  "subscriptions.",
910
- I === "active" && !N.includes("all") && /* @__PURE__ */ k("span", {
912
+ F === "active" && !M.includes("all") && /* @__PURE__ */ O("span", {
911
913
  className: "block mt-1",
912
914
  children: "Try switching to “Past” or “All” to search across more subscriptions."
913
915
  })
914
916
  ] })
915
917
  }),
916
- /* @__PURE__ */ A("div", {
918
+ /* @__PURE__ */ k("div", {
917
919
  className: "flex gap-2 mt-4",
918
- children: [/* @__PURE__ */ k("button", {
920
+ children: [/* @__PURE__ */ O("button", {
919
921
  type: "button",
920
- onClick: _e,
922
+ onClick: ge,
921
923
  className: "px-4 py-2 text-sm font-medium border border-border rounded-md hover:bg-muted/50 transition-colors",
922
- children: N === "all" ? "Clear filters" : "Show all quotas"
923
- }), I === "active" && x && /* @__PURE__ */ k("button", {
924
+ children: M === "all" ? "Clear filters" : "Show all quotas"
925
+ }), F === "active" && b && /* @__PURE__ */ O("button", {
924
926
  type: "button",
925
- onClick: () => L("all"),
927
+ onClick: () => I("all"),
926
928
  className: "px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors",
927
929
  children: "Search all"
928
930
  })]
929
931
  })
930
932
  ]
931
933
  }),
932
- v && /* @__PURE__ */ k(re, {
933
- quota: v,
934
- onClose: () => y(null)
934
+ _ && /* @__PURE__ */ O(ie, {
935
+ quota: _,
936
+ onClose: () => v(null)
935
937
  })
936
938
  ]
937
939
  });
938
940
  };
939
941
  //#endregion
940
- export { I as UsagePage };
942
+ export { F as UsagePage };
941
943
 
942
944
  //# sourceMappingURL=UsagePage.js.map