@burdenoff/microfe-subscriberbot 2026.827.1 → 2026.1014.1

package/dist/subscriberbot/pages/InvoicesPage.js

@@ -2,52 +2,28 @@ import { useSubscriberBot as e } from "../context/SubscriberBotContext.js";
 import { cn as t } from "../utils/cn.js";
 import { PageLayout as n } from "../components/PageLayout.js";
 import { MetricsCard as r } from "../components/MetricsCard.js";
-import { formatCurrency as i, formatDate as a } from "../utils/formatters.js";
-import { StatusBadge as o } from "../components/StatusBadge.js";
-import { EmptyState as s } from "../components/EmptyState.js";
-import { Modal as c } from "../components/Modal.js";
-import { ErrorView as l, LoadingView as u, Section as d } from "../components/StateViews.js";
-import { CHART_COLORS as f, Donut as p, Legend as m } from "../components/viz.js";
-import { useCreateInvoice as h, useCreatePaymentInstrument as g, useInvoices as _, useMarkInvoicePaid as v, usePaymentInstruments as y, useRelationships as b, useRemovePaymentInstrument as x } from "../hooks/useSubscriberBotApi.js";
-import { useMemo as S, useState as C } from "react";
-import { AlertTriangle as w, CheckCircle2 as T, CreditCard as E, FileText as D, Plus as O, Receipt as k, Star as A, Trash2 as j } from "lucide-react";
-import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";
-import { GlassCard as F, PagePurpose as I } from "@burdenoff/fe-libs/ui";
+import { formatCurrency as i, formatDate as a, formatEnumLabel as o } from "../utils/formatters.js";
+import { StatusBadge as s } from "../components/StatusBadge.js";
+import { EmptyState as c } from "../components/EmptyState.js";
+import { Modal as l } from "../components/Modal.js";
+import { ErrorView as u, LoadingView as d, Section as f } from "../components/StateViews.js";
+import { CHART_COLORS as p, Donut as m, Legend as h } from "../components/viz.js";
+import { useCreateInvoice as g, useCreatePaymentInstrument as _, useInvoices as v, useMarkInvoicePaid as y, usePaymentInstruments as b, useRelationships as x, useRemovePaymentInstrument as S } from "../hooks/useSubscriberBotApi.js";
+import { useTr as C } from "../hooks/useTr.js";
+import { useMemo as w, useState as T } from "react";
+import { AlertTriangle as E, CheckCircle2 as D, CreditCard as O, FileText as ee, Plus as k, Receipt as A, Star as j, Trash2 as M } from "lucide-react";
+import { Fragment as N, jsx as P, jsxs as F } from "react/jsx-runtime";
+import { GlassCard as I, PagePurpose as te } from "@burdenoff/fe-libs/ui";
 //#region src/subscriberbot/pages/InvoicesPage.tsx
-var L = 25, R = "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]", z = "mb-1 block text-xs font-medium text-text-secondary", B = [
-	{
-		value: "",
-		label: "All statuses"
-	},
-	{
-		value: "ISSUED",
-		label: "Issued"
-	},
-	{
-		value: "OVERDUE",
-		label: "Overdue"
-	},
-	{
-		value: "PAID",
-		label: "Paid"
-	},
-	{
-		value: "FAILED",
-		label: "Failed"
-	},
-	{
-		value: "DRAFT",
-		label: "Draft"
-	},
-	{
-		value: "CANCELLED",
-		label: "Cancelled"
-	},
-	{
-		value: "REFUNDED",
-		label: "Refunded"
-	}
-], V = [
+var L = 25, R = "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]", z = "mb-1 block text-xs font-medium text-text-secondary", B = {
+	ISSUED: "invoices.filters.issued",
+	OVERDUE: "invoices.filters.overdue",
+	PAID: "invoices.filters.paid",
+	FAILED: "invoices.filters.failed",
+	DRAFT: "invoices.filters.draft",
+	CANCELLED: "invoices.filters.cancelled",
+	REFUNDED: "invoices.filters.refunded"
+}, V = [
 	"ISSUED",
 	"DRAFT",
 	"OVERDUE",
@@ -76,185 +52,189 @@ var L = 25, R = "w-full rounded-lg border border-border-subtle bg-bg-surface px-
 	REFUNDED: "var(--color-status-warning-text)"
 };
 function G({ onClose: e }) {
-	let t = h(), n = b({ pagination: {
+	let t = C(), n = g(), r = x({ pagination: {
 		limit: 100,
 		offset: 0
-	} }).data?.items ?? [], [r, i] = C(""), [a, o] = C(""), [s, l] = C("ISSUED"), [u, d] = C("USD"), [f, p] = C(""), [m, g] = C(""), [_, v] = C(""), [y, x] = C(""), [S, w] = C(""), [T, E] = C(null);
-	return /* @__PURE__ */ N(c, {
-		title: "Create invoice",
+	} }).data?.items ?? [], [i, a] = T(""), [o, s] = T(""), [c, u] = T("ISSUED"), [d, f] = T("USD"), [p, m] = T(""), [h, _] = T(""), [v, y] = T(""), [b, S] = T(""), [w, E] = T(""), [D, O] = T(null);
+	return /* @__PURE__ */ P(l, {
+		title: t("invoices.createModal.title", "Create invoice"),
 		onClose: e,
 		maxWidthClassName: "max-w-xl",
-		children: /* @__PURE__ */ P("form", {
-			onSubmit: (n) => {
-				if (n.preventDefault(), E(null), !r) {
-					E("Select the relationship this invoice belongs to.");
+		children: /* @__PURE__ */ F("form", {
+			onSubmit: (r) => {
+				if (r.preventDefault(), O(null), !i) {
+					O(t("invoices.createModal.relationshipRequired", "Select the relationship this invoice belongs to."));
 					return;
 				}
-				t.mutate({
-					relationshipId: r,
-					status: s,
-					currency: u.trim() || "USD",
-					...a.trim() ? { number: a.trim() } : {},
-					...f.trim() ? { subtotal: Number(f) } : {},
-					...m.trim() ? { taxAmount: Number(m) } : {},
-					..._.trim() ? { total: Number(_) } : {},
-					...y ? { issueDate: new Date(y).toISOString() } : {},
-					...S ? { dueDate: new Date(S).toISOString() } : {}
+				n.mutate({
+					relationshipId: i,
+					status: c,
+					currency: d.trim() || "USD",
+					...o.trim() ? { number: o.trim() } : {},
+					...p.trim() ? { subtotal: Number(p) } : {},
+					...h.trim() ? { taxAmount: Number(h) } : {},
+					...v.trim() ? { total: Number(v) } : {},
+					...b ? { issueDate: new Date(b).toISOString() } : {},
+					...w ? { dueDate: new Date(w).toISOString() } : {}
 				}, {
 					onSuccess: () => e(),
-					onError: (e) => E(e instanceof Error ? e.message : "Could not create invoice.")
+					onError: (e) => O(e instanceof Error ? e.message : t("invoices.createModal.error", "Could not create invoice."))
 				});
 			},
 			className: "space-y-4",
 			children: [
-				T && /* @__PURE__ */ N("div", {
+				D && /* @__PURE__ */ P("div", {
 					className: "rounded-lg border border-status-error-text/30 bg-status-error-bg-subtle px-4 py-2 text-sm text-status-error-text",
-					children: T
+					children: D
 				}),
-				/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ P("label", {
+				/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ F("label", {
 					htmlFor: "inv-relationship",
 					className: z,
-					children: ["Relationship ", /* @__PURE__ */ N("span", {
-						className: "text-status-error-text",
-						children: "*"
-					})]
-				}), /* @__PURE__ */ P("select", {
+					children: [
+						t("invoices.createModal.relationshipLabel", "Relationship"),
+						" ",
+						/* @__PURE__ */ P("span", {
+							className: "text-status-error-text",
+							children: "*"
+						})
+					]
+				}), /* @__PURE__ */ F("select", {
 					id: "inv-relationship",
-					value: r,
-					onChange: (e) => i(e.target.value),
+					value: i,
+					onChange: (e) => a(e.target.value),
 					className: R,
 					required: !0,
-					children: [/* @__PURE__ */ N("option", {
+					children: [/* @__PURE__ */ P("option", {
 						value: "",
-						children: "— Select a relationship —"
-					}), n.map((e) => /* @__PURE__ */ N("option", {
+						children: t("invoices.createModal.relationshipPlaceholder", "— Select a relationship —")
+					}), r.map((e) => /* @__PURE__ */ P("option", {
 						value: e.id,
 						children: e.label
 					}, e.id))]
 				})] }),
-				/* @__PURE__ */ P("div", {
+				/* @__PURE__ */ F("div", {
 					className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
 					children: [
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "inv-number",
 							className: z,
-							children: "Number"
-						}), /* @__PURE__ */ N("input", {
+							children: t("invoices.createModal.numberLabel", "Number")
+						}), /* @__PURE__ */ P("input", {
 							id: "inv-number",
 							type: "text",
-							value: a,
-							onChange: (e) => o(e.target.value),
-							placeholder: "INV-0001",
+							value: o,
+							onChange: (e) => s(e.target.value),
+							placeholder: t("invoices.createModal.numberPlaceholder", "INV-0001"),
 							className: R
 						})] }),
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "inv-status",
 							className: z,
-							children: "Status"
-						}), /* @__PURE__ */ N("select", {
+							children: t("invoices.createModal.statusLabel", "Status")
+						}), /* @__PURE__ */ P("select", {
 							id: "inv-status",
-							value: s,
-							onChange: (e) => l(e.target.value),
+							value: c,
+							onChange: (e) => u(e.target.value),
 							className: R,
-							children: V.map((e) => /* @__PURE__ */ N("option", {
+							children: V.map((e) => /* @__PURE__ */ P("option", {
 								value: e,
-								children: e.replace(/_/g, " ")
+								children: t(B[e], e)
 							}, e))
 						})] }),
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "inv-currency",
 							className: z,
-							children: "Currency"
-						}), /* @__PURE__ */ N("input", {
+							children: t("invoices.createModal.currencyLabel", "Currency")
+						}), /* @__PURE__ */ P("input", {
 							id: "inv-currency",
 							type: "text",
-							value: u,
-							onChange: (e) => d(e.target.value.toUpperCase()),
+							value: d,
+							onChange: (e) => f(e.target.value.toUpperCase()),
 							maxLength: 3,
 							className: R
 						})] })
 					]
 				}),
-				/* @__PURE__ */ P("div", {
+				/* @__PURE__ */ F("div", {
 					className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
 					children: [
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "inv-subtotal",
 							className: z,
-							children: "Subtotal"
-						}), /* @__PURE__ */ N("input", {
+							children: t("invoices.createModal.subtotalLabel", "Subtotal")
+						}), /* @__PURE__ */ P("input", {
 							id: "inv-subtotal",
 							type: "number",
 							min: "0",
 							step: "0.01",
-							value: f,
-							onChange: (e) => p(e.target.value),
+							value: p,
+							onChange: (e) => m(e.target.value),
 							className: R
 						})] }),
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "inv-tax",
 							className: z,
-							children: "Tax"
-						}), /* @__PURE__ */ N("input", {
+							children: t("invoices.createModal.taxLabel", "Tax")
+						}), /* @__PURE__ */ P("input", {
 							id: "inv-tax",
 							type: "number",
 							min: "0",
 							step: "0.01",
-							value: m,
-							onChange: (e) => g(e.target.value),
+							value: h,
+							onChange: (e) => _(e.target.value),
 							className: R
 						})] }),
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "inv-total",
 							className: z,
-							children: "Total"
-						}), /* @__PURE__ */ N("input", {
+							children: t("invoices.createModal.totalLabel", "Total")
+						}), /* @__PURE__ */ P("input", {
 							id: "inv-total",
 							type: "number",
 							min: "0",
 							step: "0.01",
-							value: _,
-							onChange: (e) => v(e.target.value),
+							value: v,
+							onChange: (e) => y(e.target.value),
 							className: R
 						})] })
 					]
 				}),
-				/* @__PURE__ */ P("div", {
+				/* @__PURE__ */ F("div", {
 					className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
-					children: [/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+					children: [/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 						htmlFor: "inv-issue",
 						className: z,
-						children: "Issue date"
-					}), /* @__PURE__ */ N("input", {
+						children: t("invoices.createModal.issueDateLabel", "Issue date")
+					}), /* @__PURE__ */ P("input", {
 						id: "inv-issue",
 						type: "date",
-						value: y,
-						onChange: (e) => x(e.target.value),
+						value: b,
+						onChange: (e) => S(e.target.value),
 						className: R
-					})] }), /* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+					})] }), /* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 						htmlFor: "inv-due",
 						className: z,
-						children: "Due date"
-					}), /* @__PURE__ */ N("input", {
+						children: t("invoices.createModal.dueDateLabel", "Due date")
+					}), /* @__PURE__ */ P("input", {
 						id: "inv-due",
 						type: "date",
-						value: S,
-						onChange: (e) => w(e.target.value),
+						value: w,
+						onChange: (e) => E(e.target.value),
 						className: R
 					})] })]
 				}),
-				/* @__PURE__ */ P("div", {
+				/* @__PURE__ */ F("div", {
 					className: "flex justify-end gap-3",
-					children: [/* @__PURE__ */ N("button", {
+					children: [/* @__PURE__ */ P("button", {
 						type: "button",
 						onClick: e,
 						className: "rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken",
-						children: "Cancel"
-					}), /* @__PURE__ */ N("button", {
+						children: t("invoices.createModal.cancel", "Cancel")
+					}), /* @__PURE__ */ P("button", {
 						type: "submit",
-						disabled: t.isPending,
+						disabled: n.isPending,
 						className: "rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90 disabled:opacity-50",
-						children: t.isPending ? "Creating…" : "Create invoice"
+						children: n.isPending ? t("invoices.creating", "Creating…") : t("invoices.createModal.submit", "Create invoice")
 					})]
 				})
 			]
@@ -262,151 +242,155 @@ function G({ onClose: e }) {
 	});
 }
 function K({ onClose: e }) {
-	let t = g(), [n, r] = C(""), [i, a] = C("CARD"), [o, s] = C(""), [l, u] = C(""), [d, f] = C(""), [p, m] = C(""), [h, _] = C(!1), [v, y] = C(null);
-	return /* @__PURE__ */ N(c, {
-		title: "Add payment method",
-		description: "A passive annotation of which external card/account pays for a subscription — no full card numbers or CVV.",
+	let t = C(), n = _(), [r, i] = T(""), [a, s] = T("CARD"), [c, u] = T(""), [d, f] = T(""), [p, m] = T(""), [h, g] = T(""), [v, y] = T(!1), [b, x] = T(null);
+	return /* @__PURE__ */ P(l, {
+		title: t("invoices.addPaymentMethodModal.title", "Add payment method"),
+		description: t("invoices.addPaymentMethodModal.description", "A passive annotation of which external card/account pays for a subscription — no full card numbers or CVV."),
 		onClose: e,
 		maxWidthClassName: "max-w-xl",
-		children: /* @__PURE__ */ P("form", {
-			onSubmit: (r) => {
-				if (r.preventDefault(), y(null), !n.trim()) {
-					y("A label is required.");
+		children: /* @__PURE__ */ F("form", {
+			onSubmit: (i) => {
+				if (i.preventDefault(), x(null), !r.trim()) {
+					x(t("invoices.addPaymentMethodModal.labelRequired", "A label is required."));
 					return;
 				}
-				t.mutate({
-					label: n.trim(),
-					type: i,
-					isDefault: h,
-					...o.trim() ? { brand: o.trim() } : {},
-					...l.trim() ? { last4: l.trim() } : {},
-					...d.trim() ? { expiryMonth: Number(d) } : {},
-					...p.trim() ? { expiryYear: Number(p) } : {}
+				n.mutate({
+					label: r.trim(),
+					type: a,
+					isDefault: v,
+					...c.trim() ? { brand: c.trim() } : {},
+					...d.trim() ? { last4: d.trim() } : {},
+					...p.trim() ? { expiryMonth: Number(p) } : {},
+					...h.trim() ? { expiryYear: Number(h) } : {}
 				}, {
 					onSuccess: () => e(),
-					onError: (e) => y(e instanceof Error ? e.message : "Could not add payment method.")
+					onError: (e) => x(e instanceof Error ? e.message : t("invoices.addPaymentMethodModal.error", "Could not add payment method."))
 				});
 			},
 			className: "space-y-4",
 			children: [
-				v && /* @__PURE__ */ N("div", {
+				b && /* @__PURE__ */ P("div", {
 					className: "rounded-lg border border-status-error-text/30 bg-status-error-bg-subtle px-4 py-2 text-sm text-status-error-text",
-					children: v
+					children: b
 				}),
-				/* @__PURE__ */ P("div", {
+				/* @__PURE__ */ F("div", {
 					className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
-					children: [/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ P("label", {
+					children: [/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ F("label", {
 						htmlFor: "pm-label",
 						className: z,
-						children: ["Label ", /* @__PURE__ */ N("span", {
-							className: "text-status-error-text",
-							children: "*"
-						})]
-					}), /* @__PURE__ */ N("input", {
+						children: [
+							t("invoices.addPaymentMethodModal.labelLabel", "Label"),
+							" ",
+							/* @__PURE__ */ P("span", {
+								className: "text-status-error-text",
+								children: "*"
+							})
+						]
+					}), /* @__PURE__ */ P("input", {
 						id: "pm-label",
 						type: "text",
-						value: n,
-						onChange: (e) => r(e.target.value),
-						placeholder: "e.g. Personal Visa",
+						value: r,
+						onChange: (e) => i(e.target.value),
+						placeholder: t("invoices.addPaymentMethodModal.labelPlaceholder", "e.g. Personal Visa"),
 						className: R,
 						required: !0
-					})] }), /* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+					})] }), /* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 						htmlFor: "pm-type",
 						className: z,
-						children: "Type"
-					}), /* @__PURE__ */ N("select", {
+						children: t("invoices.addPaymentMethodModal.typeLabel", "Type")
+					}), /* @__PURE__ */ P("select", {
 						id: "pm-type",
-						value: i,
-						onChange: (e) => a(e.target.value),
+						value: a,
+						onChange: (e) => s(e.target.value),
 						className: R,
-						children: H.map((e) => /* @__PURE__ */ N("option", {
+						children: H.map((e) => /* @__PURE__ */ P("option", {
 							value: e,
-							children: e.replace(/_/g, " ")
+							children: o(e)
 						}, e))
 					})] })]
 				}),
-				/* @__PURE__ */ P("div", {
+				/* @__PURE__ */ F("div", {
 					className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
 					children: [
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "pm-brand",
 							className: z,
-							children: "Brand"
-						}), /* @__PURE__ */ N("input", {
+							children: t("invoices.addPaymentMethodModal.brandLabel", "Brand")
+						}), /* @__PURE__ */ P("input", {
 							id: "pm-brand",
 							type: "text",
-							value: o,
-							onChange: (e) => s(e.target.value),
-							placeholder: "Visa, Amex…",
+							value: c,
+							onChange: (e) => u(e.target.value),
+							placeholder: t("invoices.addPaymentMethodModal.brandPlaceholder", "Visa, Amex…"),
 							className: R
 						})] }),
-						/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+						/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 							htmlFor: "pm-last4",
 							className: z,
-							children: "Last 4"
-						}), /* @__PURE__ */ N("input", {
+							children: t("invoices.addPaymentMethodModal.last4Label", "Last 4")
+						}), /* @__PURE__ */ P("input", {
 							id: "pm-last4",
 							type: "text",
 							inputMode: "numeric",
 							maxLength: 4,
-							value: l,
-							onChange: (e) => u(e.target.value.replace(/\D/g, "")),
-							placeholder: "4242",
+							value: d,
+							onChange: (e) => f(e.target.value.replace(/\D/g, "")),
+							placeholder: t("invoices.addPaymentMethodModal.last4Placeholder", "4242"),
 							className: R
 						})] }),
-						/* @__PURE__ */ P("div", {
+						/* @__PURE__ */ F("div", {
 							className: "grid grid-cols-2 gap-2",
-							children: [/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+							children: [/* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 								htmlFor: "pm-exp-month",
 								className: z,
-								children: "Exp. mo."
-							}), /* @__PURE__ */ N("input", {
+								children: t("invoices.addPaymentMethodModal.expMonthLabel", "Exp. mo.")
+							}), /* @__PURE__ */ P("input", {
 								id: "pm-exp-month",
 								type: "number",
 								min: "1",
 								max: "12",
-								value: d,
-								onChange: (e) => f(e.target.value),
-								placeholder: "12",
+								value: p,
+								onChange: (e) => m(e.target.value),
+								placeholder: t("invoices.addPaymentMethodModal.expMonthPlaceholder", "12"),
 								className: R
-							})] }), /* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
+							})] }), /* @__PURE__ */ F("div", { children: [/* @__PURE__ */ P("label", {
 								htmlFor: "pm-exp-year",
 								className: z,
-								children: "Exp. yr."
-							}), /* @__PURE__ */ N("input", {
+								children: t("invoices.addPaymentMethodModal.expYearLabel", "Exp. yr.")
+							}), /* @__PURE__ */ P("input", {
 								id: "pm-exp-year",
 								type: "number",
 								min: "2024",
 								max: "2099",
-								value: p,
-								onChange: (e) => m(e.target.value),
-								placeholder: "2028",
+								value: h,
+								onChange: (e) => g(e.target.value),
+								placeholder: t("invoices.addPaymentMethodModal.expYearPlaceholder", "2028"),
 								className: R
 							})] })]
 						})
 					]
 				}),
-				/* @__PURE__ */ P("label", {
+				/* @__PURE__ */ F("label", {
 					className: "flex items-center gap-2 text-sm text-text-primary",
-					children: [/* @__PURE__ */ N("input", {
+					children: [/* @__PURE__ */ P("input", {
 						type: "checkbox",
-						checked: h,
-						onChange: (e) => _(e.target.checked),
+						checked: v,
+						onChange: (e) => y(e.target.checked),
 						className: "size-4 rounded border-border-subtle"
-					}), "Set as default"]
+					}), t("invoices.addPaymentMethodModal.defaultLabel", "Set as default")]
 				}),
-				/* @__PURE__ */ P("div", {
+				/* @__PURE__ */ F("div", {
 					className: "flex justify-end gap-3",
-					children: [/* @__PURE__ */ N("button", {
+					children: [/* @__PURE__ */ P("button", {
 						type: "button",
 						onClick: e,
 						className: "rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken",
-						children: "Cancel"
-					}), /* @__PURE__ */ N("button", {
+						children: t("invoices.addPaymentMethodModal.cancel", "Cancel")
+					}), /* @__PURE__ */ P("button", {
 						type: "submit",
-						disabled: t.isPending,
+						disabled: n.isPending,
 						className: "rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90 disabled:opacity-50",
-						children: t.isPending ? "Adding…" : "Add payment method"
+						children: n.isPending ? t("invoices.addPaymentMethodModal.adding", "Adding…") : t("invoices.addPaymentMethodModal.submit", "Add payment method")
 					})]
 				})
 			]
@@ -414,177 +398,191 @@ function K({ onClose: e }) {
 	});
 }
 function q() {
-	let { data: e, isLoading: t, isError: n, refetch: r } = y(), i = x(), [a, c] = C(!1), f = e ?? [];
-	return /* @__PURE__ */ P(d, {
-		title: "Payment methods",
-		description: "Which external cards and accounts pay for your subscriptions",
-		action: /* @__PURE__ */ P("button", {
+	let e = C(), { data: t, isLoading: n, isError: r, refetch: i } = b(), a = S(), [l, p] = T(!1), m = t ?? [];
+	return /* @__PURE__ */ F(f, {
+		title: e("invoices.paymentMethods.title", "Payment methods"),
+		description: e("invoices.paymentMethods.description", "Which external cards and accounts pay for your subscriptions"),
+		action: /* @__PURE__ */ F("button", {
 			type: "button",
-			onClick: () => c(!0),
+			onClick: () => p(!0),
 			className: "inline-flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-bg-sunken",
-			children: [/* @__PURE__ */ N(O, { className: "h-3.5 w-3.5" }), " Add payment method"]
+			children: [
+				/* @__PURE__ */ P(k, { className: "h-3.5 w-3.5" }),
+				" ",
+				e("invoices.paymentMethods.add", "Add payment method")
+			]
 		}),
-		children: [t ? /* @__PURE__ */ N(u, { label: "Loading payment methods…" }) : n ? /* @__PURE__ */ N(l, {
-			message: "Could not load payment methods.",
-			onRetry: () => void r()
-		}) : f.length === 0 ? /* @__PURE__ */ N(s, {
+		children: [n ? /* @__PURE__ */ P(d, { label: e("invoices.paymentMethods.loading", "Loading payment methods…") }) : r ? /* @__PURE__ */ P(u, {
+			message: e("invoices.paymentMethods.error", "Could not load payment methods."),
+			onRetry: () => void i()
+		}) : m.length === 0 ? /* @__PURE__ */ P(c, {
 			illustration: "empty-data",
-			icon: /* @__PURE__ */ N(E, { className: "h-12 w-12" }),
-			title: "No payment methods",
-			description: "Annotate which card or account pays for each subscription. No full card numbers are stored."
-		}) : /* @__PURE__ */ N("div", {
+			icon: /* @__PURE__ */ P(O, { className: "h-12 w-12" }),
+			title: e("invoices.paymentMethods.emptyTitle", "No payment methods"),
+			description: e("invoices.paymentMethods.emptyDescription", "Annotate which card or account pays for each subscription. No full card numbers are stored.")
+		}) : /* @__PURE__ */ P("div", {
 			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3",
-			children: f.map((e) => {
-				let t = [e.expiryMonth && e.expiryYear ? `Exp ${String(e.expiryMonth).padStart(2, "0")}/${String(e.expiryYear).slice(-2)}` : null].filter(Boolean);
-				return /* @__PURE__ */ P(F, {
+			children: m.map((t) => {
+				let n = [t.expiryMonth && t.expiryYear ? `Exp ${String(t.expiryMonth).padStart(2, "0")}/${String(t.expiryYear).slice(-2)}` : null].filter(Boolean);
+				return /* @__PURE__ */ F(I, {
 					treatment: "metric",
 					className: "flex flex-col gap-4 p-4",
-					children: [/* @__PURE__ */ P("div", {
+					children: [/* @__PURE__ */ F("div", {
 						className: "flex items-start justify-between gap-2",
-						children: [/* @__PURE__ */ P("div", {
+						children: [/* @__PURE__ */ F("div", {
 							className: "flex items-center gap-3",
-							children: [/* @__PURE__ */ N("span", {
+							children: [/* @__PURE__ */ P("span", {
 								className: "grid h-9 w-12 place-items-center rounded-md bg-[var(--color-accent-soft)] text-text-primary",
-								children: /* @__PURE__ */ N(E, {
+								children: /* @__PURE__ */ P(O, {
 									className: "h-4 w-4",
 									"aria-hidden": !0
 								})
-							}), /* @__PURE__ */ P("div", {
+							}), /* @__PURE__ */ F("div", {
 								className: "min-w-0",
-								children: [/* @__PURE__ */ P("p", {
+								children: [/* @__PURE__ */ F("p", {
 									className: "flex items-center gap-1.5 truncate text-sm font-semibold text-text-primary",
-									children: [e.brand || e.label, e.isDefault && /* @__PURE__ */ P("span", {
+									children: [t.brand || t.label, t.isDefault && /* @__PURE__ */ F("span", {
 										className: "inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-status-success-text",
-										children: [/* @__PURE__ */ N(A, {
+										children: [/* @__PURE__ */ P(j, {
 											className: "h-2.5 w-2.5 fill-current",
 											"aria-hidden": !0
-										}), "Default"]
+										}), e("invoices.paymentMethods.default", "Default")]
 									})]
-								}), /* @__PURE__ */ N("p", {
+								}), /* @__PURE__ */ P("p", {
 									className: "font-mono text-sm tracking-[0.15em] text-text-secondary",
-									children: e.last4 ? `•••• ${e.last4}` : e.type.replace(/_/g, " ")
+									children: t.last4 ? `•••• ${t.last4}` : o(t.type)
 								})]
 							})]
-						}), /* @__PURE__ */ N(o, { status: e.status })]
-					}), /* @__PURE__ */ P("div", {
+						}), /* @__PURE__ */ P(s, { status: t.status })]
+					}), /* @__PURE__ */ F("div", {
 						className: "mt-auto flex items-center justify-between border-t border-border-subtle pt-3",
-						children: [/* @__PURE__ */ N("p", {
+						children: [/* @__PURE__ */ P("p", {
 							className: "truncate text-xs text-text-secondary",
-							children: [e.label, ...t].filter(Boolean).join(" · ")
-						}), /* @__PURE__ */ P("button", {
+							children: [t.label, ...n].filter(Boolean).join(" · ")
+						}), /* @__PURE__ */ F("button", {
 							type: "button",
-							"aria-label": `Remove ${e.label}`,
-							disabled: i.isPending,
-							onClick: () => i.mutate(e.id),
+							"aria-label": e("invoices.paymentMethods.removeAria", "Remove {{label}}", { label: t.label }),
+							disabled: a.isPending,
+							onClick: () => a.mutate(t.id),
 							className: "inline-flex shrink-0 items-center gap-1 rounded-lg border border-border-subtle px-2.5 py-1 text-xs font-medium text-text-secondary hover:border-status-error-text/40 hover:bg-status-error-bg-subtle hover:text-status-error-text disabled:opacity-50",
-							children: [/* @__PURE__ */ N(j, {
+							children: [/* @__PURE__ */ P(M, {
 								className: "h-3.5 w-3.5",
 								"aria-hidden": !0
-							}), "Remove"]
+							}), e("invoices.paymentMethods.remove", "Remove")]
 						})]
 					})]
-				}, e.id);
+				}, t.id);
 			})
-		}), a && /* @__PURE__ */ N(K, { onClose: () => c(!1) })]
+		}), l && /* @__PURE__ */ P(K, { onClose: () => p(!1) })]
 	});
 }
 function J() {
-	let { navigateTo: c } = e(), [d, h] = C(0), [g, y] = C(""), [x, E] = C(!1), { data: A, isLoading: j, isError: R, refetch: z, isFetching: V } = _({
-		status: g || void 0,
+	let o = C(), { navigateTo: l } = e(), [f, g] = T(0), [_, b] = T(""), [S, O] = T(!1), j = [{
+		value: "",
+		label: o("invoices.filters.allStatuses", "All statuses")
+	}, ...V.map((e) => ({
+		value: e,
+		label: o(B[e], e)
+	}))], { data: M, isLoading: R, isError: z, refetch: H, isFetching: K } = v({
+		status: _ || void 0,
 		pagination: {
 			limit: L,
-			offset: d * L
+			offset: f * L
 		}
-	}), H = v(), K = b({ pagination: {
+	}), J = y(), Y = x({ pagination: {
 		limit: 100,
 		offset: 0
-	} }), J = S(() => {
+	} }), X = w(() => {
 		let e = /* @__PURE__ */ new Map();
-		for (let t of K.data?.items ?? []) e.set(t.id, t.label);
+		for (let t of Y.data?.items ?? []) e.set(t.id, t.label);
 		return e;
-	}, [K.data]), Y = S(() => A?.items ?? [], [A]), X = A?.pageInfo.hasMore ?? !1, Z = S(() => {
-		let e = Y.filter((e) => U.has(e.status)), t = Y[0]?.currency ?? "USD", n = /* @__PURE__ */ new Map();
-		for (let e of Y) n.set(e.status, (n.get(e.status) ?? 0) + 1);
+	}, [Y.data]), Z = w(() => M?.items ?? [], [M]), Q = M?.pageInfo.hasMore ?? !1, $ = w(() => {
+		let e = Z.filter((e) => U.has(e.status)), t = Z[0]?.currency ?? "USD", n = /* @__PURE__ */ new Map();
+		for (let e of Z) n.set(e.status, (n.get(e.status) ?? 0) + 1);
 		let r = Array.from(n.entries()).sort((e, t) => t[1] - e[1]).map(([e, t], n) => ({
-			label: e.charAt(0) + e.slice(1).toLowerCase(),
+			label: o(B[e], e.charAt(0) + e.slice(1).toLowerCase()),
 			value: t,
-			color: W[e] ?? f[n % f.length]
+			color: W[e] ?? p[n % p.length]
 		}));
 		return {
 			outstandingCount: e.length,
 			outstandingTotal: e.reduce((e, t) => e + t.total, 0),
-			paidCount: Y.filter((e) => e.status === "PAID").length,
-			overdueCount: Y.filter((e) => e.status === "OVERDUE").length,
+			paidCount: Z.filter((e) => e.status === "PAID").length,
+			overdueCount: Z.filter((e) => e.status === "OVERDUE").length,
 			distribution: r,
 			currency: t
 		};
-	}, [Y]);
-	return /* @__PURE__ */ P(n, {
-		title: "Invoices",
-		description: "Your billing ledger across every relationship",
-		actions: /* @__PURE__ */ P("button", {
+	}, [Z, o]);
+	return /* @__PURE__ */ F(n, {
+		title: o("invoices.title", "Invoices"),
+		description: o("invoices.description", "Your billing ledger across every relationship"),
+		actions: /* @__PURE__ */ F("button", {
 			type: "button",
-			onClick: () => E(!0),
+			onClick: () => O(!0),
 			className: "inline-flex items-center gap-2 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90",
-			children: [/* @__PURE__ */ N(O, { className: "h-4 w-4" }), " Create invoice"]
+			children: [
+				/* @__PURE__ */ P(k, { className: "h-4 w-4" }),
+				" ",
+				o("invoices.create", "Create invoice")
+			]
 		}),
 		children: [
-			/* @__PURE__ */ N(I, {
+			/* @__PURE__ */ P(te, {
 				className: "mb-4",
-				children: "Every invoice from your recurring relationships in one ledger. Filter by status and settle issued or overdue invoices directly."
+				children: o("invoices.purpose", "Every invoice from your recurring relationships in one ledger. Filter by status and settle issued or overdue invoices directly.")
 			}),
-			!j && !R && Y.length > 0 && /* @__PURE__ */ P("div", {
+			!R && !z && Z.length > 0 && /* @__PURE__ */ F("div", {
 				className: "grid grid-cols-1 gap-4 lg:grid-cols-3",
-				children: [/* @__PURE__ */ P("div", {
+				children: [/* @__PURE__ */ F("div", {
 					className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:col-span-2",
 					children: [
-						/* @__PURE__ */ N(r, {
+						/* @__PURE__ */ P(r, {
 							featured: !0,
-							icon: /* @__PURE__ */ N(k, {}),
-							value: i(Z.outstandingTotal, Z.currency, { maximumFractionDigits: 0 }),
-							label: "Outstanding · this page"
+							icon: /* @__PURE__ */ P(A, {}),
+							value: i($.outstandingTotal, $.currency, { maximumFractionDigits: 0 }),
+							label: o("invoices.metrics.outstanding", "Outstanding · this page")
 						}),
-						/* @__PURE__ */ N(r, {
-							icon: /* @__PURE__ */ N(D, {}),
-							value: Z.outstandingCount,
-							label: "Open invoices"
+						/* @__PURE__ */ P(r, {
+							icon: /* @__PURE__ */ P(ee, {}),
+							value: $.outstandingCount,
+							label: o("invoices.metrics.openInvoices", "Open invoices")
 						}),
-						/* @__PURE__ */ N(r, {
-							icon: /* @__PURE__ */ N(w, {}),
-							value: Z.overdueCount,
-							label: "Overdue",
-							...Z.overdueCount > 0 ? { trend: "down" } : {}
+						/* @__PURE__ */ P(r, {
+							icon: /* @__PURE__ */ P(E, {}),
+							value: $.overdueCount,
+							label: o("invoices.metrics.overdue", "Overdue"),
+							...$.overdueCount > 0 ? { trend: "down" } : {}
 						}),
-						/* @__PURE__ */ N(r, {
-							icon: /* @__PURE__ */ N(T, {}),
-							value: Z.paidCount,
-							label: "Paid",
-							...Z.paidCount > 0 ? { trend: "up" } : {}
+						/* @__PURE__ */ P(r, {
+							icon: /* @__PURE__ */ P(D, {}),
+							value: $.paidCount,
+							label: o("invoices.metrics.paid", "Paid"),
+							...$.paidCount > 0 ? { trend: "up" } : {}
 						})
 					]
-				}), /* @__PURE__ */ P(F, {
+				}), /* @__PURE__ */ F(I, {
 					treatment: "insight",
 					className: "p-6",
 					children: [
-						/* @__PURE__ */ N("p", {
+						/* @__PURE__ */ P("p", {
 							className: "text-sm font-semibold text-text-primary",
-							children: "Status breakdown"
+							children: o("invoices.metrics.statusBreakdown", "Status breakdown")
 						}),
-						/* @__PURE__ */ N("p", {
+						/* @__PURE__ */ P("p", {
 							className: "text-xs text-text-secondary",
-							children: "Across the invoices on this page"
+							children: o("invoices.metrics.statusBreakdownHint", "Across the invoices on this page")
 						}),
-						/* @__PURE__ */ P("div", {
+						/* @__PURE__ */ F("div", {
 							className: "mt-4 flex flex-col items-center gap-5 sm:flex-row sm:items-center lg:flex-col xl:flex-row",
-							children: [/* @__PURE__ */ N(p, {
-								data: Z.distribution,
+							children: [/* @__PURE__ */ P(m, {
+								data: $.distribution,
 								size: 132,
 								thickness: 16,
-								centerLabel: String(Y.length),
-								centerSub: "invoices",
+								centerLabel: String(Z.length),
+								centerSub: o("invoices.metrics.invoices", "invoices"),
 								className: "shrink-0"
-							}), /* @__PURE__ */ N(m, {
-								data: Z.distribution,
+							}), /* @__PURE__ */ P(h, {
+								data: $.distribution,
 								className: "w-full min-w-0 flex-1",
 								valueFormat: (e) => String(e)
 							})]
@@ -592,104 +590,104 @@ function J() {
 					]
 				})]
 			}),
-			/* @__PURE__ */ N("div", {
+			/* @__PURE__ */ P("div", {
 				className: "mt-6 flex flex-wrap items-center gap-3",
-				children: /* @__PURE__ */ N("select", {
-					"aria-label": "Filter by status",
-					value: g,
+				children: /* @__PURE__ */ P("select", {
+					"aria-label": o("invoices.filters.statusLabel", "Filter by status"),
+					value: _,
 					onChange: (e) => {
-						y(e.target.value), h(0);
+						b(e.target.value), g(0);
 					},
 					className: "rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-xs text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
-					children: B.map((e) => /* @__PURE__ */ N("option", {
+					children: j.map((e) => /* @__PURE__ */ P("option", {
 						value: e.value,
 						children: e.label
 					}, e.value))
 				})
 			}),
-			j ? /* @__PURE__ */ N(u, { label: "Loading invoices…" }) : R ? /* @__PURE__ */ N(l, {
-				message: "Could not load invoices.",
-				onRetry: () => void z()
-			}) : Y.length === 0 ? /* @__PURE__ */ N("div", {
+			R ? /* @__PURE__ */ P(d, { label: o("invoices.loading", "Loading invoices…") }) : z ? /* @__PURE__ */ P(u, {
+				message: o("invoices.error", "Could not load invoices."),
+				onRetry: () => void H()
+			}) : Z.length === 0 ? /* @__PURE__ */ P("div", {
 				className: "mt-6",
-				children: /* @__PURE__ */ N(s, {
+				children: /* @__PURE__ */ P(c, {
 					illustration: "empty-data",
-					icon: /* @__PURE__ */ N(k, { className: "h-12 w-12" }),
-					title: "No invoices",
-					description: g ? "No invoices match this status filter." : "Invoices from your relationships will appear here — or create one manually.",
-					action: /* @__PURE__ */ N("button", {
+					icon: /* @__PURE__ */ P(A, { className: "h-12 w-12" }),
+					title: o("invoices.emptyTitle", "No invoices"),
+					description: _ ? o("invoices.emptyDescriptionFiltered", "No invoices match this status filter.") : o("invoices.emptyDescription", "Invoices from your relationships will appear here — or create one manually."),
+					action: /* @__PURE__ */ P("button", {
 						type: "button",
-						onClick: () => E(!0),
+						onClick: () => O(!0),
 						className: "rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90",
-						children: "Create invoice"
+						children: o("invoices.create", "Create invoice")
 					})
 				})
-			}) : /* @__PURE__ */ P(M, { children: [/* @__PURE__ */ P("div", {
+			}) : /* @__PURE__ */ F(N, { children: [/* @__PURE__ */ F("div", {
 				className: "mt-6 overflow-hidden rounded-lg border border-border-subtle bg-bg-surface",
-				children: [/* @__PURE__ */ P("div", {
+				children: [/* @__PURE__ */ F("div", {
 					className: "hidden grid-cols-[1.3fr_1.2fr_0.8fr_0.8fr_0.8fr_auto] gap-4 border-b border-border-subtle bg-bg-sunken px-4 py-2.5 text-xs font-medium text-text-secondary sm:grid",
 					children: [
-						/* @__PURE__ */ N("span", { children: "Invoice" }),
-						/* @__PURE__ */ N("span", { children: "Subscription" }),
-						/* @__PURE__ */ N("span", { children: "Status" }),
-						/* @__PURE__ */ N("span", {
+						/* @__PURE__ */ P("span", { children: o("invoices.table.invoice", "Invoice") }),
+						/* @__PURE__ */ P("span", { children: o("invoices.table.subscription", "Subscription") }),
+						/* @__PURE__ */ P("span", { children: o("invoices.table.status", "Status") }),
+						/* @__PURE__ */ P("span", {
 							className: "text-right",
-							children: "Total"
+							children: o("invoices.table.total", "Total")
 						}),
-						/* @__PURE__ */ N("span", {
+						/* @__PURE__ */ P("span", {
 							className: "text-right",
-							children: "Due"
+							children: o("invoices.table.due", "Due")
 						}),
-						/* @__PURE__ */ N("span", {
+						/* @__PURE__ */ P("span", {
 							className: "text-right",
-							children: "Action"
+							children: o("invoices.table.action", "Action")
 						})
 					]
-				}), /* @__PURE__ */ N("div", {
+				}), /* @__PURE__ */ P("div", {
 					className: "divide-y divide-border-subtle",
-					children: Y.map((e) => /* @__PURE__ */ P("div", {
+					children: Z.map((e) => /* @__PURE__ */ F("div", {
 						className: "grid grid-cols-1 gap-2 px-4 py-3 transition-colors hover:bg-bg-sunken/50 sm:grid-cols-[1.3fr_1.2fr_0.8fr_0.8fr_0.8fr_auto] sm:items-center sm:gap-4",
 						children: [
-							/* @__PURE__ */ P("button", {
+							/* @__PURE__ */ F("button", {
 								type: "button",
-								onClick: () => c(`/relationships/${e.relationshipId}`),
+								onClick: () => l(`/relationships/${e.relationshipId}`),
 								className: "min-w-0 text-left",
-								children: [/* @__PURE__ */ N("p", {
+								children: [/* @__PURE__ */ P("p", {
 									className: "truncate text-sm font-medium text-text-primary",
-									children: e.number || `Invoice ${e.id.slice(0, 8)}`
-								}), /* @__PURE__ */ N("p", {
+									children: e.number || `${o("invoices.table.invoice", "Invoice")} ${e.id.slice(0, 8)}`
+								}), /* @__PURE__ */ P("p", {
 									className: "text-xs text-text-secondary",
-									children: e.issueDate ? `Issued ${a(e.issueDate)}` : "—"
+									children: e.issueDate ? o("invoices.table.issued", "Issued {{date}}", { date: a(e.issueDate) }) : "—"
 								})]
 							}),
-							/* @__PURE__ */ N("span", {
+							/* @__PURE__ */ P("span", {
 								className: "min-w-0 truncate text-sm text-text-secondary",
-								children: J.get(e.relationshipId) ?? "—"
+								children: X.get(e.relationshipId) ?? "—"
 							}),
-							/* @__PURE__ */ N("span", { children: /* @__PURE__ */ N(o, { status: e.status }) }),
-							/* @__PURE__ */ N("span", {
+							/* @__PURE__ */ P("span", { children: /* @__PURE__ */ P(s, { status: e.status }) }),
+							/* @__PURE__ */ P("span", {
 								className: "text-sm font-semibold tabular-nums text-text-primary sm:text-right",
 								children: i(e.total, e.currency)
 							}),
-							/* @__PURE__ */ N("span", {
+							/* @__PURE__ */ P("span", {
 								className: "text-xs text-text-secondary sm:text-right",
 								children: e.dueDate ? a(e.dueDate) : "—"
 							}),
-							/* @__PURE__ */ N("span", {
+							/* @__PURE__ */ P("span", {
 								className: "sm:text-right",
-								children: U.has(e.status) ? /* @__PURE__ */ P("button", {
+								children: U.has(e.status) ? /* @__PURE__ */ F("button", {
 									type: "button",
-									disabled: H.isPending,
-									onClick: () => H.mutate(e.id),
+									disabled: J.isPending,
+									onClick: () => J.mutate(e.id),
 									className: "inline-flex items-center gap-1.5 rounded-lg border border-status-success-text/30 bg-status-success-bg-subtle px-3 py-1.5 text-xs font-medium text-status-success-text hover:opacity-90 disabled:opacity-50",
-									children: [/* @__PURE__ */ N(T, {
+									children: [/* @__PURE__ */ P(D, {
 										className: "h-3.5 w-3.5",
 										"aria-hidden": !0
-									}), "Mark paid"]
+									}), o("invoices.table.markPaid", "Mark paid")]
 								}) : e.paidAt ? /* @__PURE__ */ P("span", {
 									className: "text-xs text-text-secondary",
-									children: ["Paid ", a(e.paidAt)]
-								}) : /* @__PURE__ */ N("span", {
+									children: o("invoices.table.paidAt", "Paid {{date}}", { date: a(e.paidAt) })
+								}) : /* @__PURE__ */ P("span", {
 									className: "text-xs text-text-secondary",
 									children: "—"
 								})
@@ -697,34 +695,30 @@ function J() {
 						]
 					}, e.id))
 				})]
-			}), /* @__PURE__ */ P("div", {
+			}), /* @__PURE__ */ F("div", {
 				className: "mt-4 flex items-center justify-between",
-				children: [/* @__PURE__ */ P("p", {
+				children: [/* @__PURE__ */ F("p", {
 					className: "text-xs text-text-secondary",
-					children: [
-						"Page ",
-						d + 1,
-						V ? " · refreshing…" : ""
-					]
-				}), /* @__PURE__ */ P("div", {
+					children: [o("invoices.pagination.page", "Page {{page}}", { page: f + 1 }), K ? ` · ${o("invoices.pagination.refreshing", "refreshing…")}` : ""]
+				}), /* @__PURE__ */ F("div", {
 					className: "flex gap-2",
-					children: [/* @__PURE__ */ N("button", {
+					children: [/* @__PURE__ */ P("button", {
 						type: "button",
-						disabled: d === 0,
-						onClick: () => h((e) => Math.max(0, e - 1)),
-						className: t("rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium", d === 0 ? "cursor-not-allowed text-text-secondary opacity-50" : "text-text-primary hover:bg-bg-sunken"),
-						children: "Previous"
-					}), /* @__PURE__ */ N("button", {
+						disabled: f === 0,
+						onClick: () => g((e) => Math.max(0, e - 1)),
+						className: t("rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium", f === 0 ? "cursor-not-allowed text-text-secondary opacity-50" : "text-text-primary hover:bg-bg-sunken"),
+						children: o("invoices.pagination.previous", "Previous")
+					}), /* @__PURE__ */ P("button", {
 						type: "button",
-						disabled: !X,
-						onClick: () => h((e) => e + 1),
-						className: t("rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium", X ? "text-text-primary hover:bg-bg-sunken" : "cursor-not-allowed text-text-secondary opacity-50"),
-						children: "Next"
+						disabled: !Q,
+						onClick: () => g((e) => e + 1),
+						className: t("rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium", Q ? "text-text-primary hover:bg-bg-sunken" : "cursor-not-allowed text-text-secondary opacity-50"),
+						children: o("invoices.pagination.next", "Next")
 					})]
 				})]
 			})] }),
-			/* @__PURE__ */ N(q, {}),
-			x && /* @__PURE__ */ N(G, { onClose: () => E(!1) })
+			/* @__PURE__ */ P(q, {}),
+			S && /* @__PURE__ */ P(G, { onClose: () => O(!1) })
 		]
 	});
 }