order-management 0.0.76 → 0.0.77
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.
|
@@ -2,7 +2,7 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
|
|
2
2
|
import { defineWidgetConfig, defineRouteConfig } from "@medusajs/admin-sdk";
|
|
3
3
|
import { useState, useEffect, useRef, useCallback, useMemo } from "react";
|
|
4
4
|
import { Container, Text, Heading, Badge, Button, Label, Select, Textarea, Input } from "@medusajs/ui";
|
|
5
|
-
import { CashSolid, PencilSquareSolid, Trash,
|
|
5
|
+
import { CashSolid, PencilSquareSolid, Trash, CreditCard, Receipt, ArrowPath, CheckCircle, ArrowLeft } from "@medusajs/icons";
|
|
6
6
|
import { useNavigate, useParams } from "react-router-dom";
|
|
7
7
|
function roundRectPath(ctx, x, y, w, h, r) {
|
|
8
8
|
ctx.beginPath();
|
|
@@ -872,16 +872,216 @@ const getStatusBadgeClass$7 = (status) => {
|
|
|
872
872
|
if (s2 === "pending" || s2 === "requires_more") return "bg-ui-tag-orange-bg text-ui-tag-orange-text";
|
|
873
873
|
return "bg-ui-tag-purple-bg text-ui-tag-purple-text";
|
|
874
874
|
};
|
|
875
|
-
const
|
|
875
|
+
const PaymentsPage = () => {
|
|
876
876
|
const navigate = useNavigate();
|
|
877
877
|
const [items, setItems] = useState([]);
|
|
878
|
+
const [statusFilter, setStatusFilter] = useState("all");
|
|
878
879
|
const [orderIdSearch, setOrderIdSearch] = useState("");
|
|
879
880
|
const debouncedOrderId = useDebounce$3(orderIdSearch, 300);
|
|
881
|
+
const [isLoading, setIsLoading] = useState(true);
|
|
882
|
+
const [isFetchingMore, setIsFetchingMore] = useState(false);
|
|
883
|
+
const [error, setError] = useState(null);
|
|
884
|
+
const [offset, setOffset] = useState(0);
|
|
885
|
+
const [count, setCount] = useState(0);
|
|
886
|
+
const limit = 50;
|
|
887
|
+
const loadTransactions = useCallback(
|
|
888
|
+
async (nextOffset, replace) => {
|
|
889
|
+
try {
|
|
890
|
+
if (replace) setIsLoading(true);
|
|
891
|
+
else setIsFetchingMore(true);
|
|
892
|
+
setError(null);
|
|
893
|
+
const params = new URLSearchParams();
|
|
894
|
+
params.set("limit", String(limit));
|
|
895
|
+
params.set("offset", String(nextOffset));
|
|
896
|
+
if (statusFilter !== "all") params.set("status", statusFilter);
|
|
897
|
+
if (debouncedOrderId.trim()) params.set("order_id", debouncedOrderId.trim());
|
|
898
|
+
const response = await fetch(
|
|
899
|
+
`/admin/payment-transactions?${params.toString()}`,
|
|
900
|
+
{ credentials: "include" }
|
|
901
|
+
);
|
|
902
|
+
if (!response.ok) {
|
|
903
|
+
const text = await response.text();
|
|
904
|
+
throw new Error(text || "Failed to load payment transactions");
|
|
905
|
+
}
|
|
906
|
+
const payload = await response.json();
|
|
907
|
+
const list = payload.transactions ?? [];
|
|
908
|
+
setCount(payload.count ?? 0);
|
|
909
|
+
setOffset(nextOffset + list.length);
|
|
910
|
+
setItems((prev) => replace ? list : [...prev, ...list]);
|
|
911
|
+
} catch (e) {
|
|
912
|
+
setError(e instanceof Error ? e.message : "Failed to load");
|
|
913
|
+
} finally {
|
|
914
|
+
setIsLoading(false);
|
|
915
|
+
setIsFetchingMore(false);
|
|
916
|
+
}
|
|
917
|
+
},
|
|
918
|
+
[statusFilter, debouncedOrderId]
|
|
919
|
+
);
|
|
920
|
+
useEffect(() => {
|
|
921
|
+
void loadTransactions(0, true);
|
|
922
|
+
}, [loadTransactions]);
|
|
923
|
+
const hasMore = useMemo(() => offset < count, [offset, count]);
|
|
924
|
+
const displayStatus = (t) => {
|
|
925
|
+
const s2 = t.payment_id != null && t.payment_status != null && t.payment_status !== "" ? t.payment_status : t.session_status ?? "";
|
|
926
|
+
return s2 !== "" ? s2 : "—";
|
|
927
|
+
};
|
|
928
|
+
const displayAmount = (t) => {
|
|
929
|
+
const code = (t.currency_code ?? "USD").toUpperCase();
|
|
930
|
+
return `${code} ${Number(t.amount)}`;
|
|
931
|
+
};
|
|
932
|
+
return /* @__PURE__ */ jsx("div", { className: "w-full p-6", children: /* @__PURE__ */ jsxs(Container, { className: "mx-auto flex w-full max-w-7xl flex-col gap-6 p-6", children: [
|
|
933
|
+
/* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
|
|
934
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
935
|
+
/* @__PURE__ */ jsx(Heading, { level: "h1", children: "Payments" }),
|
|
936
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "All payment attempts — completed, pending, failed, requires action" })
|
|
937
|
+
] }),
|
|
938
|
+
/* @__PURE__ */ jsx(Button, { variant: "primary", onClick: () => loadTransactions(0, true), children: "Refresh" })
|
|
939
|
+
] }),
|
|
940
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
|
|
941
|
+
/* @__PURE__ */ jsx(
|
|
942
|
+
Input,
|
|
943
|
+
{
|
|
944
|
+
placeholder: "Search by Order ID",
|
|
945
|
+
value: orderIdSearch,
|
|
946
|
+
onChange: (e) => setOrderIdSearch(e.target.value),
|
|
947
|
+
className: "md:max-w-sm",
|
|
948
|
+
"aria-label": "Search by order ID"
|
|
949
|
+
}
|
|
950
|
+
),
|
|
951
|
+
/* @__PURE__ */ jsx("div", { className: "flex gap-3", children: /* @__PURE__ */ jsxs(
|
|
952
|
+
"select",
|
|
953
|
+
{
|
|
954
|
+
value: statusFilter,
|
|
955
|
+
onChange: (e) => setStatusFilter(e.target.value),
|
|
956
|
+
className: "h-9 rounded-md border border-ui-border-base bg-transparent px-3 text-sm text-ui-fg-base outline-none transition focus:ring-2 focus:ring-ui-fg-interactive md:max-w-xs",
|
|
957
|
+
"aria-label": "Filter by status",
|
|
958
|
+
children: [
|
|
959
|
+
/* @__PURE__ */ jsx("option", { value: "all", children: "All statuses" }),
|
|
960
|
+
/* @__PURE__ */ jsx("option", { value: "pending", children: "Pending" }),
|
|
961
|
+
/* @__PURE__ */ jsx("option", { value: "requires_more", children: "Requires more" }),
|
|
962
|
+
/* @__PURE__ */ jsx("option", { value: "error", children: "Error" }),
|
|
963
|
+
/* @__PURE__ */ jsx("option", { value: "canceled", children: "Canceled" }),
|
|
964
|
+
/* @__PURE__ */ jsx("option", { value: "authorized", children: "Authorized" }),
|
|
965
|
+
/* @__PURE__ */ jsx("option", { value: "captured", children: "Captured" })
|
|
966
|
+
]
|
|
967
|
+
}
|
|
968
|
+
) })
|
|
969
|
+
] }),
|
|
970
|
+
error ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-ui-border-strong p-6 text-center", children: [
|
|
971
|
+
/* @__PURE__ */ jsx(Text, { weight: "plus", className: "text-ui-fg-error", children: error }),
|
|
972
|
+
/* @__PURE__ */ jsx("div", { className: "mt-4 flex justify-center", children: /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: () => loadTransactions(0, true), children: "Try again" }) })
|
|
973
|
+
] }) : null,
|
|
974
|
+
isLoading ? /* @__PURE__ */ jsx("div", { className: "flex justify-center py-16", children: /* @__PURE__ */ jsx(Text, { children: "Loading payments…" }) }) : items.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-dashed border-ui-border-strong p-10 text-center", children: [
|
|
975
|
+
/* @__PURE__ */ jsx(Heading, { level: "h3", className: "text-xl", children: "No payment transactions yet" }),
|
|
976
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "mt-2 text-ui-fg-subtle", children: "Payment attempts will appear here." })
|
|
977
|
+
] }) : /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-xl border border-ui-border-base", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full divide-y divide-ui-border-base", children: [
|
|
978
|
+
/* @__PURE__ */ jsx("thead", { className: "bg-ui-bg-subtle", children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
979
|
+
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Order ID" }),
|
|
980
|
+
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Amount" }),
|
|
981
|
+
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Provider" }),
|
|
982
|
+
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Status" }),
|
|
983
|
+
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Finalized" }),
|
|
984
|
+
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Created" }),
|
|
985
|
+
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Actions" })
|
|
986
|
+
] }) }),
|
|
987
|
+
/* @__PURE__ */ jsx("tbody", { className: "divide-y divide-ui-border-subtle", children: items.map((t) => /* @__PURE__ */ jsxs(
|
|
988
|
+
"tr",
|
|
989
|
+
{
|
|
990
|
+
className: "hover:bg-ui-bg-subtle/60 cursor-pointer",
|
|
991
|
+
onClick: () => navigate(`/payments/${t.payment_session_id}`),
|
|
992
|
+
children: [
|
|
993
|
+
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 font-medium text-ui-fg-base", children: t.order_id ?? "—" }),
|
|
994
|
+
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: displayAmount(t) }),
|
|
995
|
+
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: t.provider_id }),
|
|
996
|
+
/* @__PURE__ */ jsx("td", { className: "px-4 py-4", children: /* @__PURE__ */ jsx(
|
|
997
|
+
Badge,
|
|
998
|
+
{
|
|
999
|
+
size: "2xsmall",
|
|
1000
|
+
className: `uppercase ${getStatusBadgeClass$7(displayStatus(t))}`,
|
|
1001
|
+
children: displayStatus(t) !== "—" ? displayStatus(t).replace(/_/g, " ") : "—"
|
|
1002
|
+
}
|
|
1003
|
+
) }),
|
|
1004
|
+
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: t.payment_id != null ? "Yes" : "No" }),
|
|
1005
|
+
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: new Date(t.created_at).toLocaleDateString("en-US", {
|
|
1006
|
+
year: "numeric",
|
|
1007
|
+
month: "short",
|
|
1008
|
+
day: "numeric",
|
|
1009
|
+
hour: "numeric",
|
|
1010
|
+
minute: "2-digit",
|
|
1011
|
+
hour12: true
|
|
1012
|
+
}) }),
|
|
1013
|
+
/* @__PURE__ */ jsxs("td", { className: "px-4 py-4", children: [
|
|
1014
|
+
/* @__PURE__ */ jsx(
|
|
1015
|
+
Button,
|
|
1016
|
+
{
|
|
1017
|
+
variant: "transparent",
|
|
1018
|
+
size: "small",
|
|
1019
|
+
onClick: (e) => {
|
|
1020
|
+
e.stopPropagation();
|
|
1021
|
+
navigate(`/payments/${t.payment_session_id}`);
|
|
1022
|
+
},
|
|
1023
|
+
children: "View details"
|
|
1024
|
+
}
|
|
1025
|
+
),
|
|
1026
|
+
t.order_id ? /* @__PURE__ */ jsx(
|
|
1027
|
+
Button,
|
|
1028
|
+
{
|
|
1029
|
+
variant: "transparent",
|
|
1030
|
+
size: "small",
|
|
1031
|
+
onClick: (e) => {
|
|
1032
|
+
e.stopPropagation();
|
|
1033
|
+
navigate(`/orders/${t.order_id}`);
|
|
1034
|
+
},
|
|
1035
|
+
children: "Order"
|
|
1036
|
+
}
|
|
1037
|
+
) : null
|
|
1038
|
+
] })
|
|
1039
|
+
]
|
|
1040
|
+
},
|
|
1041
|
+
t.payment_session_id
|
|
1042
|
+
)) })
|
|
1043
|
+
] }) }),
|
|
1044
|
+
hasMore ? /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
|
|
1045
|
+
Button,
|
|
1046
|
+
{
|
|
1047
|
+
variant: "secondary",
|
|
1048
|
+
isLoading: isFetchingMore,
|
|
1049
|
+
onClick: () => loadTransactions(offset, false),
|
|
1050
|
+
children: "Load more"
|
|
1051
|
+
}
|
|
1052
|
+
) }) : null
|
|
1053
|
+
] }) });
|
|
1054
|
+
};
|
|
1055
|
+
const config$7 = defineRouteConfig({
|
|
1056
|
+
label: "Payments",
|
|
1057
|
+
icon: CreditCard
|
|
1058
|
+
});
|
|
1059
|
+
const useDebounce$2 = (value, delay) => {
|
|
1060
|
+
const [debouncedValue, setDebouncedValue] = useState(value);
|
|
1061
|
+
useEffect(() => {
|
|
1062
|
+
const handler = setTimeout(() => setDebouncedValue(value), delay);
|
|
1063
|
+
return () => clearTimeout(handler);
|
|
1064
|
+
}, [value, delay]);
|
|
1065
|
+
return debouncedValue;
|
|
1066
|
+
};
|
|
1067
|
+
const getStatusBadgeClass$6 = (status) => {
|
|
1068
|
+
const s2 = status.toLowerCase();
|
|
1069
|
+
if (s2 === "captured" || s2 === "completed") return "bg-ui-tag-green-bg text-ui-tag-green-text";
|
|
1070
|
+
if (s2 === "authorized") return "bg-ui-tag-blue-bg text-ui-tag-blue-text";
|
|
1071
|
+
if (s2 === "error" || s2 === "canceled" || s2 === "cancelled") return "bg-ui-tag-red-bg text-ui-tag-red-text";
|
|
1072
|
+
if (s2 === "pending" || s2 === "requires_more") return "bg-ui-tag-orange-bg text-ui-tag-orange-text";
|
|
1073
|
+
return "bg-ui-tag-purple-bg text-ui-tag-purple-text";
|
|
1074
|
+
};
|
|
1075
|
+
const RefundsPage = () => {
|
|
1076
|
+
const navigate = useNavigate();
|
|
1077
|
+
const [items, setItems] = useState([]);
|
|
1078
|
+
const [orderIdSearch, setOrderIdSearch] = useState("");
|
|
1079
|
+
const debouncedOrderId = useDebounce$2(orderIdSearch, 300);
|
|
880
1080
|
const [paymentStatusFilter, setPaymentStatusFilter] = useState("all");
|
|
881
1081
|
const [providerSearch, setProviderSearch] = useState("");
|
|
882
|
-
const debouncedProvider = useDebounce$
|
|
1082
|
+
const debouncedProvider = useDebounce$2(providerSearch, 300);
|
|
883
1083
|
const [currencySearch, setCurrencySearch] = useState("");
|
|
884
|
-
const debouncedCurrency = useDebounce$
|
|
1084
|
+
const debouncedCurrency = useDebounce$2(currencySearch, 300);
|
|
885
1085
|
const [dateFrom, setDateFrom] = useState("");
|
|
886
1086
|
const [dateTo, setDateTo] = useState("");
|
|
887
1087
|
const [amountMin, setAmountMin] = useState("");
|
|
@@ -1093,7 +1293,7 @@ const RefundsPage = () => {
|
|
|
1093
1293
|
Badge,
|
|
1094
1294
|
{
|
|
1095
1295
|
size: "2xsmall",
|
|
1096
|
-
className: `uppercase ${getStatusBadgeClass$
|
|
1296
|
+
className: `uppercase ${getStatusBadgeClass$6(displayStatus(r))}`,
|
|
1097
1297
|
children: displayStatus(r) !== "—" ? displayStatus(r).replace(/_/g, " ") : "—"
|
|
1098
1298
|
}
|
|
1099
1299
|
) }),
|
|
@@ -1147,210 +1347,10 @@ const RefundsPage = () => {
|
|
|
1147
1347
|
) }) : null
|
|
1148
1348
|
] }) });
|
|
1149
1349
|
};
|
|
1150
|
-
const config$
|
|
1350
|
+
const config$6 = defineRouteConfig({
|
|
1151
1351
|
label: "Refunds",
|
|
1152
1352
|
icon: Receipt
|
|
1153
1353
|
});
|
|
1154
|
-
const useDebounce$2 = (value, delay) => {
|
|
1155
|
-
const [debouncedValue, setDebouncedValue] = useState(value);
|
|
1156
|
-
useEffect(() => {
|
|
1157
|
-
const handler = setTimeout(() => setDebouncedValue(value), delay);
|
|
1158
|
-
return () => clearTimeout(handler);
|
|
1159
|
-
}, [value, delay]);
|
|
1160
|
-
return debouncedValue;
|
|
1161
|
-
};
|
|
1162
|
-
const getStatusBadgeClass$6 = (status) => {
|
|
1163
|
-
const s2 = status.toLowerCase();
|
|
1164
|
-
if (s2 === "captured" || s2 === "completed") return "bg-ui-tag-green-bg text-ui-tag-green-text";
|
|
1165
|
-
if (s2 === "authorized") return "bg-ui-tag-blue-bg text-ui-tag-blue-text";
|
|
1166
|
-
if (s2 === "error" || s2 === "canceled" || s2 === "cancelled") return "bg-ui-tag-red-bg text-ui-tag-red-text";
|
|
1167
|
-
if (s2 === "pending" || s2 === "requires_more") return "bg-ui-tag-orange-bg text-ui-tag-orange-text";
|
|
1168
|
-
return "bg-ui-tag-purple-bg text-ui-tag-purple-text";
|
|
1169
|
-
};
|
|
1170
|
-
const PaymentsPage = () => {
|
|
1171
|
-
const navigate = useNavigate();
|
|
1172
|
-
const [items, setItems] = useState([]);
|
|
1173
|
-
const [statusFilter, setStatusFilter] = useState("all");
|
|
1174
|
-
const [orderIdSearch, setOrderIdSearch] = useState("");
|
|
1175
|
-
const debouncedOrderId = useDebounce$2(orderIdSearch, 300);
|
|
1176
|
-
const [isLoading, setIsLoading] = useState(true);
|
|
1177
|
-
const [isFetchingMore, setIsFetchingMore] = useState(false);
|
|
1178
|
-
const [error, setError] = useState(null);
|
|
1179
|
-
const [offset, setOffset] = useState(0);
|
|
1180
|
-
const [count, setCount] = useState(0);
|
|
1181
|
-
const limit = 50;
|
|
1182
|
-
const loadTransactions = useCallback(
|
|
1183
|
-
async (nextOffset, replace) => {
|
|
1184
|
-
try {
|
|
1185
|
-
if (replace) setIsLoading(true);
|
|
1186
|
-
else setIsFetchingMore(true);
|
|
1187
|
-
setError(null);
|
|
1188
|
-
const params = new URLSearchParams();
|
|
1189
|
-
params.set("limit", String(limit));
|
|
1190
|
-
params.set("offset", String(nextOffset));
|
|
1191
|
-
if (statusFilter !== "all") params.set("status", statusFilter);
|
|
1192
|
-
if (debouncedOrderId.trim()) params.set("order_id", debouncedOrderId.trim());
|
|
1193
|
-
const response = await fetch(
|
|
1194
|
-
`/admin/payment-transactions?${params.toString()}`,
|
|
1195
|
-
{ credentials: "include" }
|
|
1196
|
-
);
|
|
1197
|
-
if (!response.ok) {
|
|
1198
|
-
const text = await response.text();
|
|
1199
|
-
throw new Error(text || "Failed to load payment transactions");
|
|
1200
|
-
}
|
|
1201
|
-
const payload = await response.json();
|
|
1202
|
-
const list = payload.transactions ?? [];
|
|
1203
|
-
setCount(payload.count ?? 0);
|
|
1204
|
-
setOffset(nextOffset + list.length);
|
|
1205
|
-
setItems((prev) => replace ? list : [...prev, ...list]);
|
|
1206
|
-
} catch (e) {
|
|
1207
|
-
setError(e instanceof Error ? e.message : "Failed to load");
|
|
1208
|
-
} finally {
|
|
1209
|
-
setIsLoading(false);
|
|
1210
|
-
setIsFetchingMore(false);
|
|
1211
|
-
}
|
|
1212
|
-
},
|
|
1213
|
-
[statusFilter, debouncedOrderId]
|
|
1214
|
-
);
|
|
1215
|
-
useEffect(() => {
|
|
1216
|
-
void loadTransactions(0, true);
|
|
1217
|
-
}, [loadTransactions]);
|
|
1218
|
-
const hasMore = useMemo(() => offset < count, [offset, count]);
|
|
1219
|
-
const displayStatus = (t) => {
|
|
1220
|
-
const s2 = t.payment_id != null && t.payment_status != null && t.payment_status !== "" ? t.payment_status : t.session_status ?? "";
|
|
1221
|
-
return s2 !== "" ? s2 : "—";
|
|
1222
|
-
};
|
|
1223
|
-
const displayAmount = (t) => {
|
|
1224
|
-
const code = (t.currency_code ?? "USD").toUpperCase();
|
|
1225
|
-
return `${code} ${Number(t.amount)}`;
|
|
1226
|
-
};
|
|
1227
|
-
return /* @__PURE__ */ jsx("div", { className: "w-full p-6", children: /* @__PURE__ */ jsxs(Container, { className: "mx-auto flex w-full max-w-7xl flex-col gap-6 p-6", children: [
|
|
1228
|
-
/* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
|
|
1229
|
-
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
1230
|
-
/* @__PURE__ */ jsx(Heading, { level: "h1", children: "Payments" }),
|
|
1231
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "All payment attempts — completed, pending, failed, requires action" })
|
|
1232
|
-
] }),
|
|
1233
|
-
/* @__PURE__ */ jsx(Button, { variant: "primary", onClick: () => loadTransactions(0, true), children: "Refresh" })
|
|
1234
|
-
] }),
|
|
1235
|
-
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
|
|
1236
|
-
/* @__PURE__ */ jsx(
|
|
1237
|
-
Input,
|
|
1238
|
-
{
|
|
1239
|
-
placeholder: "Search by Order ID",
|
|
1240
|
-
value: orderIdSearch,
|
|
1241
|
-
onChange: (e) => setOrderIdSearch(e.target.value),
|
|
1242
|
-
className: "md:max-w-sm",
|
|
1243
|
-
"aria-label": "Search by order ID"
|
|
1244
|
-
}
|
|
1245
|
-
),
|
|
1246
|
-
/* @__PURE__ */ jsx("div", { className: "flex gap-3", children: /* @__PURE__ */ jsxs(
|
|
1247
|
-
"select",
|
|
1248
|
-
{
|
|
1249
|
-
value: statusFilter,
|
|
1250
|
-
onChange: (e) => setStatusFilter(e.target.value),
|
|
1251
|
-
className: "h-9 rounded-md border border-ui-border-base bg-transparent px-3 text-sm text-ui-fg-base outline-none transition focus:ring-2 focus:ring-ui-fg-interactive md:max-w-xs",
|
|
1252
|
-
"aria-label": "Filter by status",
|
|
1253
|
-
children: [
|
|
1254
|
-
/* @__PURE__ */ jsx("option", { value: "all", children: "All statuses" }),
|
|
1255
|
-
/* @__PURE__ */ jsx("option", { value: "pending", children: "Pending" }),
|
|
1256
|
-
/* @__PURE__ */ jsx("option", { value: "requires_more", children: "Requires more" }),
|
|
1257
|
-
/* @__PURE__ */ jsx("option", { value: "error", children: "Error" }),
|
|
1258
|
-
/* @__PURE__ */ jsx("option", { value: "canceled", children: "Canceled" }),
|
|
1259
|
-
/* @__PURE__ */ jsx("option", { value: "authorized", children: "Authorized" }),
|
|
1260
|
-
/* @__PURE__ */ jsx("option", { value: "captured", children: "Captured" })
|
|
1261
|
-
]
|
|
1262
|
-
}
|
|
1263
|
-
) })
|
|
1264
|
-
] }),
|
|
1265
|
-
error ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-ui-border-strong p-6 text-center", children: [
|
|
1266
|
-
/* @__PURE__ */ jsx(Text, { weight: "plus", className: "text-ui-fg-error", children: error }),
|
|
1267
|
-
/* @__PURE__ */ jsx("div", { className: "mt-4 flex justify-center", children: /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: () => loadTransactions(0, true), children: "Try again" }) })
|
|
1268
|
-
] }) : null,
|
|
1269
|
-
isLoading ? /* @__PURE__ */ jsx("div", { className: "flex justify-center py-16", children: /* @__PURE__ */ jsx(Text, { children: "Loading payments…" }) }) : items.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-dashed border-ui-border-strong p-10 text-center", children: [
|
|
1270
|
-
/* @__PURE__ */ jsx(Heading, { level: "h3", className: "text-xl", children: "No payment transactions yet" }),
|
|
1271
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "mt-2 text-ui-fg-subtle", children: "Payment attempts will appear here." })
|
|
1272
|
-
] }) : /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-xl border border-ui-border-base", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full divide-y divide-ui-border-base", children: [
|
|
1273
|
-
/* @__PURE__ */ jsx("thead", { className: "bg-ui-bg-subtle", children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
1274
|
-
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Order ID" }),
|
|
1275
|
-
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Amount" }),
|
|
1276
|
-
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Provider" }),
|
|
1277
|
-
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Status" }),
|
|
1278
|
-
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Finalized" }),
|
|
1279
|
-
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Created" }),
|
|
1280
|
-
/* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-ui-fg-muted", children: "Actions" })
|
|
1281
|
-
] }) }),
|
|
1282
|
-
/* @__PURE__ */ jsx("tbody", { className: "divide-y divide-ui-border-subtle", children: items.map((t) => /* @__PURE__ */ jsxs(
|
|
1283
|
-
"tr",
|
|
1284
|
-
{
|
|
1285
|
-
className: "hover:bg-ui-bg-subtle/60 cursor-pointer",
|
|
1286
|
-
onClick: () => navigate(`/payments/${t.payment_session_id}`),
|
|
1287
|
-
children: [
|
|
1288
|
-
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 font-medium text-ui-fg-base", children: t.order_id ?? "—" }),
|
|
1289
|
-
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: displayAmount(t) }),
|
|
1290
|
-
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: t.provider_id }),
|
|
1291
|
-
/* @__PURE__ */ jsx("td", { className: "px-4 py-4", children: /* @__PURE__ */ jsx(
|
|
1292
|
-
Badge,
|
|
1293
|
-
{
|
|
1294
|
-
size: "2xsmall",
|
|
1295
|
-
className: `uppercase ${getStatusBadgeClass$6(displayStatus(t))}`,
|
|
1296
|
-
children: displayStatus(t) !== "—" ? displayStatus(t).replace(/_/g, " ") : "—"
|
|
1297
|
-
}
|
|
1298
|
-
) }),
|
|
1299
|
-
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: t.payment_id != null ? "Yes" : "No" }),
|
|
1300
|
-
/* @__PURE__ */ jsx("td", { className: "px-4 py-4 text-ui-fg-subtle", children: new Date(t.created_at).toLocaleDateString("en-US", {
|
|
1301
|
-
year: "numeric",
|
|
1302
|
-
month: "short",
|
|
1303
|
-
day: "numeric",
|
|
1304
|
-
hour: "numeric",
|
|
1305
|
-
minute: "2-digit",
|
|
1306
|
-
hour12: true
|
|
1307
|
-
}) }),
|
|
1308
|
-
/* @__PURE__ */ jsxs("td", { className: "px-4 py-4", children: [
|
|
1309
|
-
/* @__PURE__ */ jsx(
|
|
1310
|
-
Button,
|
|
1311
|
-
{
|
|
1312
|
-
variant: "transparent",
|
|
1313
|
-
size: "small",
|
|
1314
|
-
onClick: (e) => {
|
|
1315
|
-
e.stopPropagation();
|
|
1316
|
-
navigate(`/payments/${t.payment_session_id}`);
|
|
1317
|
-
},
|
|
1318
|
-
children: "View details"
|
|
1319
|
-
}
|
|
1320
|
-
),
|
|
1321
|
-
t.order_id ? /* @__PURE__ */ jsx(
|
|
1322
|
-
Button,
|
|
1323
|
-
{
|
|
1324
|
-
variant: "transparent",
|
|
1325
|
-
size: "small",
|
|
1326
|
-
onClick: (e) => {
|
|
1327
|
-
e.stopPropagation();
|
|
1328
|
-
navigate(`/orders/${t.order_id}`);
|
|
1329
|
-
},
|
|
1330
|
-
children: "Order"
|
|
1331
|
-
}
|
|
1332
|
-
) : null
|
|
1333
|
-
] })
|
|
1334
|
-
]
|
|
1335
|
-
},
|
|
1336
|
-
t.payment_session_id
|
|
1337
|
-
)) })
|
|
1338
|
-
] }) }),
|
|
1339
|
-
hasMore ? /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
|
|
1340
|
-
Button,
|
|
1341
|
-
{
|
|
1342
|
-
variant: "secondary",
|
|
1343
|
-
isLoading: isFetchingMore,
|
|
1344
|
-
onClick: () => loadTransactions(offset, false),
|
|
1345
|
-
children: "Load more"
|
|
1346
|
-
}
|
|
1347
|
-
) }) : null
|
|
1348
|
-
] }) });
|
|
1349
|
-
};
|
|
1350
|
-
const config$6 = defineRouteConfig({
|
|
1351
|
-
label: "Payments",
|
|
1352
|
-
icon: CreditCard
|
|
1353
|
-
});
|
|
1354
1354
|
const useDebounce$1 = (value, delay) => {
|
|
1355
1355
|
const [debouncedValue, setDebouncedValue] = useState(value);
|
|
1356
1356
|
useEffect(() => {
|
|
@@ -1798,22 +1798,141 @@ const SwapsPage = () => {
|
|
|
1798
1798
|
swap.id
|
|
1799
1799
|
)) })
|
|
1800
1800
|
] }) }),
|
|
1801
|
-
hasMore ? /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
|
|
1802
|
-
Button,
|
|
1803
|
-
{
|
|
1804
|
-
variant: "secondary",
|
|
1805
|
-
isLoading: isFetchingMore,
|
|
1806
|
-
onClick: () => loadSwaps(offset, false),
|
|
1807
|
-
children: "Load more"
|
|
1808
|
-
}
|
|
1809
|
-
) }) : null
|
|
1801
|
+
hasMore ? /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
|
|
1802
|
+
Button,
|
|
1803
|
+
{
|
|
1804
|
+
variant: "secondary",
|
|
1805
|
+
isLoading: isFetchingMore,
|
|
1806
|
+
onClick: () => loadSwaps(offset, false),
|
|
1807
|
+
children: "Load more"
|
|
1808
|
+
}
|
|
1809
|
+
) }) : null
|
|
1810
|
+
] }) });
|
|
1811
|
+
};
|
|
1812
|
+
const config$4 = defineRouteConfig({
|
|
1813
|
+
label: "Exchanges",
|
|
1814
|
+
icon: ArrowPath
|
|
1815
|
+
});
|
|
1816
|
+
const getStatusBadgeClass$3 = (status) => {
|
|
1817
|
+
const s2 = status.toLowerCase();
|
|
1818
|
+
if (s2 === "captured" || s2 === "completed") return "bg-ui-tag-green-bg text-ui-tag-green-text";
|
|
1819
|
+
if (s2 === "authorized") return "bg-ui-tag-blue-bg text-ui-tag-blue-text";
|
|
1820
|
+
if (s2 === "error" || s2 === "canceled" || s2 === "cancelled") return "bg-ui-tag-red-bg text-ui-tag-red-text";
|
|
1821
|
+
if (s2 === "pending" || s2 === "requires_more") return "bg-ui-tag-orange-bg text-ui-tag-orange-text";
|
|
1822
|
+
return "bg-ui-tag-purple-bg text-ui-tag-purple-text";
|
|
1823
|
+
};
|
|
1824
|
+
const PaymentDetailPage = () => {
|
|
1825
|
+
var _a;
|
|
1826
|
+
const navigate = useNavigate();
|
|
1827
|
+
const params = useParams();
|
|
1828
|
+
const id = (_a = params == null ? void 0 : params.id) == null ? void 0 : _a.trim();
|
|
1829
|
+
const [detail, setDetail] = useState(null);
|
|
1830
|
+
const [loading, setLoading] = useState(!!id);
|
|
1831
|
+
const [error, setError] = useState(null);
|
|
1832
|
+
useEffect(() => {
|
|
1833
|
+
if (!id) {
|
|
1834
|
+
setLoading(false);
|
|
1835
|
+
return;
|
|
1836
|
+
}
|
|
1837
|
+
let cancelled = false;
|
|
1838
|
+
setLoading(true);
|
|
1839
|
+
setError(null);
|
|
1840
|
+
fetch(`/admin/payment-transactions/${id}`, { credentials: "include" }).then((res) => {
|
|
1841
|
+
if (!res.ok) throw new Error(res.statusText || "Failed to load");
|
|
1842
|
+
return res.json();
|
|
1843
|
+
}).then((data) => {
|
|
1844
|
+
if (!cancelled) setDetail(data);
|
|
1845
|
+
}).catch((e) => {
|
|
1846
|
+
if (!cancelled) setError(e instanceof Error ? e.message : "Failed to load");
|
|
1847
|
+
}).finally(() => {
|
|
1848
|
+
if (!cancelled) setLoading(false);
|
|
1849
|
+
});
|
|
1850
|
+
return () => {
|
|
1851
|
+
cancelled = true;
|
|
1852
|
+
};
|
|
1853
|
+
}, [id]);
|
|
1854
|
+
const displayStatus = detail ? (detail.payment_id != null && detail.payment_status != null && detail.payment_status !== "" ? detail.payment_status : detail.session_status ?? "") || "—" : "";
|
|
1855
|
+
const sessionStatusRaw = (detail == null ? void 0 : detail.session_status) ?? "—";
|
|
1856
|
+
const paymentStatusRaw = (detail == null ? void 0 : detail.payment_id) != null ? (detail == null ? void 0 : detail.payment_status) ?? "—" : "—";
|
|
1857
|
+
const displayAmount = detail ? `${(detail.currency_code ?? "USD").toUpperCase()} ${Number(detail.amount)}` : "";
|
|
1858
|
+
return /* @__PURE__ */ jsx("div", { className: "w-full p-6", children: /* @__PURE__ */ jsxs(Container, { className: "mx-auto flex w-full max-w-4xl flex-col gap-6 p-6", children: [
|
|
1859
|
+
/* @__PURE__ */ jsx("header", { className: "flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
1860
|
+
/* @__PURE__ */ jsx(Button, { variant: "transparent", size: "small", onClick: () => navigate("/payments"), children: "← Payments" }),
|
|
1861
|
+
/* @__PURE__ */ jsx(Heading, { level: "h1", children: "Payment session" }),
|
|
1862
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: id ?? "—" })
|
|
1863
|
+
] }) }),
|
|
1864
|
+
error ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-ui-border-strong p-6 text-center", children: [
|
|
1865
|
+
/* @__PURE__ */ jsx(Text, { weight: "plus", className: "text-ui-fg-error", children: error }),
|
|
1866
|
+
/* @__PURE__ */ jsx(Button, { variant: "secondary", className: "mt-4", onClick: () => navigate("/payments"), children: "Back to list" })
|
|
1867
|
+
] }) : loading ? /* @__PURE__ */ jsx("div", { className: "flex justify-center py-16", children: /* @__PURE__ */ jsx(Text, { children: "Loading…" }) }) : detail ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
|
|
1868
|
+
/* @__PURE__ */ jsx("div", { className: "rounded-xl border border-ui-border-base p-6 flex flex-col gap-4", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
|
|
1869
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1870
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Order ID" }),
|
|
1871
|
+
/* @__PURE__ */ jsx("div", { className: "mt-1", children: detail.order_id ? /* @__PURE__ */ jsx(
|
|
1872
|
+
Button,
|
|
1873
|
+
{
|
|
1874
|
+
variant: "transparent",
|
|
1875
|
+
size: "small",
|
|
1876
|
+
onClick: () => navigate(`/orders/${detail.order_id}`),
|
|
1877
|
+
children: detail.order_id
|
|
1878
|
+
}
|
|
1879
|
+
) : /* @__PURE__ */ jsx(Text, { children: "—" }) })
|
|
1880
|
+
] }),
|
|
1881
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1882
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Amount" }),
|
|
1883
|
+
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: displayAmount })
|
|
1884
|
+
] }),
|
|
1885
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1886
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Provider" }),
|
|
1887
|
+
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: detail.provider_id })
|
|
1888
|
+
] }),
|
|
1889
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1890
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Status" }),
|
|
1891
|
+
/* @__PURE__ */ jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsx(
|
|
1892
|
+
Badge,
|
|
1893
|
+
{
|
|
1894
|
+
size: "2xsmall",
|
|
1895
|
+
className: `uppercase ${getStatusBadgeClass$3(displayStatus)}`,
|
|
1896
|
+
children: displayStatus !== "—" ? displayStatus.replace(/_/g, " ") : "—"
|
|
1897
|
+
}
|
|
1898
|
+
) })
|
|
1899
|
+
] }),
|
|
1900
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1901
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Session status (DB)" }),
|
|
1902
|
+
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: sessionStatusRaw })
|
|
1903
|
+
] }),
|
|
1904
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1905
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Payment status (DB)" }),
|
|
1906
|
+
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: paymentStatusRaw })
|
|
1907
|
+
] }),
|
|
1908
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1909
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Finalized" }),
|
|
1910
|
+
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: detail.payment_id != null ? "Yes" : "No" })
|
|
1911
|
+
] }),
|
|
1912
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
1913
|
+
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Created" }),
|
|
1914
|
+
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: new Date(detail.created_at).toLocaleDateString("en-US", {
|
|
1915
|
+
year: "numeric",
|
|
1916
|
+
month: "short",
|
|
1917
|
+
day: "numeric",
|
|
1918
|
+
hour: "numeric",
|
|
1919
|
+
minute: "2-digit",
|
|
1920
|
+
hour12: true
|
|
1921
|
+
}) })
|
|
1922
|
+
] })
|
|
1923
|
+
] }) }),
|
|
1924
|
+
Object.keys(detail.data ?? {}).length > 0 ? /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-ui-border-base p-6", children: [
|
|
1925
|
+
/* @__PURE__ */ jsx(Heading, { level: "h2", className: "text-lg mb-4", children: "Provider data" }),
|
|
1926
|
+
/* @__PURE__ */ jsx("pre", { className: "text-xs bg-ui-bg-subtle p-4 rounded-lg overflow-auto max-h-96", children: JSON.stringify(detail.data, null, 2) })
|
|
1927
|
+
] }) : /* @__PURE__ */ jsx("div", { className: "rounded-xl border border-ui-border-base p-6", children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "No provider data for this session." }) })
|
|
1928
|
+
] }) : null
|
|
1810
1929
|
] }) });
|
|
1811
1930
|
};
|
|
1812
|
-
const config$
|
|
1813
|
-
label: "
|
|
1814
|
-
icon:
|
|
1931
|
+
const config$3 = defineRouteConfig({
|
|
1932
|
+
label: "Payment details",
|
|
1933
|
+
icon: CreditCard
|
|
1815
1934
|
});
|
|
1816
|
-
const getStatusBadgeClass$
|
|
1935
|
+
const getStatusBadgeClass$2 = (status) => {
|
|
1817
1936
|
const s2 = status.toLowerCase();
|
|
1818
1937
|
if (s2 === "captured" || s2 === "completed") return "bg-ui-tag-green-bg text-ui-tag-green-text";
|
|
1819
1938
|
if (s2 === "authorized") return "bg-ui-tag-blue-bg text-ui-tag-blue-text";
|
|
@@ -1924,7 +2043,7 @@ const RefundDetailPage = () => {
|
|
|
1924
2043
|
Badge,
|
|
1925
2044
|
{
|
|
1926
2045
|
size: "2xsmall",
|
|
1927
|
-
className: `uppercase ${getStatusBadgeClass$
|
|
2046
|
+
className: `uppercase ${getStatusBadgeClass$2(paymentStatus)}`,
|
|
1928
2047
|
children: paymentStatus !== "—" ? paymentStatus.replace(/_/g, " ") : "—"
|
|
1929
2048
|
}
|
|
1930
2049
|
) })
|
|
@@ -2001,129 +2120,10 @@ const RefundDetailPage = () => {
|
|
|
2001
2120
|
] }) : null
|
|
2002
2121
|
] }) });
|
|
2003
2122
|
};
|
|
2004
|
-
const config$
|
|
2123
|
+
const config$2 = defineRouteConfig({
|
|
2005
2124
|
label: "Refund details",
|
|
2006
2125
|
icon: Receipt
|
|
2007
2126
|
});
|
|
2008
|
-
const getStatusBadgeClass$2 = (status) => {
|
|
2009
|
-
const s2 = status.toLowerCase();
|
|
2010
|
-
if (s2 === "captured" || s2 === "completed") return "bg-ui-tag-green-bg text-ui-tag-green-text";
|
|
2011
|
-
if (s2 === "authorized") return "bg-ui-tag-blue-bg text-ui-tag-blue-text";
|
|
2012
|
-
if (s2 === "error" || s2 === "canceled" || s2 === "cancelled") return "bg-ui-tag-red-bg text-ui-tag-red-text";
|
|
2013
|
-
if (s2 === "pending" || s2 === "requires_more") return "bg-ui-tag-orange-bg text-ui-tag-orange-text";
|
|
2014
|
-
return "bg-ui-tag-purple-bg text-ui-tag-purple-text";
|
|
2015
|
-
};
|
|
2016
|
-
const PaymentDetailPage = () => {
|
|
2017
|
-
var _a;
|
|
2018
|
-
const navigate = useNavigate();
|
|
2019
|
-
const params = useParams();
|
|
2020
|
-
const id = (_a = params == null ? void 0 : params.id) == null ? void 0 : _a.trim();
|
|
2021
|
-
const [detail, setDetail] = useState(null);
|
|
2022
|
-
const [loading, setLoading] = useState(!!id);
|
|
2023
|
-
const [error, setError] = useState(null);
|
|
2024
|
-
useEffect(() => {
|
|
2025
|
-
if (!id) {
|
|
2026
|
-
setLoading(false);
|
|
2027
|
-
return;
|
|
2028
|
-
}
|
|
2029
|
-
let cancelled = false;
|
|
2030
|
-
setLoading(true);
|
|
2031
|
-
setError(null);
|
|
2032
|
-
fetch(`/admin/payment-transactions/${id}`, { credentials: "include" }).then((res) => {
|
|
2033
|
-
if (!res.ok) throw new Error(res.statusText || "Failed to load");
|
|
2034
|
-
return res.json();
|
|
2035
|
-
}).then((data) => {
|
|
2036
|
-
if (!cancelled) setDetail(data);
|
|
2037
|
-
}).catch((e) => {
|
|
2038
|
-
if (!cancelled) setError(e instanceof Error ? e.message : "Failed to load");
|
|
2039
|
-
}).finally(() => {
|
|
2040
|
-
if (!cancelled) setLoading(false);
|
|
2041
|
-
});
|
|
2042
|
-
return () => {
|
|
2043
|
-
cancelled = true;
|
|
2044
|
-
};
|
|
2045
|
-
}, [id]);
|
|
2046
|
-
const displayStatus = detail ? (detail.payment_id != null && detail.payment_status != null && detail.payment_status !== "" ? detail.payment_status : detail.session_status ?? "") || "—" : "";
|
|
2047
|
-
const sessionStatusRaw = (detail == null ? void 0 : detail.session_status) ?? "—";
|
|
2048
|
-
const paymentStatusRaw = (detail == null ? void 0 : detail.payment_id) != null ? (detail == null ? void 0 : detail.payment_status) ?? "—" : "—";
|
|
2049
|
-
const displayAmount = detail ? `${(detail.currency_code ?? "USD").toUpperCase()} ${Number(detail.amount)}` : "";
|
|
2050
|
-
return /* @__PURE__ */ jsx("div", { className: "w-full p-6", children: /* @__PURE__ */ jsxs(Container, { className: "mx-auto flex w-full max-w-4xl flex-col gap-6 p-6", children: [
|
|
2051
|
-
/* @__PURE__ */ jsx("header", { className: "flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
2052
|
-
/* @__PURE__ */ jsx(Button, { variant: "transparent", size: "small", onClick: () => navigate("/payments"), children: "← Payments" }),
|
|
2053
|
-
/* @__PURE__ */ jsx(Heading, { level: "h1", children: "Payment session" }),
|
|
2054
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: id ?? "—" })
|
|
2055
|
-
] }) }),
|
|
2056
|
-
error ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-ui-border-strong p-6 text-center", children: [
|
|
2057
|
-
/* @__PURE__ */ jsx(Text, { weight: "plus", className: "text-ui-fg-error", children: error }),
|
|
2058
|
-
/* @__PURE__ */ jsx(Button, { variant: "secondary", className: "mt-4", onClick: () => navigate("/payments"), children: "Back to list" })
|
|
2059
|
-
] }) : loading ? /* @__PURE__ */ jsx("div", { className: "flex justify-center py-16", children: /* @__PURE__ */ jsx(Text, { children: "Loading…" }) }) : detail ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
|
|
2060
|
-
/* @__PURE__ */ jsx("div", { className: "rounded-xl border border-ui-border-base p-6 flex flex-col gap-4", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
|
|
2061
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2062
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Order ID" }),
|
|
2063
|
-
/* @__PURE__ */ jsx("div", { className: "mt-1", children: detail.order_id ? /* @__PURE__ */ jsx(
|
|
2064
|
-
Button,
|
|
2065
|
-
{
|
|
2066
|
-
variant: "transparent",
|
|
2067
|
-
size: "small",
|
|
2068
|
-
onClick: () => navigate(`/orders/${detail.order_id}`),
|
|
2069
|
-
children: detail.order_id
|
|
2070
|
-
}
|
|
2071
|
-
) : /* @__PURE__ */ jsx(Text, { children: "—" }) })
|
|
2072
|
-
] }),
|
|
2073
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2074
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Amount" }),
|
|
2075
|
-
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: displayAmount })
|
|
2076
|
-
] }),
|
|
2077
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2078
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Provider" }),
|
|
2079
|
-
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: detail.provider_id })
|
|
2080
|
-
] }),
|
|
2081
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2082
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Status" }),
|
|
2083
|
-
/* @__PURE__ */ jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsx(
|
|
2084
|
-
Badge,
|
|
2085
|
-
{
|
|
2086
|
-
size: "2xsmall",
|
|
2087
|
-
className: `uppercase ${getStatusBadgeClass$2(displayStatus)}`,
|
|
2088
|
-
children: displayStatus !== "—" ? displayStatus.replace(/_/g, " ") : "—"
|
|
2089
|
-
}
|
|
2090
|
-
) })
|
|
2091
|
-
] }),
|
|
2092
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2093
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Session status (DB)" }),
|
|
2094
|
-
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: sessionStatusRaw })
|
|
2095
|
-
] }),
|
|
2096
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2097
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Payment status (DB)" }),
|
|
2098
|
-
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: paymentStatusRaw })
|
|
2099
|
-
] }),
|
|
2100
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2101
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Finalized" }),
|
|
2102
|
-
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: detail.payment_id != null ? "Yes" : "No" })
|
|
2103
|
-
] }),
|
|
2104
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
2105
|
-
/* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "Created" }),
|
|
2106
|
-
/* @__PURE__ */ jsx(Text, { className: "mt-1 block", children: new Date(detail.created_at).toLocaleDateString("en-US", {
|
|
2107
|
-
year: "numeric",
|
|
2108
|
-
month: "short",
|
|
2109
|
-
day: "numeric",
|
|
2110
|
-
hour: "numeric",
|
|
2111
|
-
minute: "2-digit",
|
|
2112
|
-
hour12: true
|
|
2113
|
-
}) })
|
|
2114
|
-
] })
|
|
2115
|
-
] }) }),
|
|
2116
|
-
Object.keys(detail.data ?? {}).length > 0 ? /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-ui-border-base p-6", children: [
|
|
2117
|
-
/* @__PURE__ */ jsx(Heading, { level: "h2", className: "text-lg mb-4", children: "Provider data" }),
|
|
2118
|
-
/* @__PURE__ */ jsx("pre", { className: "text-xs bg-ui-bg-subtle p-4 rounded-lg overflow-auto max-h-96", children: JSON.stringify(detail.data, null, 2) })
|
|
2119
|
-
] }) : /* @__PURE__ */ jsx("div", { className: "rounded-xl border border-ui-border-base p-6", children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-muted", children: "No provider data for this session." }) })
|
|
2120
|
-
] }) : null
|
|
2121
|
-
] }) });
|
|
2122
|
-
};
|
|
2123
|
-
const config$2 = defineRouteConfig({
|
|
2124
|
-
label: "Payment details",
|
|
2125
|
-
icon: CreditCard
|
|
2126
|
-
});
|
|
2127
2127
|
const getStatusBadgeClass$1 = (status) => {
|
|
2128
2128
|
const statusLower = status.toLowerCase();
|
|
2129
2129
|
if (statusLower === "requested") {
|
|
@@ -2694,14 +2694,14 @@ const widgetModule = { widgets: [
|
|
|
2694
2694
|
] };
|
|
2695
2695
|
const routeModule = {
|
|
2696
2696
|
routes: [
|
|
2697
|
-
{
|
|
2698
|
-
Component: RefundsPage,
|
|
2699
|
-
path: "/refunds"
|
|
2700
|
-
},
|
|
2701
2697
|
{
|
|
2702
2698
|
Component: PaymentsPage,
|
|
2703
2699
|
path: "/payments"
|
|
2704
2700
|
},
|
|
2701
|
+
{
|
|
2702
|
+
Component: RefundsPage,
|
|
2703
|
+
path: "/refunds"
|
|
2704
|
+
},
|
|
2705
2705
|
{
|
|
2706
2706
|
Component: ReturnsPage,
|
|
2707
2707
|
path: "/returns"
|
|
@@ -2710,14 +2710,14 @@ const routeModule = {
|
|
|
2710
2710
|
Component: SwapsPage,
|
|
2711
2711
|
path: "/swaps"
|
|
2712
2712
|
},
|
|
2713
|
-
{
|
|
2714
|
-
Component: RefundDetailPage,
|
|
2715
|
-
path: "/refunds/:id"
|
|
2716
|
-
},
|
|
2717
2713
|
{
|
|
2718
2714
|
Component: PaymentDetailPage,
|
|
2719
2715
|
path: "/payments/:id"
|
|
2720
2716
|
},
|
|
2717
|
+
{
|
|
2718
|
+
Component: RefundDetailPage,
|
|
2719
|
+
path: "/refunds/:id"
|
|
2720
|
+
},
|
|
2721
2721
|
{
|
|
2722
2722
|
Component: ReturnDetailPage,
|
|
2723
2723
|
path: "/returns/:id"
|
|
@@ -2730,16 +2730,10 @@ const routeModule = {
|
|
|
2730
2730
|
};
|
|
2731
2731
|
const menuItemModule = {
|
|
2732
2732
|
menuItems: [
|
|
2733
|
-
{
|
|
2734
|
-
label: config$6.label,
|
|
2735
|
-
icon: config$6.icon,
|
|
2736
|
-
path: "/payments",
|
|
2737
|
-
nested: void 0
|
|
2738
|
-
},
|
|
2739
2733
|
{
|
|
2740
2734
|
label: config$7.label,
|
|
2741
2735
|
icon: config$7.icon,
|
|
2742
|
-
path: "/
|
|
2736
|
+
path: "/payments",
|
|
2743
2737
|
nested: void 0
|
|
2744
2738
|
},
|
|
2745
2739
|
{
|
|
@@ -2748,6 +2742,12 @@ const menuItemModule = {
|
|
|
2748
2742
|
path: "/returns",
|
|
2749
2743
|
nested: void 0
|
|
2750
2744
|
},
|
|
2745
|
+
{
|
|
2746
|
+
label: config$6.label,
|
|
2747
|
+
icon: config$6.icon,
|
|
2748
|
+
path: "/refunds",
|
|
2749
|
+
nested: void 0
|
|
2750
|
+
},
|
|
2751
2751
|
{
|
|
2752
2752
|
label: config$4.label,
|
|
2753
2753
|
icon: config$4.icon,
|
|
@@ -2757,13 +2757,19 @@ const menuItemModule = {
|
|
|
2757
2757
|
{
|
|
2758
2758
|
label: config$3.label,
|
|
2759
2759
|
icon: config$3.icon,
|
|
2760
|
-
path: "/
|
|
2760
|
+
path: "/payments/:id",
|
|
2761
|
+
nested: void 0
|
|
2762
|
+
},
|
|
2763
|
+
{
|
|
2764
|
+
label: config$1.label,
|
|
2765
|
+
icon: config$1.icon,
|
|
2766
|
+
path: "/returns/:id",
|
|
2761
2767
|
nested: void 0
|
|
2762
2768
|
},
|
|
2763
2769
|
{
|
|
2764
2770
|
label: config$2.label,
|
|
2765
2771
|
icon: config$2.icon,
|
|
2766
|
-
path: "/
|
|
2772
|
+
path: "/refunds/:id",
|
|
2767
2773
|
nested: void 0
|
|
2768
2774
|
},
|
|
2769
2775
|
{
|
|
@@ -2771,12 +2777,6 @@ const menuItemModule = {
|
|
|
2771
2777
|
icon: config.icon,
|
|
2772
2778
|
path: "/swaps/:id",
|
|
2773
2779
|
nested: void 0
|
|
2774
|
-
},
|
|
2775
|
-
{
|
|
2776
|
-
label: config$1.label,
|
|
2777
|
-
icon: config$1.icon,
|
|
2778
|
-
path: "/returns/:id",
|
|
2779
|
-
nested: void 0
|
|
2780
2780
|
}
|
|
2781
2781
|
]
|
|
2782
2782
|
};
|