@burdenoff/microfe-billing 2026.907.2 → 2026.909.2

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.
@@ -5,36 +5,79 @@ import { formatCurrency as n, formatDate as r, formatInvoiceNumber as i, formatI
5
5
  import { getInvoiceStatusColor as o } from "../../../shared/utils/status.js";
6
6
  import { useBillingPermissions as s } from "../../../hooks/useBillingPermissions.js";
7
7
  import { useGetBillingAccountsByOrgQuery as c } from "../../../../generated/global-operations.js";
8
- import { useBillingNavigate as l } from "../../../hooks/useBillingNavigate.js";
9
- import { withBillingAccountId as u } from "../../../shared/utils/navigation.js";
10
- import { usePaginatedInvoices as d } from "../hooks/useInvoices.js";
11
- import { useEffect as f, useMemo as p, useRef as m, useState as h } from "react";
12
- import { RotateCcw as g } from "lucide-react";
13
- import { useSearchParams as _ } from "react-router";
14
- import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
15
- import { IllustratedEmptyState as x, PagePurpose as S } from "@burdenoff/fe-libs/ui";
8
+ import { nativeConfirm as l, nativeImpact as u, nativeNotify as d } from "../../../../utils/nativeBridge.js";
9
+ import { useBillingNavigate as f } from "../../../hooks/useBillingNavigate.js";
10
+ import { withBillingAccountId as p } from "../../../shared/utils/navigation.js";
11
+ import { useInvoiceMutations as m, usePaginatedInvoices as h } from "../hooks/useInvoices.js";
12
+ import { useCallback as g, useEffect as _, useMemo as v, useRef as y, useState as b } from "react";
13
+ import { RotateCcw as x } from "lucide-react";
14
+ import { useSearchParams as S } from "react-router";
15
+ import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
16
+ import { IllustratedEmptyState as E, PagePurpose as D } from "@burdenoff/fe-libs/ui";
16
17
  //#region src/billing/modules/billing/pages/InvoicesListPage.tsx
17
- var C = () => {
18
- let t = e(), n = l(), r = s(), [i] = _(), o = i.get("billingAccountId") ?? void 0, { data: C } = c({ fetchPolicy: "cache-first" }), T = p(() => C?.getBillingAccountsByOrg ?? [], [C]), [E, D] = h(o);
19
- f(() => {
20
- D(o);
18
+ var O = () => {
19
+ let t = e(), n = f(), r = s(), [i] = S(), o = i.get("billingAccountId") ?? void 0, { data: l } = c({ fetchPolicy: "cache-first" }), u = v(() => l?.getBillingAccountsByOrg ?? [], [l]), { payInvoice: O, voidInvoice: A } = m(), [j, M] = b(null), [N, P] = b(null), [F, I] = b(o);
20
+ _(() => {
21
+ I(o);
21
22
  }, [o]);
22
- let O = p(() => (T.find((e) => e.isDefault) ?? T[0])?.id ?? void 0, [T]), k = E === void 0 ? O ?? null : E, [A, j] = h("all"), [M, N] = h(""), [P, F] = h(""), [I, L] = h(1), R = m(null);
23
- f(() => (R.current && clearTimeout(R.current), R.current = setTimeout(() => {
24
- F(M), L(1);
23
+ let L = v(() => (u.find((e) => e.isDefault) ?? u[0])?.id ?? void 0, [u]), R = F === void 0 ? L ?? null : F, [z, B] = b("all"), [V, H] = b(""), [U, W] = b(""), [G, K] = b(1), q = y(null);
24
+ _(() => (q.current && clearTimeout(q.current), q.current = setTimeout(() => {
25
+ W(V), K(1);
25
26
  }, 400), () => {
26
- R.current && clearTimeout(R.current);
27
- }), [M]);
28
- let { invoices: z, totalPages: B, isLoading: V, error: H, refetch: U } = d({
29
- billingAccountId: k ?? void 0,
30
- status: A === "all" ? void 0 : A,
31
- search: P || void 0,
32
- page: I,
27
+ q.current && clearTimeout(q.current);
28
+ }), [V]);
29
+ let { invoices: J, totalPages: Y, isLoading: X, error: Z, refetch: Q } = h({
30
+ billingAccountId: R ?? void 0,
31
+ status: z === "all" ? void 0 : z,
32
+ search: U || void 0,
33
+ page: G,
33
34
  pageSize: 20
34
- });
35
- return r.canViewInvoices ? V && z.length === 0 ? /* @__PURE__ */ b("div", {
35
+ }), $ = g(async (e) => {
36
+ let t = e.billingAccountId, n = t ? u.find((e) => e.id === t)?.defaultPaymentMethod : void 0;
37
+ if (!t) {
38
+ M("No billing account context");
39
+ return;
40
+ }
41
+ if (!n) {
42
+ M("Add and set a default payment method before paying this invoice.");
43
+ return;
44
+ }
45
+ M(null), P({
46
+ invoiceId: e.id,
47
+ action: "pay"
48
+ });
49
+ try {
50
+ await O(e.id, n, t), await Q(), d("success");
51
+ } catch (e) {
52
+ M(e instanceof Error ? e.message : "Failed to pay invoice"), d("error");
53
+ } finally {
54
+ P(null);
55
+ }
56
+ }, [
57
+ u,
58
+ O,
59
+ Q
60
+ ]), ee = g(async (e) => {
61
+ let t = e.billingAccountId;
62
+ if (!t) {
63
+ M("No billing account context");
64
+ return;
65
+ }
66
+ M(null), P({
67
+ invoiceId: e.id,
68
+ action: "void"
69
+ });
70
+ try {
71
+ await A(e.id, t), await Q(), d("success");
72
+ } catch (e) {
73
+ M(e instanceof Error ? e.message : "Failed to void invoice"), d("error");
74
+ } finally {
75
+ P(null);
76
+ }
77
+ }, [Q, A]);
78
+ return r.canViewInvoices ? X && J.length === 0 ? /* @__PURE__ */ T("div", {
36
79
  className: "space-y-6 p-6",
37
- children: [/* @__PURE__ */ y("div", { className: "h-8 w-48 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ y("div", {
80
+ children: [/* @__PURE__ */ w("div", { className: "h-8 w-48 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ w("div", {
38
81
  className: "space-y-3",
39
82
  children: [
40
83
  1,
@@ -42,30 +85,30 @@ var C = () => {
42
85
  3,
43
86
  4,
44
87
  5
45
- ].map((e) => /* @__PURE__ */ y("div", {
88
+ ].map((e) => /* @__PURE__ */ w("div", {
46
89
  className: "border border-border-subtle rounded-lg p-4",
47
- children: /* @__PURE__ */ b("div", {
90
+ children: /* @__PURE__ */ T("div", {
48
91
  className: "flex items-center gap-4",
49
- children: [/* @__PURE__ */ y("div", { className: "size-10 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ b("div", {
92
+ children: [/* @__PURE__ */ w("div", { className: "size-10 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ T("div", {
50
93
  className: "flex-1 space-y-2",
51
- children: [/* @__PURE__ */ y("div", { className: "h-4 w-32 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ y("div", { className: "h-3 w-48 bg-bg-sunken animate-pulse rounded" })]
94
+ children: [/* @__PURE__ */ w("div", { className: "h-4 w-32 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ w("div", { className: "h-3 w-48 bg-bg-sunken animate-pulse rounded" })]
52
95
  })]
53
96
  })
54
97
  }, e))
55
98
  })]
56
- }) : H ? /* @__PURE__ */ y("div", {
99
+ }) : Z ? /* @__PURE__ */ w("div", {
57
100
  className: "flex items-center justify-center h-full min-h-[400px]",
58
- children: /* @__PURE__ */ b("div", {
101
+ children: /* @__PURE__ */ T("div", {
59
102
  className: "text-center space-y-4",
60
103
  children: [
61
- /* @__PURE__ */ y("div", {
104
+ /* @__PURE__ */ w("div", {
62
105
  className: "size-12 mx-auto rounded-full bg-status-error-bg-subtle flex items-center justify-center",
63
- children: /* @__PURE__ */ y("svg", {
106
+ children: /* @__PURE__ */ w("svg", {
64
107
  className: "size-6 text-status-error-text",
65
108
  fill: "none",
66
109
  viewBox: "0 0 24 24",
67
110
  stroke: "currentColor",
68
- children: /* @__PURE__ */ y("path", {
111
+ children: /* @__PURE__ */ w("path", {
69
112
  strokeLinecap: "round",
70
113
  strokeLinejoin: "round",
71
114
  strokeWidth: 2,
@@ -73,60 +116,60 @@ var C = () => {
73
116
  })
74
117
  })
75
118
  }),
76
- /* @__PURE__ */ y("h2", {
119
+ /* @__PURE__ */ w("h2", {
77
120
  className: "text-lg font-semibold text-text-primary",
78
121
  children: t("billing.invoices.failedToLoad", "Failed to load invoices")
79
122
  }),
80
- /* @__PURE__ */ y("p", {
123
+ /* @__PURE__ */ w("p", {
81
124
  className: "text-sm text-text-secondary",
82
- children: H.message
125
+ children: Z.message
83
126
  }),
84
- /* @__PURE__ */ y("button", {
127
+ /* @__PURE__ */ w("button", {
85
128
  type: "button",
86
- onClick: () => U(),
129
+ onClick: () => Q(),
87
130
  className: "px-4 py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors",
88
131
  children: t("billing.common.tryAgain", "Try Again")
89
132
  })
90
133
  ]
91
134
  })
92
- }) : /* @__PURE__ */ b("div", {
135
+ }) : /* @__PURE__ */ T("div", {
93
136
  className: "space-y-6 px-6 lg:px-8 py-6",
94
137
  children: [
95
- /* @__PURE__ */ b("div", {
138
+ /* @__PURE__ */ T("div", {
96
139
  className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
97
- children: [/* @__PURE__ */ b("div", { children: [
98
- /* @__PURE__ */ y("h1", {
140
+ children: [/* @__PURE__ */ T("div", { children: [
141
+ /* @__PURE__ */ w("h1", {
99
142
  className: "text-2xl md:text-3xl font-semibold tracking-tight text-text-primary",
100
143
  children: t("billing.invoices.title", "Invoices")
101
144
  }),
102
- /* @__PURE__ */ y("p", {
145
+ /* @__PURE__ */ w("p", {
103
146
  className: "text-sm text-text-secondary mt-1",
104
147
  children: t("billing.invoices.subtitle", "View and manage your billing invoices")
105
148
  }),
106
- /* @__PURE__ */ y(S, {
149
+ /* @__PURE__ */ w(D, {
107
150
  className: "mt-3",
108
151
  children: t("billing.invoices.purpose", "A record of everything you have been billed for — subscriptions, add-ons and one-off charges. Open an invoice to see line items, download the PDF, pay an outstanding amount, or request a refund.")
109
152
  })
110
- ] }), /* @__PURE__ */ b("div", {
153
+ ] }), /* @__PURE__ */ T("div", {
111
154
  className: "flex items-center gap-3",
112
- children: [/* @__PURE__ */ b("button", {
155
+ children: [/* @__PURE__ */ T("button", {
113
156
  type: "button",
114
157
  onClick: () => n("/refunds"),
115
158
  className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium border border-border-subtle text-text-primary rounded-button hover:bg-bg-sunken hover:border-border-strong transition-all duration-200",
116
- children: [/* @__PURE__ */ y(g, { className: "size-4" }), t("billing.invoices.myRefunds", "My Refunds")]
117
- }), T.length > 1 && /* @__PURE__ */ b("div", {
159
+ children: [/* @__PURE__ */ w(x, { className: "size-4" }), t("billing.invoices.myRefunds", "My Refunds")]
160
+ }), u.length > 1 && /* @__PURE__ */ T("div", {
118
161
  className: "flex items-center gap-2",
119
- children: [/* @__PURE__ */ y("label", {
162
+ children: [/* @__PURE__ */ w("label", {
120
163
  className: "text-sm text-text-secondary whitespace-nowrap",
121
164
  children: t("billing.invoices.billingAccountLabel", "Billing Account")
122
- }), /* @__PURE__ */ b("select", {
123
- value: k ?? "",
124
- onChange: (e) => D(e.target.value || null),
165
+ }), /* @__PURE__ */ T("select", {
166
+ value: R ?? "",
167
+ onChange: (e) => I(e.target.value || null),
125
168
  className: "text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
126
- children: [/* @__PURE__ */ y("option", {
169
+ children: [/* @__PURE__ */ w("option", {
127
170
  value: "",
128
171
  children: t("billing.invoices.allAccounts", "All Accounts")
129
- }), T.map((e) => /* @__PURE__ */ b("option", {
172
+ }), u.map((e) => /* @__PURE__ */ T("option", {
130
173
  value: e.id ?? "",
131
174
  children: [e.name ?? e.email ?? e.id, e.isDefault ? t("billing.invoices.defaultSuffix", " (Default)") : ""]
132
175
  }, e.id ?? ""))]
@@ -134,9 +177,9 @@ var C = () => {
134
177
  })]
135
178
  })]
136
179
  }),
137
- /* @__PURE__ */ b("div", {
180
+ /* @__PURE__ */ T("div", {
138
181
  className: "flex flex-wrap items-center gap-4 pb-4 border-b border-border-subtle",
139
- children: [/* @__PURE__ */ y("div", {
182
+ children: [/* @__PURE__ */ w("div", {
140
183
  className: "inline-flex rounded-lg border border-border-subtle p-1 bg-bg-sunken flex-wrap",
141
184
  children: [
142
185
  "all",
@@ -144,127 +187,138 @@ var C = () => {
144
187
  "PAID",
145
188
  "DRAFT",
146
189
  "VOID"
147
- ].map((e) => /* @__PURE__ */ y("button", {
190
+ ].map((e) => /* @__PURE__ */ w("button", {
148
191
  type: "button",
149
192
  onClick: () => {
150
- j(e), L(1);
193
+ B(e), K(1);
151
194
  },
152
- className: `px-3 py-1.5 text-sm font-medium rounded-button transition-colors ${A === e ? "bg-bg-surface text-text-primary shadow-sm" : "text-text-secondary hover:text-text-primary"}`,
195
+ className: `px-3 py-1.5 text-sm font-medium rounded-button transition-colors ${z === e ? "bg-bg-surface text-text-primary shadow-sm" : "text-text-secondary hover:text-text-primary"}`,
153
196
  children: e === "all" ? "All" : a(e)
154
197
  }, e))
155
- }), /* @__PURE__ */ b("div", {
198
+ }), /* @__PURE__ */ T("div", {
156
199
  className: "relative flex-1 min-w-0 w-full sm:max-w-md",
157
- children: [/* @__PURE__ */ y("svg", {
200
+ children: [/* @__PURE__ */ w("svg", {
158
201
  className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-text-secondary",
159
202
  fill: "none",
160
203
  viewBox: "0 0 24 24",
161
204
  stroke: "currentColor",
162
- children: /* @__PURE__ */ y("path", {
205
+ children: /* @__PURE__ */ w("path", {
163
206
  strokeLinecap: "round",
164
207
  strokeLinejoin: "round",
165
208
  strokeWidth: 2,
166
209
  d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
167
210
  })
168
- }), /* @__PURE__ */ y("input", {
211
+ }), /* @__PURE__ */ w("input", {
169
212
  type: "text",
170
213
  placeholder: t("billing.invoices.searchPlaceholder", "Search by invoice number..."),
171
- value: M,
172
- onChange: (e) => N(e.target.value),
214
+ value: V,
215
+ onChange: (e) => H(e.target.value),
173
216
  className: "w-full pl-[3.25rem] pr-4 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] focus:border-transparent"
174
217
  })]
175
218
  })]
176
219
  }),
177
- !V && z.length === 0 ? /* @__PURE__ */ y(x, {
178
- illustration: A !== "all" || P ? "empty-search" : "empty-files",
220
+ j && /* @__PURE__ */ w("div", {
221
+ className: "rounded-button border border-status-error-border bg-status-error-bg-subtle p-3",
222
+ children: /* @__PURE__ */ w("p", {
223
+ className: "text-sm text-status-error-text",
224
+ children: j
225
+ })
226
+ }),
227
+ !X && J.length === 0 ? /* @__PURE__ */ w(E, {
228
+ illustration: z !== "all" || U ? "empty-search" : "empty-files",
179
229
  title: t("billing.invoices.noInvoicesFound", "No invoices found"),
180
- description: A !== "all" || P ? t("billing.invoices.noInvoicesFiltered", "No invoices match your filters.") : t("billing.invoices.noInvoicesYet", "You don't have any invoices yet.")
181
- }) : /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ y("div", {
230
+ description: z !== "all" || U ? t("billing.invoices.noInvoicesFiltered", "No invoices match your filters.") : t("billing.invoices.noInvoicesYet", "You don't have any invoices yet.")
231
+ }) : /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w("div", {
182
232
  className: "border border-border-seam rounded-card bg-bg-surface shadow-elevation-1 overflow-hidden",
183
- children: /* @__PURE__ */ b("table", {
233
+ children: /* @__PURE__ */ T("table", {
184
234
  className: "w-full",
185
- children: [/* @__PURE__ */ y("thead", {
235
+ children: [/* @__PURE__ */ w("thead", {
186
236
  className: "bg-bg-sunken",
187
- children: /* @__PURE__ */ b("tr", { children: [
188
- /* @__PURE__ */ y("th", {
237
+ children: /* @__PURE__ */ T("tr", { children: [
238
+ /* @__PURE__ */ w("th", {
189
239
  className: "text-left px-4 py-3 text-xs font-medium uppercase tracking-wide text-text-muted",
190
240
  children: t("billing.invoices.invoice", "Invoice")
191
241
  }),
192
- /* @__PURE__ */ y("th", {
242
+ /* @__PURE__ */ w("th", {
193
243
  className: "text-left px-4 py-3 text-xs font-medium uppercase tracking-wide text-text-muted",
194
244
  children: t("billing.common.status", "Status")
195
245
  }),
196
- !k && T.length > 1 && /* @__PURE__ */ y("th", {
246
+ !R && u.length > 1 && /* @__PURE__ */ w("th", {
197
247
  className: "text-left px-4 py-3 text-xs font-medium uppercase tracking-wide text-text-muted hidden lg:table-cell",
198
248
  children: t("billing.common.account", "Account")
199
249
  }),
200
- /* @__PURE__ */ y("th", {
250
+ /* @__PURE__ */ w("th", {
201
251
  className: "text-left px-4 py-3 text-xs font-medium uppercase tracking-wide text-text-muted hidden sm:table-cell",
202
252
  children: t("billing.common.date", "Date")
203
253
  }),
204
- /* @__PURE__ */ y("th", {
254
+ /* @__PURE__ */ w("th", {
205
255
  className: "text-left px-4 py-3 text-xs font-medium uppercase tracking-wide text-text-muted hidden md:table-cell",
206
256
  children: t("billing.common.dueDate", "Due Date")
207
257
  }),
208
- /* @__PURE__ */ y("th", {
258
+ /* @__PURE__ */ w("th", {
209
259
  className: "text-right px-4 py-3 text-xs font-medium uppercase tracking-wide text-text-muted",
210
260
  children: t("billing.common.amount", "Amount")
211
261
  }),
212
- /* @__PURE__ */ y("th", {
262
+ /* @__PURE__ */ w("th", {
213
263
  className: "text-right px-4 py-3 text-xs font-medium uppercase tracking-wide text-text-muted",
214
264
  children: t("billing.common.actions", "Actions")
215
265
  })
216
266
  ] })
217
- }), /* @__PURE__ */ y("tbody", {
267
+ }), /* @__PURE__ */ w("tbody", {
218
268
  className: "divide-y divide-border-subtle",
219
- children: z.map((e) => /* @__PURE__ */ y(w, {
269
+ children: J.map((e) => /* @__PURE__ */ w(k, {
220
270
  invoice: e,
221
- onView: () => n(u(`/invoices/${e.id}`, e.billingAccountId)),
271
+ onView: () => n(p(`/invoices/${e.id}`, e.billingAccountId)),
222
272
  canPay: r.canPayInvoice,
223
273
  canVoid: r.canVoidInvoice,
224
- showAccount: !k && T.length > 1,
225
- accountName: T.find((t) => t.id === e.billingAccountId)?.name ?? null
274
+ onPay: $,
275
+ onVoid: ee,
276
+ isProcessing: N?.invoiceId === e.id,
277
+ processingAction: N?.invoiceId === e.id ? N.action : void 0,
278
+ showAccount: !R && u.length > 1,
279
+ accountName: u.find((t) => t.id === e.billingAccountId)?.name ?? null
226
280
  }, e.id))
227
281
  })]
228
282
  })
229
- }), B > 1 && /* @__PURE__ */ b("div", {
283
+ }), Y > 1 && /* @__PURE__ */ T("div", {
230
284
  className: "flex items-center justify-between pt-2",
231
- children: [/* @__PURE__ */ y("p", {
285
+ children: [/* @__PURE__ */ w("p", {
232
286
  className: "text-sm text-text-secondary",
233
287
  children: t("billing.common.pageOf", "Page {{page}} of {{totalPages}}", {
234
- page: I,
235
- totalPages: B
288
+ page: G,
289
+ totalPages: Y
236
290
  })
237
- }), /* @__PURE__ */ b("div", {
291
+ }), /* @__PURE__ */ T("div", {
238
292
  className: "flex items-center gap-2",
239
- children: [/* @__PURE__ */ y("button", {
293
+ children: [/* @__PURE__ */ w("button", {
240
294
  type: "button",
241
- onClick: () => L((e) => Math.max(1, e - 1)),
242
- disabled: I <= 1,
295
+ onClick: () => K((e) => Math.max(1, e - 1)),
296
+ disabled: G <= 1,
243
297
  className: "px-3 py-1.5 text-sm font-medium border border-border-subtle rounded-button bg-bg-surface text-text-primary hover:bg-bg-sunken disabled:opacity-40 disabled:cursor-not-allowed transition-colors",
244
298
  children: t("billing.common.previous", "Previous")
245
- }), /* @__PURE__ */ y("button", {
299
+ }), /* @__PURE__ */ w("button", {
246
300
  type: "button",
247
- onClick: () => L((e) => Math.min(B, e + 1)),
248
- disabled: I >= B,
301
+ onClick: () => K((e) => Math.min(Y, e + 1)),
302
+ disabled: G >= Y,
249
303
  className: "px-3 py-1.5 text-sm font-medium border border-border-subtle rounded-button bg-bg-surface text-text-primary hover:bg-bg-sunken disabled:opacity-40 disabled:cursor-not-allowed transition-colors",
250
304
  children: t("billing.common.next", "Next")
251
305
  })]
252
306
  })]
253
307
  })] })
254
308
  ]
255
- }) : /* @__PURE__ */ y("div", {
309
+ }) : /* @__PURE__ */ w("div", {
256
310
  className: "flex items-center justify-center h-full min-h-[400px]",
257
- children: /* @__PURE__ */ b("div", {
311
+ children: /* @__PURE__ */ T("div", {
258
312
  className: "text-center space-y-2",
259
313
  children: [
260
- /* @__PURE__ */ y("div", {
314
+ /* @__PURE__ */ w("div", {
261
315
  className: "size-12 mx-auto rounded-full bg-bg-sunken flex items-center justify-center",
262
- children: /* @__PURE__ */ y("svg", {
316
+ children: /* @__PURE__ */ w("svg", {
263
317
  className: "size-6 text-text-secondary",
264
318
  fill: "none",
265
319
  viewBox: "0 0 24 24",
266
320
  stroke: "currentColor",
267
- children: /* @__PURE__ */ y("path", {
321
+ children: /* @__PURE__ */ w("path", {
268
322
  strokeLinecap: "round",
269
323
  strokeLinejoin: "round",
270
324
  strokeWidth: 2,
@@ -272,103 +326,146 @@ var C = () => {
272
326
  })
273
327
  })
274
328
  }),
275
- /* @__PURE__ */ y("h2", {
329
+ /* @__PURE__ */ w("h2", {
276
330
  className: "text-lg font-semibold text-text-primary",
277
331
  children: t("billing.accessDenied.title", "Access Denied")
278
332
  }),
279
- /* @__PURE__ */ y("p", {
333
+ /* @__PURE__ */ w("p", {
280
334
  className: "text-sm text-text-secondary max-w-sm",
281
335
  children: t("billing.invoices.noViewPermission", "You don't have permission to view invoices.")
282
336
  })
283
337
  ]
284
338
  })
285
339
  });
286
- }, w = ({ invoice: s, onView: c, canPay: l, canVoid: u, showAccount: d = !1, accountName: f }) => {
287
- let p = e(), m = o(s.status), h = s.status === "OPEN", g = s.status === "DRAFT";
288
- return /* @__PURE__ */ b("tr", {
340
+ }, k = ({ invoice: s, onView: c, onPay: d, onVoid: f, canPay: p, canVoid: m, isProcessing: h, processingAction: g, showAccount: _ = !1, accountName: v }) => {
341
+ let y = e(), [x, S] = b(!1), C = o(s.status), E = s.status === "OPEN", D = s.status === "DRAFT", O = async () => {
342
+ u("medium");
343
+ let e = await l({
344
+ title: "Void invoice",
345
+ message: "Are you sure you want to void this invoice?",
346
+ okButtonTitle: "Void",
347
+ cancelButtonTitle: "Cancel"
348
+ });
349
+ e === !0 ? await f(s) : e === null && S(!0);
350
+ }, k = async () => {
351
+ await f(s), S(!1);
352
+ }, A = s.metadata?.invoicePdfBackupUrl;
353
+ return /* @__PURE__ */ T("tr", {
289
354
  className: "hover:bg-bg-sunken transition-colors",
290
355
  children: [
291
- /* @__PURE__ */ b("td", {
356
+ /* @__PURE__ */ T("td", {
292
357
  className: "p-4",
293
- children: [s.invoiceUrl ? /* @__PURE__ */ y("a", {
358
+ children: [s.invoiceUrl ? /* @__PURE__ */ w("a", {
294
359
  href: s.invoiceUrl,
295
360
  target: "_blank",
296
361
  rel: "noopener noreferrer",
297
362
  className: "font-medium text-text-primary hover:text-text-link transition-colors",
298
363
  children: i(s.invoiceNumber)
299
- }) : /* @__PURE__ */ y("button", {
364
+ }) : /* @__PURE__ */ w("button", {
300
365
  type: "button",
301
366
  onClick: c,
302
367
  className: "font-medium text-text-primary hover:text-text-link transition-colors",
303
368
  children: i(s.invoiceNumber)
304
- }), (s.itemDescription ?? s.subscription?.plan?.name) && /* @__PURE__ */ y("p", {
369
+ }), (s.itemDescription ?? s.subscription?.plan?.name) && /* @__PURE__ */ w("p", {
305
370
  className: "text-sm text-text-secondary mt-0.5",
306
371
  children: s.itemDescription ?? s.subscription?.plan?.name
307
372
  })]
308
373
  }),
309
- /* @__PURE__ */ y("td", {
374
+ /* @__PURE__ */ w("td", {
310
375
  className: "p-4",
311
- children: /* @__PURE__ */ y(t, {
312
- status: m,
376
+ children: /* @__PURE__ */ w(t, {
377
+ status: C,
313
378
  dot: !0,
314
379
  children: a(s.status)
315
380
  })
316
381
  }),
317
- d && /* @__PURE__ */ y("td", {
382
+ _ && /* @__PURE__ */ w("td", {
318
383
  className: "p-4 hidden lg:table-cell",
319
- children: f ? /* @__PURE__ */ y("span", {
384
+ children: v ? /* @__PURE__ */ w("span", {
320
385
  className: "inline-flex items-center px-2 py-0.5 text-xs font-medium rounded-full bg-bg-sunken text-text-secondary border border-border-subtle",
321
- children: f
322
- }) : /* @__PURE__ */ y("span", {
386
+ children: v
387
+ }) : /* @__PURE__ */ w("span", {
323
388
  className: "text-sm text-text-secondary",
324
389
  children: ", "
325
390
  })
326
391
  }),
327
- /* @__PURE__ */ y("td", {
392
+ /* @__PURE__ */ w("td", {
328
393
  className: "p-4 text-sm text-text-secondary hidden sm:table-cell",
329
394
  children: r(s.createdAt, "short")
330
395
  }),
331
- /* @__PURE__ */ y("td", {
396
+ /* @__PURE__ */ w("td", {
332
397
  className: "p-4 text-sm text-text-secondary hidden md:table-cell",
333
398
  children: s.dueDate ? r(s.dueDate, "short") : "—"
334
399
  }),
335
- /* @__PURE__ */ y("td", {
400
+ /* @__PURE__ */ w("td", {
336
401
  className: "p-4 text-right font-medium text-text-primary",
337
402
  children: n(s.total, s.currency)
338
403
  }),
339
- /* @__PURE__ */ y("td", {
404
+ /* @__PURE__ */ w("td", {
340
405
  className: "p-4 text-right",
341
- children: /* @__PURE__ */ b("div", {
342
- className: "flex items-center justify-end gap-2",
406
+ children: /* @__PURE__ */ T("div", {
407
+ className: "relative flex items-center justify-end gap-2",
343
408
  children: [
344
- s.invoiceUrl ? /* @__PURE__ */ y("a", {
409
+ s.invoiceUrl ? /* @__PURE__ */ w("a", {
345
410
  href: s.invoiceUrl,
346
411
  target: "_blank",
347
412
  rel: "noopener noreferrer",
348
413
  className: "px-3 py-1.5 text-sm font-medium text-text-primary hover:bg-bg-sunken rounded-button transition-colors duration-200",
349
- children: p("billing.common.view", "View")
350
- }) : /* @__PURE__ */ y("button", {
414
+ children: y("billing.common.view", "View")
415
+ }) : /* @__PURE__ */ w("button", {
351
416
  type: "button",
352
417
  onClick: c,
353
418
  className: "px-3 py-1.5 text-sm font-medium text-text-primary hover:bg-bg-sunken rounded-button transition-colors duration-200",
354
- children: p("billing.common.view", "View")
419
+ children: y("billing.common.view", "View")
355
420
  }),
356
- s.pdfUrl && /* @__PURE__ */ y("a", {
421
+ s.pdfUrl && /* @__PURE__ */ w("a", {
357
422
  href: s.pdfUrl,
358
423
  target: "_blank",
359
424
  rel: "noopener noreferrer",
360
425
  className: "px-3 py-1.5 text-sm font-medium text-text-link hover:bg-[var(--color-accent-softHover)] rounded-button transition-colors duration-200",
361
- children: p("billing.common.pdf", "PDF")
426
+ children: y("billing.common.pdf", "PDF")
427
+ }),
428
+ A && /* @__PURE__ */ w("a", {
429
+ href: A,
430
+ target: "_blank",
431
+ rel: "noopener noreferrer",
432
+ className: "px-3 py-1.5 text-sm font-medium text-text-link hover:bg-[var(--color-accent-softHover)] rounded-button transition-colors duration-200",
433
+ children: y("billing.common.pdfBackup", "PDF (backup)")
362
434
  }),
363
- h && l && /* @__PURE__ */ y("button", {
435
+ E && p && /* @__PURE__ */ w("button", {
364
436
  type: "button",
365
- className: "px-3 py-1.5 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors duration-200",
366
- children: p("billing.common.pay", "Pay")
437
+ onClick: () => void d(s),
438
+ disabled: h,
439
+ className: "px-3 py-1.5 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors duration-200 disabled:cursor-not-allowed disabled:opacity-50",
440
+ children: h && g === "pay" ? y("billing.common.paying", "Paying…") : y("billing.common.pay", "Pay")
367
441
  }),
368
- (h || g) && u && /* @__PURE__ */ y("button", {
442
+ (E || D) && m && /* @__PURE__ */ w("button", {
369
443
  type: "button",
370
- className: "px-3 py-1.5 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle rounded-button transition-colors duration-200",
371
- children: p("billing.common.void", "Void")
444
+ onClick: () => void O(),
445
+ disabled: h,
446
+ className: "px-3 py-1.5 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle rounded-button transition-colors duration-200 disabled:cursor-not-allowed disabled:opacity-50",
447
+ children: h && g === "void" ? y("billing.common.voiding", "Voiding…") : y("billing.common.void", "Void")
448
+ }),
449
+ x && /* @__PURE__ */ T("div", {
450
+ className: "absolute right-4 mt-12 z-10 w-64 rounded-card border border-status-error-border bg-bg-elevated p-3 text-left shadow-elevation-2",
451
+ children: [/* @__PURE__ */ w("p", {
452
+ className: "text-sm font-medium text-text-primary",
453
+ children: "Void this invoice?"
454
+ }), /* @__PURE__ */ T("div", {
455
+ className: "mt-3 flex justify-end gap-2",
456
+ children: [/* @__PURE__ */ w("button", {
457
+ type: "button",
458
+ onClick: () => S(!1),
459
+ className: "rounded-button border border-border-subtle bg-bg-surface px-2.5 py-1.5 text-xs font-medium text-text-primary hover:bg-bg-sunken",
460
+ children: "Cancel"
461
+ }), /* @__PURE__ */ w("button", {
462
+ type: "button",
463
+ onClick: () => void k(),
464
+ disabled: h,
465
+ className: "rounded-button bg-action-danger-bg px-2.5 py-1.5 text-xs font-medium text-action-primary-text hover:bg-action-danger-bgHover disabled:cursor-not-allowed disabled:opacity-50",
466
+ children: h ? "Voiding…" : "Confirm"
467
+ })]
468
+ })]
372
469
  })
373
470
  ]
374
471
  })
@@ -377,6 +474,6 @@ var C = () => {
377
474
  });
378
475
  };
379
476
  //#endregion
380
- export { C as InvoicesListPage };
477
+ export { O as InvoicesListPage };
381
478
 
382
479
  //# sourceMappingURL=InvoicesListPage.js.map