strapi-plugin-payone-provider 1.6.7 → 5.6.9

package/admin/src/pages/hooks/useSettings.js

@@ -1,32 +1,49 @@
-import { useState, useEffect } from "react";
-import { useNotification } from "@strapi/helper-plugin";
-import payoneRequests from "../utils/api";
+import * as React from "react";
+import { useNotification } from "@strapi/strapi/admin";
+import usePayoneRequests from "../utils/api";
 
 const useSettings = () => {
-  const toggleNotification = useNotification();
-  const [settings, setSettings] = useState({
+  const { toggleNotification } = useNotification();
+  const [settings, setSettings] = React.useState({
     aid: "",
     portalid: "",
     mid: "",
     key: "",
     mode: "test",
     api_version: "3.10",
-    enable3DSecure: false
+    enable3DSecure: false,
+    enableCreditCard: false,
+    enablePayPal: false,
+    enableGooglePay: false,
+    enableApplePay: false,
+    enableSofort: false,
+    enableSepaDirectDebit: false
   });
-  const [isLoading, setIsLoading] = useState(false);
-  const [isSaving, setIsSaving] = useState(false);
-  const [isTesting, setIsTesting] = useState(false);
-  const [testResult, setTestResult] = useState(null);
+  const [isLoading, setIsLoading] = React.useState(false);
+  const [isSaving, setIsSaving] = React.useState(false);
+  const [isTesting, setIsTesting] = React.useState(false);
+  const [testResult, setTestResult] = React.useState(null);
+  const { getSettings, updateSettings, testConnection } = usePayoneRequests();
+  const saveTimeoutRef = React.useRef(null);
 
-  useEffect(() => {
+
+  React.useEffect(() => {
     loadSettings();
+    return () => {
+      if (saveTimeoutRef.current) {
+        clearTimeout(saveTimeoutRef.current);
+      }
+    };
   }, []);
 
   const loadSettings = async () => {
     setIsLoading(true);
     try {
-      const response = await payoneRequests.getSettings();
-      if (response?.data) setSettings(response.data);
+      const response = await getSettings();
+      const settingsData = response?.data?.data || response?.data;
+      if (settingsData && typeof settingsData === 'object') {
+        setSettings(settingsData);
+      }
     } catch (error) {
       toggleNotification({
         type: "warning",
@@ -39,27 +56,57 @@ const useSettings = () => {
 
   const handleInputChange = (field, value) => {
     setSettings((prev) => ({ ...prev, [field]: value }));
+
+    if (saveTimeoutRef.current) {
+      clearTimeout(saveTimeoutRef.current);
+    }
+
+    saveTimeoutRef.current = setTimeout(async () => {
+      let updatedSettings;
+      setSettings((prev) => {
+        updatedSettings = { ...prev };
+        return prev;
+      });
+
+      setIsSaving(true);
+      try {
+        await updateSettings(updatedSettings);
+        await loadSettings();
+      } catch (error) {
+        setSettings((prev) => {
+          const previousValue = prev[field];
+          return { ...prev, [field]: previousValue };
+        });
+
+        toggleNotification({
+          type: "danger",
+          message: "Failed to update settings"
+        });
+
+      } finally {
+        setIsSaving(false);
+      }
+    }, 1000);
   };
 
   const handlePaymentMethodToggle = async (field, value) => {
+    const booleanValue = Boolean(value);
     let updatedSettings;
+
     setSettings((prev) => {
-      updatedSettings = { ...prev, [field]: value };
+      updatedSettings = { ...prev, [field]: booleanValue };
       return updatedSettings;
     });
 
     setIsSaving(true);
     try {
-      await payoneRequests.updateSettings(updatedSettings);
-      toggleNotification({
-        type: "success",
-        message: "Payment method updated successfully"
-      });
+      await updateSettings(updatedSettings);
+      await loadSettings();
     } catch (error) {
-      setSettings((prev) => ({ ...prev, [field]: !value }));
+      setSettings((prev) => ({ ...prev, [field]: !booleanValue }));
       toggleNotification({
-        type: "warning",
-        message: "Failed to update payment method"
+        type: "danger",
+        message: "Failed to update settings"
       });
     } finally {
       setIsSaving(false);
@@ -69,7 +116,7 @@ const useSettings = () => {
   const handleSave = async () => {
     setIsSaving(true);
     try {
-      await payoneRequests.updateSettings(settings);
+      await updateSettings(settings);
       toggleNotification({
         type: "success",
         message: "Settings saved successfully"
@@ -77,7 +124,7 @@ const useSettings = () => {
       await loadSettings();
     } catch (error) {
       toggleNotification({
-        type: "warning",
+        type: "danger",
         message: "Failed to save settings"
       });
     } finally {
@@ -89,33 +136,25 @@ const useSettings = () => {
     setIsTesting(true);
     setTestResult(null);
     try {
-      const response = await payoneRequests.testConnection();
-      if (response.data) {
-        const result = response.data;
-        setTestResult(result);
-        if (result.success !== undefined) {
-          toggleNotification({
-            type: Boolean(result.success) ? "success" : "warning",
-            message: result.message || "Test completed"
-          });
-        }
+      const response = await testConnection();
+      console.log("response in handleTestConnection:", response.data);
+      if (response.data && response.data.success) {
+        setTestResult(response.data);
+        toggleNotification({
+          type: "success",
+          message: response.data.message || "Test completed"
+        });
       } else {
-        throw new Error("Invalid response format from server");
+        setTestResult(response.data);
+        toggleNotification({
+          type: "danger",
+          message: response.data.error.ErrorMessage || "Failed to test connection"
+        });
+
+        throw new Error(response.data.error.ErrorMessage);
       }
     } catch (error) {
-      toggleNotification({
-        type: "warning",
-        message: "Failed to test connection"
-      });
-      setTestResult({
-        success: false,
-        message:
-          "Failed to test connection. Please check your network and server logs for details.",
-        details: {
-          errorCode: "NETWORK",
-          rawResponse: error.message || "Network error"
-        }
-      });
+      throw new Error(error.message);
     } finally {
       setIsTesting(false);
     }

package/admin/src/pages/hooks/useTransactionHistory.js

@@ -1,86 +1,148 @@
-import { useState, useEffect } from "react";
-import { useNotification } from "@strapi/helper-plugin";
-import payoneRequests from "../utils/api";
+import * as React from "react";
+import { useNotification, useQueryParams } from "@strapi/strapi/admin";
+import usePayoneRequests from "../utils/api";
 
 const PAGE_SIZE = 10;
 
 const useTransactionHistory = () => {
-  const toggleNotification = useNotification();
-  const [transactionHistory, setTransactionHistory] = useState([]);
-  const [isLoadingHistory, setIsLoadingHistory] = useState(false);
-  const [selectedTransaction, setSelectedTransaction] = useState(null);
-  const [currentPage, setCurrentPage] = useState(1);
-  const [filters, setFilters] = useState({
+  const { toggleNotification } = useNotification();
+  const { getTransactionHistory } = usePayoneRequests();
+  const [{ query }, setQuery] = useQueryParams();
+
+  const [filters, setFilters] = React.useState({
     search: "",
+    status: "",
     request_type: "",
     payment_method: "",
     date_from: "",
-    date_to: ""
+    date_to: "",
   });
 
-  useEffect(() => {
-    loadTransactionHistory();
-  }, []);
+  const [pagination, setPagination] = React.useState({
+    page: parseInt(query?.page || "1", 10),
+    pageSize: parseInt(query?.pageSize || String(PAGE_SIZE), 10),
+    pageCount: 1,
+    total: 0,
+  });
+
+  const [transactionHistory, setTransactionHistory] = React.useState([]);
+  const [isLoadingHistory, setIsLoadingHistory] = React.useState(false);
+  const [selectedTransaction, setSelectedTransaction] = React.useState(null);
+
+  React.useEffect(() => {
+    const page = parseInt(query?.page || "1", 10);
+    const pageSize = parseInt(query?.pageSize || String(PAGE_SIZE), 10);
+    setPagination((prev) => ({
+      ...prev,
+      page,
+      pageSize,
+    }));
+  }, [query?.page, query?.pageSize]);
+
 
   const loadTransactionHistory = async () => {
     setIsLoadingHistory(true);
     try {
-      const result = await payoneRequests.getTransactionHistory(filters);
-      setTransactionHistory(result.data || []);
-      setCurrentPage(1);
+      const response = await getTransactionHistory({
+        filters,
+        pagination
+      });
+      const result = response?.data || response;
+      const historyData = Array.isArray(result?.data) ? result.data : [];
+      const paginationMeta = result?.meta?.pagination;
+
+      if (paginationMeta && paginationMeta.total !== undefined) {
+        setPagination((prev) => ({
+          ...prev,
+          pageCount: paginationMeta.pageCount || 1,
+          total: paginationMeta.total || 0,
+        }));
+      } else {
+        const calculatedTotal = historyData.length;
+        const calculatedPageCount = Math.ceil(calculatedTotal / pagination.pageSize) || 1;
+        setPagination((prev) => ({
+          ...prev,
+          pageCount: calculatedPageCount,
+          total: calculatedTotal,
+        }));
+      }
+
+      setTransactionHistory(historyData);
     } catch (error) {
+      console.error("Error loading transaction history:", error);
+      setTransactionHistory([]);
+      setPagination((prev) => ({
+        ...prev,
+        pageCount: 1,
+        total: 0,
+      }));
       toggleNotification({
-        type: "warning",
-        message: "Failed to load transaction history"
+        type: "danger",
+        message: "Failed to load transaction history",
       });
     } finally {
       setIsLoadingHistory(false);
     }
   };
 
-  const handleFilterChange = (field, value) => {
-    setFilters((prev) => ({ ...prev, [field]: value }));
-  };
-
-  const handleFilterApply = () => {
+  React.useEffect(() => {
     loadTransactionHistory();
-  };
+  }, [
+    filters.search,
+    filters.status,
+    filters.request_type,
+    filters.payment_method,
+    filters.date_from,
+    filters.date_to,
+    pagination.page,
+    pagination.pageSize,
+  ]);
 
   const handleTransactionSelect = (transaction) => {
-    if (selectedTransaction?.id === transaction?.id) {
-      setSelectedTransaction(null);
-    } else {
-      setSelectedTransaction(transaction);
+    setSelectedTransaction(
+      selectedTransaction?.id === transaction?.id ? null : transaction
+    );
+  };
+
+  const handlePaginationChange = (newPagination) => {
+    if (newPagination && typeof newPagination === "object") {
+      const updatedQuery = {
+        ...query,
+        page: query.page || 1,
+        pageSize: String(newPagination.pageSize || pagination.pageSize),
+      };
+      setQuery(updatedQuery, "push", false);
     }
   };
 
-  const handlePageChange = (page) => {
-    setCurrentPage(page);
-    setSelectedTransaction(null);
+  const handleFiltersChange = (newFilters) => {
+    if (newFilters && typeof newFilters === "object") {
+      setFilters((prev) => ({
+        ...prev,
+        ...newFilters,
+      }));
+    }
   };
 
-  // Pagination calculations
-  const totalPages = Math.ceil(transactionHistory.length / PAGE_SIZE);
-  const startIndex = (currentPage - 1) * PAGE_SIZE;
-  const endIndex = startIndex + PAGE_SIZE;
-  const paginatedTransactions = transactionHistory.slice(startIndex, endIndex);
+  React.useEffect(() => {
+    setSelectedTransaction(null);
+  }, [filters, pagination.page]);
 
   return {
-    transactionHistory,
-    paginatedTransactions,
+    transactions: Array.isArray(transactionHistory) ? transactionHistory : [],
     isLoadingHistory,
     selectedTransaction,
-    filters,
-    currentPage,
-    totalPages,
-    pageSize: PAGE_SIZE,
-    handleFilterChange,
-    handleFilterApply,
+    currentPage: pagination.page,
+    totalPages: pagination.pageCount,
+    totalCount: pagination.total,
+    pageSize: pagination.pageSize,
     handleTransactionSelect,
-    handlePageChange,
-    loadTransactionHistory
+    loadTransactionHistory,
+    filters,
+    handleFiltersChange,
+    pagination,
+    handlePaginationChange,
   };
 };
 
 export default useTransactionHistory;
-

package/admin/src/pages/utils/api.js

@@ -1,85 +1,70 @@
-import { request } from "@strapi/helper-plugin";
-import pluginId from "../../pluginId";
+import { useFetchClient } from '@strapi/strapi/admin';
+import pluginId from '../../pluginId';
 
-const payoneRequests = {
-  getSettings: () => {
-    return request(`/${pluginId}/settings`, {
-      method: "GET"
-    });
-  },
+const usePayoneRequests = () => {
+  const { get, post, put } = useFetchClient();
 
-  updateSettings: (data) => {
-    return request(`/${pluginId}/settings`, {
-      method: "PUT",
-      body: data
-    });
-  },
+  const getSettings = () => get(`/${pluginId}/settings`);
 
-  getTransactionHistory: (params = {}) => {
-    const queryString = new URLSearchParams(params).toString();
-    return request(
-      `/${pluginId}/transaction-history${queryString ? `?${queryString}` : ""}`,
-      {
-        method: "GET"
+  const updateSettings = (data) =>
+    put(`/${pluginId}/settings`, data);
+
+  const getTransactionHistory = (params = {}) => {
+    const queryParams = new URLSearchParams();
+
+    if (params.filters) {
+      Object.keys(params.filters).forEach((key) => {
+        const value = params.filters[key];
+        if (value !== undefined && value !== null && value !== '') {
+          queryParams.append(`filters[${key}]`, String(value));
+        }
+      });
+    }
+
+    if (params.pagination) {
+      if (params.pagination.page) {
+        queryParams.append('pagination[page]', String(params.pagination.page));
       }
+      if (params.pagination.pageSize) {
+        queryParams.append('pagination[pageSize]', String(params.pagination.pageSize));
+      }
+    }
+
+    const queryString = queryParams.toString();
+    return get(
+      `/${pluginId}/transaction-history${queryString ? `?${queryString}` : ''}`
     );
-  },
+  };
 
-  testConnection: () => {
-    return request(`/${pluginId}/test-connection`, {
-      method: "POST"
-    });
-  },
+  const testConnection = () =>
+    post(`/${pluginId}/test-connection`);
 
-  preauthorization: (data) => {
-    return request(`/${pluginId}/preauthorization`, {
-      method: "POST",
-      body: data,
-      headers: {
-        "Content-Type": "application/json"
-      }
-    });
-  },
+  const preauthorization = (data) =>
+    post(`/${pluginId}/preauthorization`, data);
 
-  authorization: (data) => {
-    return request(`/${pluginId}/authorization`, {
-      method: "POST",
-      body: data,
-      headers: {
-        "Content-Type": "application/json"
-      }
-    });
-  },
+  const authorization = (data) =>
+    post(`/${pluginId}/authorization`, data);
 
-  capture: (data) => {
-    return request(`/${pluginId}/capture`, {
-      method: "POST",
-      body: data,
-      headers: {
-        "Content-Type": "application/json"
-      }
-    });
-  },
+  const capture = (data) =>
+    post(`/${pluginId}/capture`, data);
 
-  refund: (data) => {
-    return request(`/${pluginId}/refund`, {
-      method: "POST",
-      body: data,
-      headers: {
-        "Content-Type": "application/json"
-      }
-    });
-  },
+  const refund = (data) =>
+    post(`/${pluginId}/refund`, data);
 
-  handle3DSCallback: (data) => {
-    return request(`/${pluginId}/3ds-callback`, {
-      method: "POST",
-      body: data,
-      headers: {
-        "Content-Type": "application/json"
-      }
-    });
-  }
+  const handle3DSCallback = (data) =>
+    post(`/${pluginId}/3ds-callback`, data);
+
+  return {
+    getSettings,
+    updateSettings,
+    getTransactionHistory,
+    testConnection,
+    preauthorization,
+    authorization,
+    capture,
+    refund,
+    handle3DSCallback,
+  };
 };
 
-export default payoneRequests;
+export default usePayoneRequests;

package/admin/src/pages/utils/applePayConstants.js

@@ -1,12 +1,4 @@
-/**
- * Apple Pay Constants
- * Based on Apple Pay documentation and Payone requirements
- * https://developer.apple.com/documentation/applepayontheweb
- * https://docs.payone.com/payment-methods/apple-pay/apple-pay-without-dev
- */
-
-// Apple Pay supported countries
-// Note: Apple Pay availability varies by country
+
 export const APPLE_PAY_SUPPORTED_COUNTRIES = [
   { code: "US", name: "United States" },
   { code: "GB", name: "United Kingdom" },
@@ -46,8 +38,6 @@ export const APPLE_PAY_SUPPORTED_COUNTRIES = [
   { code: "ZA", name: "South Africa" }
 ];
 
-// Apple Pay supported currencies
-// Note: Some currencies may be restricted in certain countries
 export const APPLE_PAY_SUPPORTED_CURRENCIES = [
   { code: "USD", name: "US Dollar", symbol: "$" },
   { code: "EUR", name: "Euro", symbol: "€" },
@@ -77,7 +67,6 @@ export const APPLE_PAY_SUPPORTED_CURRENCIES = [
   { code: "HUF", name: "Hungarian Forint", symbol: "Ft" }
 ];
 
-// Apple Pay supported payment networks
 export const APPLE_PAY_SUPPORTED_NETWORKS = [
   { code: "amex", name: "American Express" },
   { code: "discover", name: "Discover" },
@@ -92,15 +81,12 @@ export const APPLE_PAY_SUPPORTED_NETWORKS = [
   { code: "privateLabel", name: "Private Label" }
 ];
 
-// Merchant capabilities
 export const APPLE_PAY_MERCHANT_CAPABILITIES = [
   { code: "supports3DS", name: "3D Secure", description: "Required for most payment methods" },
   { code: "supportsCredit", name: "Credit Cards", description: "Support credit card payments" },
   { code: "supportsDebit", name: "Debit Cards", description: "Support debit card payments" }
 ];
 
-// Country-currency restrictions
-// Some currencies are not available in certain countries
 export const COUNTRY_CURRENCY_RESTRICTIONS = {
   US: ["USD"],
   GB: ["GBP", "EUR"],
@@ -126,20 +112,16 @@ export const COUNTRY_CURRENCY_RESTRICTIONS = {
   ZA: ["ZAR"]
 };
 
-// Get supported currencies for a country
 export const getSupportedCurrenciesForCountry = (countryCode) => {
   const restrictions = COUNTRY_CURRENCY_RESTRICTIONS[countryCode];
   if (restrictions) {
-    return APPLE_PAY_SUPPORTED_CURRENCIES.filter(currency => 
+    return APPLE_PAY_SUPPORTED_CURRENCIES.filter(currency =>
       restrictions.includes(currency.code)
     );
   }
-  // Default: return all currencies if no restrictions
   return APPLE_PAY_SUPPORTED_CURRENCIES;
 };
 
-// Get supported networks for a country
-// Some networks are country-specific
 export const getSupportedNetworksForCountry = (countryCode) => {
   const countryNetworks = {
     US: ["amex", "discover", "masterCard", "visa"],
@@ -157,30 +139,23 @@ export const getSupportedNetworksForCountry = (countryCode) => {
   return countryNetworks[countryCode] || countryNetworks.default;
 };
 
-// Test data for Apple Pay
-// Based on Apple Pay sandbox testing documentation
 export const APPLE_PAY_TEST_DATA = {
-  // Test card numbers (for sandbox testing)
   testCards: {
     visa: "4111111111111111",
     mastercard: "5555555555554444",
     amex: "378282246310005",
     discover: "6011111111111117"
   },
-  // Test merchant identifiers (for development)
   testMerchantIdentifier: "merchant.com.payone.test",
-  // Test domain
   testDomain: "test.payone.com"
 };
 
-// Apple Pay button styles
 export const APPLE_PAY_BUTTON_STYLES = [
   { code: "black", name: "Black" },
   { code: "white", name: "White with outline" },
   { code: "white-outline", name: "White" }
 ];
 
-// Apple Pay button types
 export const APPLE_PAY_BUTTON_TYPES = [
   { code: "plain", name: "Plain" },
   { code: "buy", name: "Buy" },
@@ -201,7 +176,6 @@ export const APPLE_PAY_BUTTON_TYPES = [
   { code: "set-up", name: "Set Up" }
 ];
 
-// Default Apple Pay configuration
 export const DEFAULT_APPLE_PAY_CONFIG = {
   countryCode: "DE",
   currencyCode: "EUR",