strapi-plugin-payone-provider 1.6.7 → 5.6.9

package/admin/src/pages/App/components/paymentActions/PaymentResult.jsx

@@ -1,192 +0,0 @@
-import React from "react";
-import {
-  Box,
-  Card,
-  CardBody,
-  Divider,
-  Flex,
-  Stack,
-  Typography,
-  Alert,
-} from "@strapi/design-system";
-import StatusBadge from "../StatusBadge";
-import { formatTransactionData } from "../../../utils/formatTransactionData";
-
-const PaymentResult = ({ paymentError, paymentResult }) => {
-  if (!paymentError && !paymentResult) {
-    return null;
-  }
-
-  const status = paymentResult?.status || paymentResult?.Status || "";
-  const errorCode =
-    paymentResult?.errorcode ||
-    paymentResult?.errorCode ||
-    paymentResult?.ErrorCode;
-  const errorMessage =
-    paymentResult?.errormessage ||
-    paymentResult?.errorMessage ||
-    paymentResult?.ErrorMessage;
-  const customerMessage =
-    paymentResult?.customermessage ||
-    paymentResult?.customerMessage ||
-    paymentResult?.CustomerMessage;
-  const isError = status === "ERROR" || status === "INVALID" || errorCode;
-
-  return (
-    <>
-      {paymentError && (
-        <Alert variant="danger" title="Error" className="payment-alert">
-          {paymentError}
-        </Alert>
-      )}
-
-      {paymentResult && (
-        <Card className="payment-result-card">
-          <CardBody>
-            <Stack spacing={4}>
-              <Flex justifyContent="space-between" alignItems="center">
-                <Typography
-                  variant="delta"
-                  as="h3"
-                  className="payment-section-title"
-                >
-                  Payment Result
-                </Typography>
-                {(status || paymentResult.Status) && (
-                  <StatusBadge status={status || paymentResult.Status} />
-                )}
-              </Flex>
-
-              <hr className="payment-divider" style={{ margin: "16px 0" }} />
-
-              {/* Show error information prominently if error */}
-              {isError && (
-                <Alert variant="danger" title="Transaction Failed">
-                  <Stack spacing={2}>
-                    {errorCode && (
-                      <Typography variant="pi">
-                        <strong>Error Code:</strong> {errorCode}
-                      </Typography>
-                    )}
-                    {errorMessage && (
-                      <Typography variant="pi">
-                        <strong>Error Message:</strong> {errorMessage}
-                      </Typography>
-                    )}
-                    {customerMessage && (
-                      <Typography variant="pi">
-                        <strong>Customer Message:</strong> {customerMessage}
-                      </Typography>
-                    )}
-                  </Stack>
-                </Alert>
-              )}
-
-              <Box>
-                <Typography
-                  variant="omega"
-                  fontWeight="semiBold"
-                  marginBottom={2}
-                >
-                  Full Response Details:
-                </Typography>
-                <Stack spacing={3}>
-                  {formatTransactionData(paymentResult).map((item, index) => (
-                    <Flex
-                      key={index}
-                      justifyContent="space-between"
-                      alignItems="start"
-                      style={{
-                        padding: "8px 0",
-                        borderBottom:
-                          index <
-                          formatTransactionData(paymentResult).length - 1
-                            ? "1px solid #e8e8ea"
-                            : "none",
-                      }}
-                    >
-                      <Typography
-                        variant="pi"
-                        textColor="neutral600"
-                        style={{ minWidth: "200px", fontWeight: "500" }}
-                      >
-                        {item.key}:
-                      </Typography>
-                      <Typography
-                        variant="pi"
-                        style={{
-                          flex: 1,
-                          textAlign: "right",
-                          fontWeight: "400",
-                          wordBreak: "break-word",
-                          fontFamily: item.key.toLowerCase().includes("raw")
-                            ? "monospace"
-                            : "inherit",
-                          fontSize: item.key.toLowerCase().includes("raw")
-                            ? "11px"
-                            : "inherit",
-                        }}
-                      >
-                        {item.value}
-                      </Typography>
-                    </Flex>
-                  ))}
-                </Stack>
-              </Box>
-
-              {/* 3DS Required Warning */}
-              {paymentResult?.is3DSRequired && !paymentResult?.redirectUrl && (
-                <Alert
-                  variant="warning"
-                  title="3D Secure Authentication Required"
-                >
-                  <Stack spacing={2}>
-                    <Typography variant="pi">
-                      Payone requires 3D Secure authentication, but no redirect
-                      URL was provided in the response.
-                    </Typography>
-                    <Typography variant="pi" fontWeight="semiBold">
-                      Possible solutions:
-                    </Typography>
-                    <Typography
-                      variant="pi"
-                      component="ul"
-                      style={{ marginLeft: "20px" }}
-                    >
-                      <li>
-                        Check Payone portal configuration for 3DS settings
-                      </li>
-                      <li>
-                        Verify that redirect URLs (successurl, errorurl,
-                        backurl) are properly configured
-                      </li>
-                      <li>
-                        Ensure you're using test mode with proper test
-                        credentials
-                      </li>
-                      <li>
-                        Check if 3dscheck request is needed before authorization
-                      </li>
-                    </Typography>
-                    <Typography
-                      variant="pi"
-                      textColor="neutral600"
-                      marginTop={2}
-                    >
-                      <strong>Error Code:</strong>{" "}
-                      {paymentResult?.errorCode ||
-                        paymentResult?.ErrorCode ||
-                        "4219"}
-                    </Typography>
-                  </Stack>
-                </Alert>
-              )}
-            </Stack>
-          </CardBody>
-        </Card>
-      )}
-    </>
-  );
-};
-
-export default PaymentResult;

package/admin/src/pages/App/components/paymentActions/PreauthorizationForm.jsx

@@ -1,142 +0,0 @@
-import React from "react";
-import {
-  Box,
-  Flex,
-  Typography,
-  TextInput,
-  Button,
-} from "@strapi/design-system";
-import { Play } from "@strapi/icons";
-import GooglePayButton from "../GooglePaybutton";
-import CardDetailsInput from "./CardDetailsInput";
-
-const PreauthorizationForm = ({
-  paymentAmount,
-  setPaymentAmount,
-  preauthReference,
-  setPreauthReference,
-  isProcessingPayment,
-  onPreauthorization,
-  paymentMethod,
-  settings,
-  setGooglePayToken,
-  cardtype,
-  setCardtype,
-  cardpan,
-  setCardpan,
-  cardexpiredate,
-  setCardexpiredate,
-  cardcvc2,
-  setCardcvc2,
-  isLiveMode = false,
-}) => {
-  const handleGooglePayToken = (token, paymentData) => {
-    if (!token) {
-      return;
-    }
-    setGooglePayToken(token);
-    onPreauthorization(token);
-  };
-
-  const handleGooglePayError = (error) => {
-    console.error("Google Pay error:", error);
-  };
-
-  return (
-    <Flex direction="column" alignItems="stretch" gap={4}>
-      <Flex direction="row" gap={2}>
-        <Typography
-          variant="omega"
-          fontWeight="semiBold"
-          textColor="neutral800"
-          className="payment-form-title"
-        >
-          Preauthorization
-        </Typography>
-        <Typography
-          variant="pi"
-          textColor="neutral600"
-          className="payment-form-description"
-        >
-          Reserve an amount on a credit card without capturing it immediately.
-        </Typography>
-      </Flex>
-
-      <Flex gap={4} wrap="wrap">
-        <TextInput
-          label="Amount (in cents) *"
-          name="paymentAmount"
-          value={paymentAmount}
-          onChange={(e) => setPaymentAmount(e.target.value)}
-          placeholder="Enter amount (e.g., 1000 for €10.00)"
-          hint="Amount in cents (e.g., 1000 = €10.00)"
-          required
-          className="payment-input"
-          style={{ flex: 1, minWidth: "250px" }}
-        />
-
-        <TextInput
-          label="Reference *"
-          name="preauthReference"
-          value={preauthReference}
-          onChange={(e) => setPreauthReference(e.target.value)}
-          placeholder="Auto-generated if empty"
-          hint="Reference will be auto-generated if left empty"
-          className="payment-input"
-          style={{ flex: 1, minWidth: "250px" }}
-        />
-      </Flex>
-
-      {paymentMethod === "cc" && settings?.enable3DSecure && (
-        <Box marginTop={4}>
-          <CardDetailsInput
-            cardtype={cardtype}
-            setCardtype={setCardtype}
-            cardpan={cardpan}
-            setCardpan={setCardpan}
-            cardexpiredate={cardexpiredate}
-            setCardexpiredate={setCardexpiredate}
-            cardcvc2={cardcvc2}
-            setCardcvc2={setCardcvc2}
-          />
-        </Box>
-      )}
-
-      {paymentMethod === "gpp" ? (
-        <GooglePayButton
-          amount={paymentAmount}
-          currency="EUR"
-          onTokenReceived={handleGooglePayToken}
-          onError={handleGooglePayError}
-          settings={settings}
-        />
-      ) : paymentMethod === "apl" ? (
-        <Box>
-          <Typography variant="pi" textColor="neutral600">
-            Apple Pay is only supported for Authorization, not Preauthorization.
-          </Typography>
-        </Box>
-      ) : (
-        <Button
-          variant="default"
-          onClick={onPreauthorization}
-          loading={isProcessingPayment}
-          startIcon={<Play />}
-          style={{ maxWidth: "200px" }}
-          className="payment-button payment-button-primary"
-          disabled={
-            !paymentAmount.trim() ||
-            (paymentMethod === "cc" &&
-              settings?.enable3DSecure !== false &&
-              (!cardtype || !cardpan || !cardexpiredate || !cardcvc2)) ||
-            isLiveMode
-          }
-        >
-          Process Preauthorization
-        </Button>
-      )}
-    </Flex>
-  );
-};
-
-export default PreauthorizationForm;

package/admin/src/pages/App/components/paymentActions/RefundForm.jsx

@@ -1,90 +0,0 @@
-import React from "react";
-import { Box, Flex, Typography, TextInput, Button } from "@strapi/design-system";
-import { Play } from "@strapi/icons";
-
-const RefundForm = ({
-  paymentAmount,
-  setPaymentAmount,
-  refundTxid,
-  setRefundTxid,
-  refundSequenceNumber,
-  setRefundSequenceNumber,
-  refundReference,
-  setRefundReference,
-  isProcessingPayment,
-  onRefund
-}) => {
-  return (
-    <Flex direction="column" alignItems="stretch" gap={4}>
-      <Flex direction="row" gap={2}>
-        <Typography variant="omega" fontWeight="semiBold" textColor="neutral800" className="payment-form-title">
-          Refund
-        </Typography>
-        <Typography variant="pi" textColor="neutral600" className="payment-form-description">
-          Refund a previously captured amount.
-        </Typography>
-      </Flex>
-
-      <Flex gap={4} wrap="wrap">
-        <TextInput
-          label="Transaction ID"
-          name="refundTxid"
-          value={refundTxid}
-          onChange={(e) => setRefundTxid(e.target.value)}
-          placeholder="Enter TxId from capture"
-          hint="Transaction ID from a previous capture"
-          className="payment-input"
-          style={{ flex: 1, minWidth: "200px" }}
-        />
-
-        <TextInput
-          label="Sequence Number"
-          name="refundSequenceNumber"
-          value={refundSequenceNumber}
-          onChange={(e) => setRefundSequenceNumber(e.target.value)}
-          placeholder="2"
-          hint="Sequence number for this refund (1-127) and by default for first 2"
-          className="payment-input"
-          style={{ flex: 1, minWidth: "200px" }}
-        />
-
-        <TextInput
-          label="Amount (in cents)"
-          name="refundAmount"
-          value={paymentAmount}
-          onChange={(e) => setPaymentAmount(e.target.value)}
-          placeholder="1000"
-          hint="Amount in cents to refund (will be negative)"
-          className="payment-input"
-          style={{ flex: 1, minWidth: "200px" }}
-        />
-
-        <TextInput
-          label="Reference"
-          name="refundReference"
-          value={refundReference}
-          onChange={(e) => setRefundReference(e.target.value)}
-          placeholder="Optional reference"
-          hint="Optional reference for this refund"
-          className="payment-input"
-          style={{ flex: 1, minWidth: "200px" }}
-        />
-      </Flex>
-
-      <Button
-        variant="default"
-        onClick={onRefund}
-        loading={isProcessingPayment}
-        startIcon={<Play />}
-        style={{ maxWidth: '200px' }}
-        className="payment-button payment-button-primary"
-        disabled={!refundTxid.trim() || !paymentAmount.trim()}
-      >
-        Process Refund
-      </Button>
-    </Flex>
-  );
-};
-
-export default RefundForm;
-