@reeboot/strapi-payment-plugin 0.0.5 → 0.0.7

package/dist/_chunks/{Payments-TOnygGIW.js → Payments-VzDGbK4W.js}

@@ -5,8 +5,9 @@ const React = require("react");
 const designSystem = require("@strapi/design-system");
 const reactIntl = require("react-intl");
 const admin = require("@strapi/strapi/admin");
-const index = require("./index-CHEgJ7e5.js");
-const PaymentList = require("./PaymentList-Dy1BAFoD.js");
+const index = require("./index-D-fFikb8.js");
+const icons = require("@strapi/icons");
+const PaymentList = require("./PaymentList-APfyYD1h.js");
 const RefundModal = ({ payment, onClose, onSuccess }) => {
   const { formatMessage } = reactIntl.useIntl();
   const { post } = admin.useFetchClient();
@@ -36,9 +37,7 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
       const { data } = await post(`/${index.PLUGIN_ID}/admin/payments/${payment.id}/refund`, {
         amount: refundAmount,
         reason,
-        metadata: {
-          admin_notes: notes
-        }
+        metadata: { admin_notes: notes }
       });
       if (data.success) {
         onSuccess();
@@ -88,7 +87,7 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "secondary", onClick: () => handlePartialRefund(25), children: formatMessage({ id: "payment-plugin.refund.quarter", defaultMessage: "25% Refund" }) })
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      /* @__PURE__ */ jsxRuntime.jsx(
         designSystem.TextInput,
         {
           label: formatMessage({ id: "payment-plugin.refund.amount", defaultMessage: "Refund Amount" }),
@@ -104,8 +103,8 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
             { amount: formatCurrency(payment.amount, payment.currency) }
           )
         }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(
         designSystem.SingleSelect,
         {
           label: formatMessage({ id: "payment-plugin.refund.reason", defaultMessage: "Reason" }),
@@ -117,8 +116,8 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
             /* @__PURE__ */ jsxRuntime.jsx(designSystem.SingleSelectOption, { value: "fraudulent", children: formatMessage({ id: "payment-plugin.refund.reason.fraudulent", defaultMessage: "Fraudulent" }) })
           ]
         }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
         designSystem.Textarea,
         {
           label: formatMessage({ id: "payment-plugin.refund.notes", defaultMessage: "Internal Notes (Optional)" }),
@@ -127,12 +126,29 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
           onChange: (e) => setNotes(e.target.value),
           rows: 3
         }
-      ) }),
-      error && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Alert, { variant: "danger", title: formatMessage({ id: "payment-plugin.refund.error", defaultMessage: "Error" }), children: error }),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Alert, { variant: "warning", title: formatMessage({ id: "payment-plugin.refund.warning", defaultMessage: "Warning" }), children: formatMessage({
-        id: "payment-plugin.refund.warningMessage",
-        defaultMessage: "This action cannot be undone. The refund will be processed immediately."
-      }) })
+      ),
+      error && /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.Alert,
+        {
+          variant: "danger",
+          title: formatMessage({ id: "payment-plugin.refund.error", defaultMessage: "Error" }),
+          closeLabel: formatMessage({ id: "payment-plugin.alert.close", defaultMessage: "Close alert" }),
+          onClose: () => setError(null),
+          children: error
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.Alert,
+        {
+          variant: "warning",
+          title: formatMessage({ id: "payment-plugin.refund.warning", defaultMessage: "Warning" }),
+          closeLabel: formatMessage({ id: "payment-plugin.alert.dismiss", defaultMessage: "Dismiss" }),
+          children: formatMessage({
+            id: "payment-plugin.refund.warningMessage",
+            defaultMessage: "This action cannot be undone. The refund will be processed immediately."
+          })
+        }
+      )
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Modal.Footer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "tertiary", onClick: onClose, disabled: loading, children: formatMessage({ id: "payment-plugin.refund.cancel", defaultMessage: "Cancel" }) }),
@@ -151,7 +167,7 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
 };
 const PaymentCard = ({ payment, onClose }) => {
   const { formatMessage } = reactIntl.useIntl();
-  console.log("Payment:", payment);
+  const [copied, setCopied] = React.useState(false);
   const formatCurrency = (amount, currency = "usd") => {
     return new Intl.NumberFormat("en-US", {
       style: "currency",
@@ -170,14 +186,19 @@ const PaymentCard = ({ payment, onClose }) => {
   };
   const getStatusBadge = (status) => {
     const statusConfig = {
-      succeeded: { color: "success", label: "Success" },
-      pending: { color: "warning", label: "Pending" },
-      failed: { color: "danger", label: "Failed" },
-      refunded: { color: "info", label: "Refunded" },
-      canceled: { color: "neutral", label: "Canceled" }
+      succeeded: { variant: "success", label: "Success" },
+      pending: { variant: "warning", label: "Pending" },
+      failed: { variant: "danger", label: "Failed" },
+      refunded: { variant: "secondary", label: "Refunded" },
+      canceled: { variant: "neutral", label: "Canceled" }
     };
     const config = statusConfig[status] || statusConfig.pending;
-    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Badge, { size: "M", backgroundColor: config.color, children: config.label });
+    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Badge, { variant: config.variant, children: config.label });
+  };
+  const handleCopyStripeId = () => {
+    navigator.clipboard.writeText(payment.stripe_payment_intent_id || "");
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2e3);
   };
   return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Root, { open: true, onOpenChange: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Modal.Content, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { fontWeight: "bold", textColor: "neutral800", as: "h2", id: "title", children: formatMessage({ id: "payment-plugin.paymentDetails.title", defaultMessage: "Payment Details" }) }) }),
@@ -227,15 +248,14 @@ const PaymentCard = ({ payment, onClose }) => {
       ] })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Modal.Footer, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: onClose, variant: "tertiary", children: "Close" }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: onClose, variant: "tertiary", children: formatMessage({ id: "payment-plugin.paymentDetails.close", defaultMessage: "Close" }) }),
       /* @__PURE__ */ jsxRuntime.jsx(
         designSystem.Button,
         {
-          onClick: () => {
-            navigator.clipboard.writeText(payment.stripe_payment_intent_id || "");
-            alert("Copied to clipboard");
-          },
-          children: "Copy Stripe ID"
+          startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Duplicate, {}),
+          onClick: handleCopyStripeId,
+          variant: copied ? "success" : "default",
+          children: copied ? formatMessage({ id: "payment-plugin.paymentDetails.copied", defaultMessage: "Copied!" }) : formatMessage({ id: "payment-plugin.paymentDetails.copyStripeId", defaultMessage: "Copy Stripe ID" })
         }
       )
     ] })
@@ -245,36 +265,32 @@ const Payments = () => {
   const { formatMessage } = reactIntl.useIntl();
   const { get } = admin.useFetchClient();
   const [payments, setPayments] = React.useState([]);
-  const [filteredPayments, setFilteredPayments] = React.useState([]);
   const [loading, setLoading] = React.useState(true);
   const [error, setError] = React.useState(null);
   const [selectedPayment, setSelectedPayment] = React.useState(null);
   const [showRefundModal, setShowRefundModal] = React.useState(false);
   const [showPaymentCard, setShowPaymentCard] = React.useState(false);
-  console.log("payments:", payments);
   const [currentPage, setCurrentPage] = React.useState(1);
-  const [pageSize, setPageSize] = React.useState(25);
+  const pageSize = 25;
   const [totalCount, setTotalCount] = React.useState(0);
   const [filters, setFilters] = React.useState({
     payment_status: "",
     paymentMethod: "",
-    dateRange: { from: null, to: null },
     search: "",
     currency: ""
   });
   React.useEffect(() => {
     fetchPayments();
-  }, [currentPage, pageSize, filters]);
-  React.useEffect(() => {
-    applyFilters();
-  }, [payments, filters]);
+  }, [currentPage, filters]);
   const fetchPayments = async () => {
     try {
       setLoading(true);
       const queryParams = new URLSearchParams({
         page: currentPage.toString(),
         pageSize: pageSize.toString(),
-        ...filters.payment_status && { payment_status: filters.payment_status }
+        ...filters.payment_status && { payment_status: filters.payment_status },
+        ...filters.search && { search: filters.search },
+        ...filters.currency && { currency: filters.currency }
       });
       const { data } = await get(`/${index.PLUGIN_ID}/admin/payments?${queryParams}`);
       if (data.success && data.data) {
@@ -286,7 +302,7 @@ const Payments = () => {
           orderId: p.order?.documentId
         }));
         setPayments(formattedPayments);
-        setTotalCount(data.meta.pagination.total);
+        setTotalCount(data.meta?.pagination?.total || 0);
       }
       setLoading(false);
     } catch (err) {
@@ -294,35 +310,7 @@ const Payments = () => {
       setLoading(false);
     }
   };
-  const applyFilters = () => {
-    let filtered = [...payments];
-    if (filters.search) {
-      const searchLower = filters.search.toLowerCase();
-      filtered = filtered.filter(
-        (payment) => payment.customerEmail.toLowerCase().includes(searchLower) || payment.customerName?.toLowerCase().includes(searchLower) || payment.stripe_payment_intent_id && payment.stripe_payment_intent_id.toLowerCase().includes(searchLower) || payment.description?.toLowerCase().includes(searchLower)
-      );
-    }
-    if (filters.payment_status) {
-      filtered = filtered.filter((payment) => payment.payment_status === filters.payment_status);
-    }
-    if (filters.paymentMethod) {
-      filtered = filtered.filter((payment) => payment.payment_method === filters.paymentMethod);
-    }
-    if (filters.currency) {
-      filtered = filtered.filter((payment) => payment.currency === filters.currency);
-    }
-    if (filters.dateRange.from) {
-      filtered = filtered.filter(
-        (payment) => new Date(payment.createdAt) >= filters.dateRange.from
-      );
-    }
-    if (filters.dateRange.to) {
-      filtered = filtered.filter(
-        (payment) => new Date(payment.createdAt) <= filters.dateRange.to
-      );
-    }
-    setFilteredPayments(filtered);
-  };
+  const totalPages = Math.max(1, Math.ceil(totalCount / pageSize));
   const formatDate = (dateString) => {
     return new Date(dateString).toLocaleDateString("en-US", {
       year: "numeric",
@@ -345,19 +333,13 @@ const Payments = () => {
     setCurrentPage(1);
   };
   const clearFilters = () => {
-    setFilters({
-      payment_status: "",
-      paymentMethod: "",
-      dateRange: { from: null, to: null },
-      search: "",
-      currency: ""
-    });
+    setFilters({ payment_status: "", paymentMethod: "", search: "", currency: "" });
     setCurrentPage(1);
   };
   const exportPayments = () => {
     const csvContent = [
       ["ID", "Stripe Payment ID", "Customer Email", "Amount", "Currency", "Status", "Payment Method", "Date"],
-      ...filteredPayments.map((payment) => [
+      ...payments.map((payment) => [
         payment.id,
         payment.stripe_payment_intent_id || "",
         payment.customerEmail || "",
@@ -376,19 +358,14 @@ const Payments = () => {
     a.click();
     window.URL.revokeObjectURL(url);
   };
-  const startIndex = (currentPage - 1) * pageSize;
-  const endIndex = startIndex + pageSize;
-  const paginatedPayments = filteredPayments.slice(startIndex, endIndex);
-  const totalPages = Math.ceil(filteredPayments.length / pageSize);
   if (loading && payments.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingLeft: 10, paddingRight: 10, paddingTop: 4, paddingBottom: 10, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "center", alignItems: "center", style: { minHeight: "400px" }, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Loader, {}) }) });
+    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "center", alignItems: "center", style: { minHeight: "400px" }, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Loader, {}) }) });
   }
   if (error) {
-    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingLeft: 10, paddingRight: 10, paddingTop: 4, paddingBottom: 10, children: /* @__PURE__ */ jsxRuntime.jsx(
+    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(
       designSystem.EmptyStateLayout,
       {
-        title: "Error loading payments",
-        subtitle: error,
+        content: error,
         action: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: fetchPayments, children: formatMessage({ id: "payment-plugin.payments.retry", defaultMessage: "Retry" }) })
       }
     ) });
@@ -404,13 +381,14 @@ const Payments = () => {
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 2, children: [
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "secondary", onClick: exportPayments, children: formatMessage({ id: "payment-plugin.payments.export", defaultMessage: "Export" }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: () => fetchPayments(), children: formatMessage({ id: "payment-plugin.payments.refresh", defaultMessage: "Refresh" }) })
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: fetchPayments, children: formatMessage({ id: "payment-plugin.payments.refresh", defaultMessage: "Refresh" }) })
       ] })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx(designSystem.Card, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { padding: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 4, children: [
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 3, children: /* @__PURE__ */ jsxRuntime.jsx(
         designSystem.TextInput,
         {
+          label: formatMessage({ id: "payment-plugin.payments.search.label", defaultMessage: "Search" }),
           placeholder: formatMessage({
             id: "payment-plugin.payments.search.placeholder",
             defaultMessage: "Search payments..."
@@ -422,6 +400,7 @@ const Payments = () => {
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(
         designSystem.SingleSelect,
         {
+          label: formatMessage({ id: "payment-plugin.payments.status.label", defaultMessage: "Status" }),
           placeholder: formatMessage({
             id: "payment-plugin.payments.status.placeholder",
             defaultMessage: "All Statuses"
@@ -440,9 +419,10 @@ const Payments = () => {
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(
         designSystem.SingleSelect,
         {
+          label: formatMessage({ id: "payment-plugin.payments.method.label", defaultMessage: "Method" }),
           placeholder: formatMessage({
             id: "payment-plugin.payments.paymentMethod.placeholder",
-            defaultMessage: "All Payment Methods"
+            defaultMessage: "All Methods"
           }),
           value: filters.paymentMethod,
           onChange: (value) => handleFilterChange("paymentMethod", value),
@@ -457,6 +437,7 @@ const Payments = () => {
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(
         designSystem.SingleSelect,
         {
+          label: formatMessage({ id: "payment-plugin.payments.currency.label", defaultMessage: "Currency" }),
           placeholder: formatMessage({
             id: "payment-plugin.payments.currency.placeholder",
             defaultMessage: "All Currencies"
@@ -471,33 +452,46 @@ const Payments = () => {
           ]
         }
       ) }),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 3, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { gap: 2, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "tertiary", onClick: clearFilters, children: formatMessage({ id: "payment-plugin.payments.clearFilters", defaultMessage: "Clear" }) }) }) })
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 3, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { gap: 2, alignItems: "flex-end", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "tertiary", onClick: clearFilters, children: formatMessage({ id: "payment-plugin.payments.clearFilters", defaultMessage: "Clear" }) }) }) })
     ] }) }) }),
     /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { marginTop: 4, marginBottom: 2, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "epsilon", textColor: "neutral600", children: formatMessage(
-      { id: "payment-plugin.payments.results", defaultMessage: "Showing {start}-{end} of {total} payments" },
-      {
-        start: startIndex + 1,
-        end: Math.min(endIndex, filteredPayments.length),
-        total: filteredPayments.length
-      }
+      { id: "payment-plugin.payments.results", defaultMessage: "{total} payments" },
+      { total: totalCount }
     ) }) }),
     /* @__PURE__ */ jsxRuntime.jsx(designSystem.Card, { children: /* @__PURE__ */ jsxRuntime.jsx(
       PaymentList.PaymentList,
       {
-        payments: paginatedPayments,
+        payments,
         onPaymentClick: (payment) => handleViewDetails(payment),
         onRefund: (payment) => handleRefund(payment),
         onViewDetails: (payment) => handleViewDetails(payment)
       }
     ) }),
-    totalPages > 1 && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { marginTop: 4, children: /* @__PURE__ */ jsxRuntime.jsx(
-      designSystem.Pagination,
-      {
-        currentPage,
-        pageCount: totalPages,
-        onPageChange: setCurrentPage
-      }
-    ) }),
+    totalPages > 1 && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { marginTop: 4, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "center", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Pagination, { activePage: currentPage, pageCount: totalPages, label: "Payments pagination", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.PreviousLink,
+        {
+          as: "button",
+          onClick: () => setCurrentPage((p) => Math.max(1, p - 1))
+        }
+      ),
+      Array.from({ length: totalPages }, (_, i) => i + 1).map((page) => /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.PageLink,
+        {
+          number: page,
+          as: "button",
+          onClick: () => setCurrentPage(page)
+        },
+        page
+      )),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.NextLink,
+        {
+          as: "button",
+          onClick: () => setCurrentPage((p) => Math.min(totalPages, p + 1))
+        }
+      )
+    ] }) }) }),
     showRefundModal && selectedPayment && /* @__PURE__ */ jsxRuntime.jsx(
       RefundModal,
       {