@reeboot/strapi-payment-plugin 0.0.5 → 0.0.7

package/dist/_chunks/{Payments-FnhoV_2B.mjs → Payments-DFL-Cwgy.mjs}

@@ -1,10 +1,11 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
-import { Modal, Typography, Flex, Box, Button, TextInput, SingleSelect, SingleSelectOption, Textarea, Alert, Grid, Divider, Table, Tbody, Tr, Td, Badge, Loader, EmptyStateLayout, Card, Pagination } from "@strapi/design-system";
+import { Modal, Typography, Flex, Box, Button, TextInput, SingleSelect, SingleSelectOption, Textarea, Alert, Grid, Divider, Table, Tbody, Tr, Td, Badge, Loader, EmptyStateLayout, Card, Pagination, PreviousLink, PageLink, NextLink } from "@strapi/design-system";
 import { useIntl } from "react-intl";
 import { useFetchClient } from "@strapi/strapi/admin";
-import { P as PLUGIN_ID } from "./index-2Zd_T7bD.mjs";
-import { P as PaymentList } from "./PaymentList-B0CAzInT.mjs";
+import { P as PLUGIN_ID } from "./index-CB6TMitx.mjs";
+import { Duplicate } from "@strapi/icons";
+import { P as PaymentList } from "./PaymentList-3HWK7PMz.mjs";
 const RefundModal = ({ payment, onClose, onSuccess }) => {
   const { formatMessage } = useIntl();
   const { post } = useFetchClient();
@@ -34,9 +35,7 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
       const { data } = await post(`/${PLUGIN_ID}/admin/payments/${payment.id}/refund`, {
         amount: refundAmount,
         reason,
-        metadata: {
-          admin_notes: notes
-        }
+        metadata: { admin_notes: notes }
       });
       if (data.success) {
         onSuccess();
@@ -86,7 +85,7 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
           /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: () => handlePartialRefund(25), children: formatMessage({ id: "payment-plugin.refund.quarter", defaultMessage: "25% Refund" }) })
         ] })
       ] }),
-      /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(
         TextInput,
         {
           label: formatMessage({ id: "payment-plugin.refund.amount", defaultMessage: "Refund Amount" }),
@@ -102,8 +101,8 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
             { amount: formatCurrency(payment.amount, payment.currency) }
           )
         }
-      ) }),
-      /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(
+      ),
+      /* @__PURE__ */ jsxs(
         SingleSelect,
         {
           label: formatMessage({ id: "payment-plugin.refund.reason", defaultMessage: "Reason" }),
@@ -115,8 +114,8 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
             /* @__PURE__ */ jsx(SingleSelectOption, { value: "fraudulent", children: formatMessage({ id: "payment-plugin.refund.reason.fraudulent", defaultMessage: "Fraudulent" }) })
           ]
         }
-      ) }),
-      /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
+      ),
+      /* @__PURE__ */ jsx(
         Textarea,
         {
           label: formatMessage({ id: "payment-plugin.refund.notes", defaultMessage: "Internal Notes (Optional)" }),
@@ -125,12 +124,29 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
           onChange: (e) => setNotes(e.target.value),
           rows: 3
         }
-      ) }),
-      error && /* @__PURE__ */ jsx(Alert, { variant: "danger", title: formatMessage({ id: "payment-plugin.refund.error", defaultMessage: "Error" }), children: error }),
-      /* @__PURE__ */ jsx(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__ */ jsx(
+        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__ */ jsx(
+        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__ */ jsxs(Modal.Footer, { children: [
       /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: onClose, disabled: loading, children: formatMessage({ id: "payment-plugin.refund.cancel", defaultMessage: "Cancel" }) }),
@@ -149,7 +165,7 @@ const RefundModal = ({ payment, onClose, onSuccess }) => {
 };
 const PaymentCard = ({ payment, onClose }) => {
   const { formatMessage } = useIntl();
-  console.log("Payment:", payment);
+  const [copied, setCopied] = useState(false);
   const formatCurrency = (amount, currency = "usd") => {
     return new Intl.NumberFormat("en-US", {
       style: "currency",
@@ -168,14 +184,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__ */ jsx(Badge, { size: "M", backgroundColor: config.color, children: config.label });
+    return /* @__PURE__ */ jsx(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__ */ jsx(Modal.Root, { open: true, onOpenChange: onClose, children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
     /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", textColor: "neutral800", as: "h2", id: "title", children: formatMessage({ id: "payment-plugin.paymentDetails.title", defaultMessage: "Payment Details" }) }) }),
@@ -225,15 +246,14 @@ const PaymentCard = ({ payment, onClose }) => {
       ] })
     ] }) }),
     /* @__PURE__ */ jsxs(Modal.Footer, { children: [
-      /* @__PURE__ */ jsx(Button, { onClick: onClose, variant: "tertiary", children: "Close" }),
+      /* @__PURE__ */ jsx(Button, { onClick: onClose, variant: "tertiary", children: formatMessage({ id: "payment-plugin.paymentDetails.close", defaultMessage: "Close" }) }),
       /* @__PURE__ */ jsx(
         Button,
         {
-          onClick: () => {
-            navigator.clipboard.writeText(payment.stripe_payment_intent_id || "");
-            alert("Copied to clipboard");
-          },
-          children: "Copy Stripe ID"
+          startIcon: /* @__PURE__ */ jsx(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" })
         }
       )
     ] })
@@ -243,36 +263,32 @@ const Payments = () => {
   const { formatMessage } = useIntl();
   const { get } = useFetchClient();
   const [payments, setPayments] = useState([]);
-  const [filteredPayments, setFilteredPayments] = useState([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
   const [selectedPayment, setSelectedPayment] = useState(null);
   const [showRefundModal, setShowRefundModal] = useState(false);
   const [showPaymentCard, setShowPaymentCard] = useState(false);
-  console.log("payments:", payments);
   const [currentPage, setCurrentPage] = useState(1);
-  const [pageSize, setPageSize] = useState(25);
+  const pageSize = 25;
   const [totalCount, setTotalCount] = useState(0);
   const [filters, setFilters] = useState({
     payment_status: "",
     paymentMethod: "",
-    dateRange: { from: null, to: null },
     search: "",
     currency: ""
   });
   useEffect(() => {
     fetchPayments();
-  }, [currentPage, pageSize, filters]);
-  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(`/${PLUGIN_ID}/admin/payments?${queryParams}`);
       if (data.success && data.data) {
@@ -284,7 +300,7 @@ const Payments = () => {
           orderId: p.order?.documentId
         }));
         setPayments(formattedPayments);
-        setTotalCount(data.meta.pagination.total);
+        setTotalCount(data.meta?.pagination?.total || 0);
       }
       setLoading(false);
     } catch (err) {
@@ -292,35 +308,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",
@@ -343,19 +331,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 || "",
@@ -374,19 +356,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__ */ jsx(Box, { paddingLeft: 10, paddingRight: 10, paddingTop: 4, paddingBottom: 10, children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", alignItems: "center", style: { minHeight: "400px" }, children: /* @__PURE__ */ jsx(Loader, {}) }) });
+    return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", alignItems: "center", style: { minHeight: "400px" }, children: /* @__PURE__ */ jsx(Loader, {}) }) });
   }
   if (error) {
-    return /* @__PURE__ */ jsx(Box, { paddingLeft: 10, paddingRight: 10, paddingTop: 4, paddingBottom: 10, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
       EmptyStateLayout,
       {
-        title: "Error loading payments",
-        subtitle: error,
+        content: error,
         action: /* @__PURE__ */ jsx(Button, { onClick: fetchPayments, children: formatMessage({ id: "payment-plugin.payments.retry", defaultMessage: "Retry" }) })
       }
     ) });
@@ -402,13 +379,14 @@ const Payments = () => {
       ] }),
       /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
         /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: exportPayments, children: formatMessage({ id: "payment-plugin.payments.export", defaultMessage: "Export" }) }),
-        /* @__PURE__ */ jsx(Button, { onClick: () => fetchPayments(), children: formatMessage({ id: "payment-plugin.payments.refresh", defaultMessage: "Refresh" }) })
+        /* @__PURE__ */ jsx(Button, { onClick: fetchPayments, children: formatMessage({ id: "payment-plugin.payments.refresh", defaultMessage: "Refresh" }) })
       ] })
     ] }) }),
     /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(Box, { padding: 4, children: /* @__PURE__ */ jsxs(Grid.Root, { gap: 4, children: [
       /* @__PURE__ */ jsx(Grid.Item, { col: 3, children: /* @__PURE__ */ jsx(
         TextInput,
         {
+          label: formatMessage({ id: "payment-plugin.payments.search.label", defaultMessage: "Search" }),
           placeholder: formatMessage({
             id: "payment-plugin.payments.search.placeholder",
             defaultMessage: "Search payments..."
@@ -420,6 +398,7 @@ const Payments = () => {
       /* @__PURE__ */ jsx(Grid.Item, { col: 2, children: /* @__PURE__ */ jsxs(
         SingleSelect,
         {
+          label: formatMessage({ id: "payment-plugin.payments.status.label", defaultMessage: "Status" }),
           placeholder: formatMessage({
             id: "payment-plugin.payments.status.placeholder",
             defaultMessage: "All Statuses"
@@ -438,9 +417,10 @@ const Payments = () => {
       /* @__PURE__ */ jsx(Grid.Item, { col: 2, children: /* @__PURE__ */ jsxs(
         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),
@@ -455,6 +435,7 @@ const Payments = () => {
       /* @__PURE__ */ jsx(Grid.Item, { col: 2, children: /* @__PURE__ */ jsxs(
         SingleSelect,
         {
+          label: formatMessage({ id: "payment-plugin.payments.currency.label", defaultMessage: "Currency" }),
           placeholder: formatMessage({
             id: "payment-plugin.payments.currency.placeholder",
             defaultMessage: "All Currencies"
@@ -469,33 +450,46 @@ const Payments = () => {
           ]
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid.Item, { col: 3, children: /* @__PURE__ */ jsx(Flex, { gap: 2, children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: clearFilters, children: formatMessage({ id: "payment-plugin.payments.clearFilters", defaultMessage: "Clear" }) }) }) })
+      /* @__PURE__ */ jsx(Grid.Item, { col: 3, children: /* @__PURE__ */ jsx(Flex, { gap: 2, alignItems: "flex-end", height: "100%", children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: clearFilters, children: formatMessage({ id: "payment-plugin.payments.clearFilters", defaultMessage: "Clear" }) }) }) })
     ] }) }) }),
     /* @__PURE__ */ jsx(Box, { marginTop: 4, marginBottom: 2, children: /* @__PURE__ */ jsx(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__ */ jsx(Card, { children: /* @__PURE__ */ jsx(
       PaymentList,
       {
-        payments: paginatedPayments,
+        payments,
         onPaymentClick: (payment) => handleViewDetails(payment),
         onRefund: (payment) => handleRefund(payment),
         onViewDetails: (payment) => handleViewDetails(payment)
       }
     ) }),
-    totalPages > 1 && /* @__PURE__ */ jsx(Box, { marginTop: 4, children: /* @__PURE__ */ jsx(
-      Pagination,
-      {
-        currentPage,
-        pageCount: totalPages,
-        onPageChange: setCurrentPage
-      }
-    ) }),
+    totalPages > 1 && /* @__PURE__ */ jsx(Box, { marginTop: 4, children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsxs(Pagination, { activePage: currentPage, pageCount: totalPages, label: "Payments pagination", children: [
+      /* @__PURE__ */ jsx(
+        PreviousLink,
+        {
+          as: "button",
+          onClick: () => setCurrentPage((p) => Math.max(1, p - 1))
+        }
+      ),
+      Array.from({ length: totalPages }, (_, i) => i + 1).map((page) => /* @__PURE__ */ jsx(
+        PageLink,
+        {
+          number: page,
+          as: "button",
+          onClick: () => setCurrentPage(page)
+        },
+        page
+      )),
+      /* @__PURE__ */ jsx(
+        NextLink,
+        {
+          as: "button",
+          onClick: () => setCurrentPage((p) => Math.min(totalPages, p + 1))
+        }
+      )
+    ] }) }) }),
     showRefundModal && selectedPayment && /* @__PURE__ */ jsx(
       RefundModal,
       {