@burdenoff/microfe-billing 2026.912.6 → 2026.913.1

package/dist/billing/modules/billing/pages/RefundsPage.js

@@ -12,9 +12,10 @@ import { useRefunds as l } from "../hooks/useRefunds.js";
 import "../hooks/index.js";
 import { useCallback as u, useEffect as d, useMemo as f, useRef as p, useState as m } from "react";
 import { AlertTriangle as h, Ban as g, CheckCircle as _, ChevronLeft as v, ChevronRight as y, Clock as b, Download as x, Eye as S, Filter as C, Loader2 as w, MoreHorizontal as T, Play as E, Plus as ee, RefreshCw as te, RotateCcw as D, Search as O, SkipForward as k, X as A, XCircle as j } from "lucide-react";
+import { Link as ne } from "react-router";
 import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";
-import { useI18n as ne } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { CTAOverflowMenu as re, IllustratedEmptyState as ie, PagePurpose as ae, ResponsiveTable as oe } from "@burdenoff/fe-libs/ui";
+import { useI18n as re } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { CTAOverflowMenu as ie, IllustratedEmptyState as ae, PagePurpose as oe, ResponsiveTable as se } from "@burdenoff/fe-libs/ui";
 import { useApolloClient as F } from "@apollo/client/react";
 //#region src/billing/modules/billing/pages/RefundsPage.tsx
 var I = {
@@ -48,7 +49,7 @@ var I = {
 	WEBHOOK_RECOVERY: "Webhook Recovery",
 	SUBSCRIPTION_CANCEL: "Subscription Cancel",
 	DUPLICATE_PAYMENT: "Duplicate Payment"
-}, se = ["stripe", "razorpay"], R = (e) => {
+}, ce = ["stripe", "razorpay"], R = (e) => {
 	let t = {
 		yellow: `${n.warning.bg} ${n.warning.text}`,
 		blue: `${n.info.bg} ${n.info.text}`,
@@ -57,7 +58,7 @@ var I = {
 		gray: `${n.neutral.bg} ${n.neutral.text}`
 	};
 	return t[e] || t.gray;
-}, ce = ({ record: e, onViewDetails: t, onProcess: r, onSkip: i, onRetry: a, isProcessing: o }) => {
+}, le = ({ record: e, onViewDetails: t, onProcess: r, onSkip: i, onRetry: a, isProcessing: o }) => {
 	let [s, c] = m(!1), l = p(null);
 	d(() => {
 		let e = (e) => {
@@ -119,7 +120,7 @@ var I = {
 	gatewayPaymentId: "",
 	amount: 0,
 	currency: "USD"
-}, le = ({ isOpen: e, onClose: t, onSubmit: n, isSubmitting: r }) => {
+}, ue = ({ isOpen: e, onClose: t, onSubmit: n, isSubmitting: r }) => {
 	let a = F(), [o, s] = m(""), [l, d] = m(null), [f, p] = m(null), [h, g] = m(!1), [v, y] = m(z), b = () => {
 		s(""), d(null), p(null), y(z);
 	}, x = () => {
@@ -387,7 +388,7 @@ var I = {
 			})]
 		})]
 	});
-}, ue = ({ isOpen: e, record: t, onClose: r, onSubmit: a, isSubmitting: o }) => {
+}, de = ({ isOpen: e, record: t, onClose: r, onSubmit: a, isSubmitting: o }) => {
 	let [s, c] = m("");
 	return !e || !t ? null : /* @__PURE__ */ P("div", {
 		className: "fixed inset-0 z-50 flex items-center justify-center",
@@ -455,7 +456,7 @@ var I = {
 			})]
 		})]
 	});
-}, de = ({ record: e, onClose: t }) => {
+}, fe = ({ record: e, onClose: t }) => {
 	if (!e) return null;
 	let r = I[e.status].icon;
 	return /* @__PURE__ */ P("div", {
@@ -638,81 +639,81 @@ var I = {
 		status: void 0
 	}
 }, V = () => {
-	let { t: n } = ne(), c = (e, t) => {
+	let { t: n } = re(), c = (e, t) => {
 		let r = n(e);
 		return r === e ? t : r;
-	}, u = s(), [d, p] = m("PENDING"), [h, g] = m(""), [_, b] = m({}), [S, T] = m(!1), [E, D] = m(null), [k, j] = m(!1), [M, F] = m(!1), [z, V] = m(null), [fe, H] = m(null), { records: U, stats: W, pagination: G, isLoading: pe, recordsError: K, unprocessedWebhooks: q, refetch: J, goToNextPage: me, goToPreviousPage: he, setFilters: Y, createRefundRecord: ge, processRefund: _e, skipRefund: ve, retryRefund: ye, createRefundRecordsFromFailedWebhooks: be, isCreating: xe, isProcessing: Se, isCreatingFromWebhooks: X } = l({ filters: f(() => ({
-		..._,
+	}, u = s(), [d, p] = m("PENDING"), [g, _] = m(""), [b, S] = m({}), [T, E] = m(!1), [D, k] = m(null), [j, M] = m(!1), [F, z] = m(!1), [V, H] = m(null), [pe, U] = m(null), { records: W, stats: G, pagination: K, isLoading: me, recordsError: q, unprocessedWebhooks: J, refetch: Y, goToNextPage: he, goToPreviousPage: ge, setFilters: X, createRefundRecord: _e, processRefund: ve, skipRefund: ye, retryRefund: be, createRefundRecordsFromFailedWebhooks: xe, isCreating: Se, isProcessing: Ce, isCreatingFromWebhooks: Z } = l({ filters: f(() => ({
+		...b,
 		status: B[d].status
 	}), [
 		d,
-		_.source,
-		_.provider,
-		_.billingAccountId,
-		_.fromDate,
-		_.toDate
+		b.source,
+		b.provider,
+		b.billingAccountId,
+		b.fromDate,
+		b.toDate
 	]) });
 	if (!u.canViewPayments) return /* @__PURE__ */ N(e, { message: "You don't have permission to view refunds." });
-	if (K && o(K)) return /* @__PURE__ */ N("div", {
+	if (q && o(q)) return /* @__PURE__ */ N("div", {
 		className: "p-6",
 		children: /* @__PURE__ */ N(r, {
 			title: "Server Unavailable",
 			message: "Unable to load refunds. The server might be down or experiencing issues.",
-			onRetry: () => J(),
+			onRetry: () => Y(),
 			showRetry: !0
 		})
 	});
-	let Z = (e) => {
-		p(e), b({}), g("");
+	let we = (e) => {
+		p(e), S({}), _("");
 	}, Q = (e, t) => {
 		if (e === "status") return;
 		let n = {
-			..._,
+			...b,
 			[e]: t || void 0
 		};
-		b(n), Y({
+		S(n), X({
 			...n,
 			status: B[d].status
 		});
-	}, Ce = async (e) => {
+	}, Te = async (e) => {
 		try {
-			await ge(e), j(!1);
+			await _e(e), M(!1);
 		} catch (e) {
 			console.error("Failed to create refund:", e);
 		}
-	}, we = async (e) => {
-		H(e.id);
+	}, Ee = async (e) => {
+		U(e.id);
 		try {
-			let t = await _e(e.id);
+			let t = await ve(e.id);
 			!t.success && t.error && console.error("Refund processing failed:", t.error);
 		} catch (e) {
 			console.error("Failed to process refund:", e);
 		} finally {
-			H(null);
+			U(null);
 		}
-	}, Te = async (e) => {
-		if (z) try {
-			await ve(z.id, e), F(!1), V(null);
+	}, De = async (e) => {
+		if (V) try {
+			await ye(V.id, e), z(!1), H(null);
 		} catch (e) {
 			console.error("Failed to skip refund:", e);
 		}
-	}, Ee = async (e) => {
-		H(e.id);
+	}, Oe = async (e) => {
+		U(e.id);
 		try {
-			let t = await ye(e.id);
+			let t = await be(e.id);
 			!t.success && t.error && console.error("Refund retry failed:", t.error);
 		} catch (e) {
 			console.error("Failed to retry refund:", e);
 		} finally {
-			H(null);
+			U(null);
 		}
-	}, De = async () => {
+	}, ke = async () => {
 		try {
-			await be();
+			await xe();
 		} catch (e) {
 			console.error("Failed to create refunds from webhooks:", e);
 		}
-	}, $ = h ? U.filter((e) => e.gatewayPaymentId.toLowerCase().includes(h.toLowerCase()) || e.gatewayOrderId?.toLowerCase().includes(h.toLowerCase()) || e.reason?.toLowerCase().includes(h.toLowerCase())) : U, Oe = [
+	}, $ = g ? W.filter((e) => e.gatewayPaymentId.toLowerCase().includes(g.toLowerCase()) || e.gatewayOrderId?.toLowerCase().includes(g.toLowerCase()) || e.reason?.toLowerCase().includes(g.toLowerCase())) : W, Ae = [
 		{
 			key: "date",
 			header: "Date",
@@ -793,17 +794,17 @@ var I = {
 				children: e.reason || "-"
 			})
 		}
-	], ke = (e) => /* @__PURE__ */ N(ce, {
+	], je = (e) => /* @__PURE__ */ N(le, {
 		record: e,
-		onViewDetails: () => D(e),
-		onProcess: () => we(e),
+		onViewDetails: () => k(e),
+		onProcess: () => Ee(e),
 		onSkip: () => {
-			V(e), F(!0);
+			H(e), z(!0);
 		},
-		onRetry: () => Ee(e),
-		isProcessing: fe === e.id
+		onRetry: () => Oe(e),
+		isProcessing: pe === e.id
 	});
-	return pe ? /* @__PURE__ */ P("div", {
+	return me ? /* @__PURE__ */ P("div", {
 		className: "space-y-6 p-6",
 		children: [
 			/* @__PURE__ */ N("div", { className: "h-8 w-48 bg-bg-sunken animate-pulse rounded" }),
@@ -834,38 +835,45 @@ var I = {
 			/* @__PURE__ */ N(t, {
 				title: c("billing.refunds.title", "Refund Management"),
 				description: "View and manage refund records",
-				actions: /* @__PURE__ */ N(re, {
-					primary: {
-						label: "Create Manual Refund",
-						onSelect: () => j(!0),
-						icon: /* @__PURE__ */ N(ee, { className: "size-4" })
-					},
-					actions: [...q.length > 0 ? [{
-						label: `Import ${q.length} Failed Webhooks`,
-						onSelect: De,
-						disabled: X,
-						icon: X ? /* @__PURE__ */ N(w, { className: "size-4 animate-spin" }) : /* @__PURE__ */ N(x, { className: "size-4" })
-					}] : [], {
-						label: "Refresh",
-						onSelect: () => {
-							J();
+				actions: /* @__PURE__ */ P("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ P(ne, {
+						to: "logs",
+						className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md border border-border-subtle bg-bg-surface hover:bg-bg-sunken/50 transition-colors",
+						children: [/* @__PURE__ */ N(h, { className: "size-4" }), "View Issue Log"]
+					}), /* @__PURE__ */ N(ie, {
+						primary: {
+							label: "Create Manual Refund",
+							onSelect: () => M(!0),
+							icon: /* @__PURE__ */ N(ee, { className: "size-4" })
 						},
-						icon: /* @__PURE__ */ N(te, { className: "size-4" })
-					}]
+						actions: [...J.length > 0 ? [{
+							label: `Import ${J.length} Failed Webhooks`,
+							onSelect: ke,
+							disabled: Z,
+							icon: Z ? /* @__PURE__ */ N(w, { className: "size-4 animate-spin" }) : /* @__PURE__ */ N(x, { className: "size-4" })
+						}] : [], {
+							label: "Refresh",
+							onSelect: () => {
+								Y();
+							},
+							icon: /* @__PURE__ */ N(te, { className: "size-4" })
+						}]
+					})]
 				})
 			}),
-			/* @__PURE__ */ N(ae, { children: c("billing.refunds.purpose", "Track and act on every refund across all billing accounts — manual refunds, ones triggered by cancellations, and those recovered from failed payment-gateway webhooks. Use it to process pending refunds, retry failed ones, skip a refund with a reason, or create a manual refund for a specific transaction.") }),
+			/* @__PURE__ */ N(oe, { children: c("billing.refunds.purpose", "Track and act on every refund across all billing accounts — manual refunds, ones triggered by cancellations, and those recovered from failed payment-gateway webhooks. Use it to process pending refunds, retry failed ones, skip a refund with a reason, or create a manual refund for a specific transaction.") }),
 			/* @__PURE__ */ N("div", {
 				className: "border-b border-border-subtle",
 				children: /* @__PURE__ */ N("div", {
 					className: "flex flex-wrap gap-2 sm:gap-0",
 					children: Object.keys(B).map((e) => {
-						let t = d === e, n = W ? e === "PENDING" ? W.pending : e === "COMPLETED" ? W.completed : e === "FAILED" ? W.failed : W.pending + W.processing + W.completed + W.failed + W.skipped : 0;
+						let t = d === e, n = G ? e === "PENDING" ? G.pending : e === "COMPLETED" ? G.completed : e === "FAILED" ? G.failed : G.pending + G.processing + G.completed + G.failed + G.skipped : 0;
 						return /* @__PURE__ */ P("button", {
 							type: "button",
-							onClick: () => Z(e),
+							onClick: () => we(e),
 							className: `flex items-center gap-2 px-4 py-3 text-sm font-medium border-b-2 transition-colors whitespace-nowrap ${t ? "border-action-primary-bg text-text-link" : "border-transparent text-text-muted hover:text-text-primary hover:border-border-subtle"}`,
-							children: [B[e].label, W && /* @__PURE__ */ N("span", {
+							children: [B[e].label, G && /* @__PURE__ */ N("span", {
 								className: `px-2 py-0.5 text-xs rounded-full ${t ? "bg-[var(--color-accent-soft)] text-text-link" : "bg-bg-sunken text-text-muted"}`,
 								children: n
 							})]
@@ -881,42 +889,42 @@ var I = {
 						children: [/* @__PURE__ */ N(O, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-text-muted" }), /* @__PURE__ */ N("input", {
 							type: "text",
 							placeholder: "Search by payment ID, order ID, or reason...",
-							value: h,
-							onChange: (e) => g(e.target.value),
+							value: g,
+							onChange: (e) => _(e.target.value),
 							className: "w-full pl-[3.25rem] pr-4 py-2 border border-border-subtle rounded-md bg-bg-surface"
 						})]
 					}),
 					/* @__PURE__ */ P("button", {
 						type: "button",
-						onClick: () => T(!S),
-						className: `inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md border transition-colors ${S ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-link" : "border-border-subtle bg-bg-surface hover:bg-bg-sunken/50"}`,
+						onClick: () => E(!T),
+						className: `inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md border transition-colors ${T ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-link" : "border-border-subtle bg-bg-surface hover:bg-bg-sunken/50"}`,
 						children: [
 							/* @__PURE__ */ N(C, { className: "size-4" }),
 							"Filters",
-							Object.values(_).filter(Boolean).length > 0 && /* @__PURE__ */ N("span", {
+							Object.values(b).filter(Boolean).length > 0 && /* @__PURE__ */ N("span", {
 								className: "px-1.5 py-0.5 text-xs rounded-full bg-action-primary-bg text-action-primary-text",
-								children: Object.values(_).filter(Boolean).length
+								children: Object.values(b).filter(Boolean).length
 							})
 						]
 					}),
-					Object.values(_).filter(Boolean).length > 0 && /* @__PURE__ */ P("button", {
+					Object.values(b).filter(Boolean).length > 0 && /* @__PURE__ */ P("button", {
 						type: "button",
 						onClick: () => {
-							b({}), Y({});
+							S({}), X({});
 						},
 						className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md text-text-muted hover:text-text-primary transition-colors",
 						children: [/* @__PURE__ */ N(A, { className: "size-4" }), "Clear"]
 					})
 				]
 			}),
-			S && /* @__PURE__ */ P("div", {
+			T && /* @__PURE__ */ P("div", {
 				className: "p-4 border border-border-subtle rounded-lg bg-bg-sunken/30 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4",
 				children: [
 					/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("label", {
 						className: "block text-sm font-medium mb-1",
 						children: "Source"
 					}), /* @__PURE__ */ P("select", {
-						value: _.source || "",
+						value: b.source || "",
 						onChange: (e) => Q("source", e.target.value),
 						className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface",
 						children: [/* @__PURE__ */ N("option", {
@@ -931,13 +939,13 @@ var I = {
 						className: "block text-sm font-medium mb-1",
 						children: "Provider"
 					}), /* @__PURE__ */ P("select", {
-						value: _.provider || "",
+						value: b.provider || "",
 						onChange: (e) => Q("provider", e.target.value),
 						className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface",
 						children: [/* @__PURE__ */ N("option", {
 							value: "",
 							children: "All Providers"
-						}), se.map((e) => /* @__PURE__ */ N("option", {
+						}), ce.map((e) => /* @__PURE__ */ N("option", {
 							value: e,
 							children: e.charAt(0).toUpperCase() + e.slice(1)
 						}, e))]
@@ -952,7 +960,7 @@ var I = {
 							children: [
 								/* @__PURE__ */ N("input", {
 									type: "date",
-									value: _.fromDate ? _.fromDate.split("T")[0] : "",
+									value: b.fromDate ? b.fromDate.split("T")[0] : "",
 									onChange: (e) => Q("fromDate", e.target.value ? new Date(e.target.value).toISOString() : void 0),
 									className: "w-full sm:flex-1 p-2 border border-border-subtle rounded-md bg-bg-surface text-sm"
 								}),
@@ -962,7 +970,7 @@ var I = {
 								}),
 								/* @__PURE__ */ N("input", {
 									type: "date",
-									value: _.toDate ? _.toDate.split("T")[0] : "",
+									value: b.toDate ? b.toDate.split("T")[0] : "",
 									onChange: (e) => Q("toDate", e.target.value ? new Date(e.target.value).toISOString() : void 0),
 									className: "w-full sm:flex-1 p-2 border border-border-subtle rounded-md bg-bg-surface text-sm"
 								})
@@ -971,32 +979,32 @@ var I = {
 					})
 				]
 			}),
-			$.length === 0 ? /* @__PURE__ */ N(ie, {
-				illustration: Object.values(_).filter(Boolean).length > 0 ? "empty-search" : "empty-data",
+			$.length === 0 ? /* @__PURE__ */ N(ae, {
+				illustration: Object.values(b).filter(Boolean).length > 0 ? "empty-search" : "empty-data",
 				title: "No refund records found",
-				description: Object.values(_).filter(Boolean).length > 0 ? "Try adjusting your filters." : d === "PENDING" ? "No pending refunds to process." : "Refund records will appear here when created."
+				description: Object.values(b).filter(Boolean).length > 0 ? "Try adjusting your filters." : d === "PENDING" ? "No pending refunds to process." : "Refund records will appear here when created."
 			}) : /* @__PURE__ */ N("div", {
 				className: "border border-border-subtle rounded-lg overflow-hidden",
-				children: /* @__PURE__ */ N(oe, {
-					columns: Oe,
+				children: /* @__PURE__ */ N(se, {
+					columns: Ae,
 					data: $,
 					rowKey: (e) => e.id,
-					rowActions: ke
+					rowActions: je
 				})
 			}),
-			G.totalCount > 0 && /* @__PURE__ */ P("div", {
+			K.totalCount > 0 && /* @__PURE__ */ P("div", {
 				className: "flex flex-col sm:flex-row items-center justify-between gap-4 border-t border-border-subtle pt-4",
 				children: [/* @__PURE__ */ P("p", {
 					className: "text-sm text-text-muted text-center sm:text-left",
 					children: [
 						"Showing ",
-						G.page * G.pageSize + 1,
+						K.page * K.pageSize + 1,
 						" to",
 						" ",
-						Math.min((G.page + 1) * G.pageSize, G.totalCount),
+						Math.min((K.page + 1) * K.pageSize, K.totalCount),
 						" of",
 						" ",
-						G.totalCount,
+						K.totalCount,
 						" refunds"
 					]
 				}), /* @__PURE__ */ P("div", {
@@ -1004,8 +1012,8 @@ var I = {
 					children: [
 						/* @__PURE__ */ P("button", {
 							type: "button",
-							onClick: he,
-							disabled: !G.hasPrevious,
+							onClick: ge,
+							disabled: !K.hasPrevious,
 							className: "inline-flex items-center gap-1 px-3 py-1.5 text-sm font-medium rounded-button border border-border-subtle bg-bg-surface hover:bg-bg-sunken/50 disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
 							children: [/* @__PURE__ */ N(v, { className: "size-4" }), /* @__PURE__ */ N("span", {
 								className: "hidden sm:inline",
@@ -1019,7 +1027,7 @@ var I = {
 									className: "hidden sm:inline",
 									children: "Page "
 								}),
-								G.page + 1,
+								K.page + 1,
 								" ",
 								/* @__PURE__ */ N("span", {
 									className: "hidden sm:inline",
@@ -1030,13 +1038,13 @@ var I = {
 									children: "/"
 								}),
 								" ",
-								Math.ceil(G.totalCount / G.pageSize)
+								Math.ceil(K.totalCount / K.pageSize)
 							]
 						}),
 						/* @__PURE__ */ P("button", {
 							type: "button",
-							onClick: me,
-							disabled: !G.hasMore,
+							onClick: he,
+							disabled: !K.hasMore,
 							className: "inline-flex items-center gap-1 px-3 py-1.5 text-sm font-medium rounded-button border border-border-subtle bg-bg-surface hover:bg-bg-sunken/50 disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
 							children: [/* @__PURE__ */ N("span", {
 								className: "hidden sm:inline",
@@ -1046,24 +1054,24 @@ var I = {
 					]
 				})]
 			}),
-			/* @__PURE__ */ N(le, {
-				isOpen: k,
-				onClose: () => j(!1),
-				onSubmit: Ce,
-				isSubmitting: xe
-			}),
 			/* @__PURE__ */ N(ue, {
-				isOpen: M,
-				record: z,
-				onClose: () => {
-					F(!1), V(null);
-				},
+				isOpen: j,
+				onClose: () => M(!1),
 				onSubmit: Te,
 				isSubmitting: Se
 			}),
 			/* @__PURE__ */ N(de, {
-				record: E,
-				onClose: () => D(null)
+				isOpen: F,
+				record: V,
+				onClose: () => {
+					z(!1), H(null);
+				},
+				onSubmit: De,
+				isSubmitting: Ce
+			}),
+			/* @__PURE__ */ N(fe, {
+				record: D,
+				onClose: () => k(null)
 			})
 		]
 	});