@akinon/pz-credit-payment 2.0.0-beta.0 → 2.0.0-beta.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @akinon/pz-credit-payment
 
+## 2.0.0-beta.2
+
+## 2.0.0-beta.1
+
+### Minor Changes
+
+- ZERO-3091: Upgrade Next.js to v15 and React to v19
+
 ## 2.0.0-beta.0
 
 ### Major Changes

package/package.json

@@ -1,19 +1,19 @@
 {
   "name": "@akinon/pz-credit-payment",
-  "version": "2.0.0-beta.0",
+  "version": "2.0.0-beta.2",
   "license": "MIT",
   "main": "src/index.tsx",
   "peerDependencies": {
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0"
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@types/node": "^18.7.8",
-    "@types/react": "^18.0.17",
-    "@types/react-dom": "^18.0.6",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "typescript": "^4.7.4",
+    "@types/node": "^22.10.2",
+    "@types/react": "^19.0.2",
+    "@types/react-dom": "^19.0.2",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "typescript": "^5.7.2",
     "react-hook-form": "7.31.3",
     "@hookform/resolvers": "2.9.0"
   }

package/src/index.tsx

@@ -1,4 +1,3 @@
-
 import React from 'react';
 import { yupResolver } from '@hookform/resolvers/yup';
 import { useEffect, useState } from 'react';
@@ -38,14 +37,12 @@ const creditPaymentFormSchema = (requiredFieldMessage) =>
     agreement: yup.boolean().oneOf([true], requiredFieldMessage)
   });
 
-export const CreditPayment = (
-	{
-		translations,
-		agreementCheckbox,
-    titleClassName,
-    buttonClassName
-	}: CreditPaymentProps
-) => {
+export const CreditPayment = ({
+  translations,
+  agreementCheckbox,
+  titleClassName,
+  buttonClassName
+}: CreditPaymentProps) => {
   const _translations = {
     ...defaultTranslations,
     ...translations
@@ -57,21 +54,22 @@ export const CreditPayment = (
     register,
     formState: { errors }
   } = useForm({
-    resolver: yupResolver(creditPaymentFormSchema(_translations.requiredFieldMessage))
+    resolver: yupResolver(
+      creditPaymentFormSchema(_translations.requiredFieldMessage)
+    )
   });
   const [formError, setFormError] = useState<string | null>(null);
 
   const [setCreditPaymentOption] = useSetCreditPaymentOptionMutation();
   const [confirmationCreditPayment] = useConfirmationCreditPaymentMutation();
 
-  const { creditPaymentOptions, selectedCreditPaymentPk, preOrder } = useAppSelector(
-    (state: RootState) => state.checkout
-  );
+  const { creditPaymentOptions, selectedCreditPaymentPk, preOrder } =
+    useAppSelector((state: RootState) => state.checkout);
 
   const onSubmit: SubmitHandler<any> = async () => {
     const response = await confirmationCreditPayment().unwrap();
 
-    if(response?.errors?.non_field_errors) {
+    if (response?.errors?.non_field_errors) {
       setFormError(response?.errors?.non_field_errors);
       return;
     }
@@ -81,17 +79,24 @@ export const CreditPayment = (
     if (creditPaymentOptions?.length && !preOrder.credit_payment_option) {
       setCreditPaymentOption(creditPaymentOptions[0].pk);
     }
-  }, [creditPaymentOptions, selectedCreditPaymentPk, preOrder.credit_payment_option, setCreditPaymentOption]);
+  }, [
+    creditPaymentOptions,
+    selectedCreditPaymentPk,
+    preOrder.credit_payment_option,
+    setCreditPaymentOption
+  ]);
 
   return (
     <form className="flex flex-col w-full" onSubmit={handleSubmit(onSubmit)}>
-			<div className={clsx(
-        twMerge(
-          'flex justify-start items-center border-solid border-gray-400 px-4 py-2 sm:px-6 sm:py-3 sm:min-h-15',
-          'text-black-800 text-lg font-medium sm:text-2xl',
-          titleClassName
+      <div
+        className={clsx(
+          twMerge(
+            'flex justify-start items-center border-solid border-gray-400 px-4 py-2 sm:px-6 sm:py-3 sm:min-h-15',
+            'text-black-800 text-lg font-medium sm:text-2xl',
+            titleClassName
           )
-      )}>
+        )}
+      >
         {_translations.title}
       </div>
 
@@ -105,7 +110,10 @@ export const CreditPayment = (
               <Radio
                 type="radio"
                 value={bank.pk}
-                checked={bank.pk === selectedCreditPaymentPk || preOrder.credit_payment_option?.pk === bank.pk}
+                checked={
+                  bank.pk === selectedCreditPaymentPk ||
+                  preOrder.credit_payment_option?.pk === bank.pk
+                }
                 {...register('paymentType')}
                 onChange={() => {
                   setCreditPaymentOption(bank.pk);
@@ -123,12 +131,13 @@ export const CreditPayment = (
 
       <div className="px-4 sm:px-6">
         <div className="flex items-start flex-col py-4 space-y-4">
-        	{agreementCheckbox &&
+          {agreementCheckbox &&
             React.cloneElement(agreementCheckbox, {
+              // @ts-ignore
               control,
               error: errors.agreement,
               fieldId: 'agreement'
-          })}
+            })}
 
           {formError && (
             <div className="w-full text-xs text-start px-1 mt-3 text-error">
@@ -143,7 +152,7 @@ export const CreditPayment = (
               twMerge(
                 'group uppercase mt-4 inline-flex items-center justify-center w-full',
                 buttonClassName
-                )
+              )
             )}
           >
             <span>{_translations.buttonName}</span>
@@ -159,4 +168,3 @@ export const CreditPayment = (
     </form>
   );
 };
-