@akinon/pz-bkm 2.0.0-beta.12 → 2.0.0-beta.14

package/CHANGELOG.md

@@ -1,63 +1,110 @@
 # @akinon/pz-bkm
 
-## 2.0.0-beta.12
+## 2.0.0-beta.14
 
 ### Minor Changes
 
-- 1d79e32: ZERO-3540: Next.js Upgrade to 15.4.5
+- 6ad72e8d: ZERO-4032: Add loading state management for payment submissions across multiple components and add safe guarding
 
-## 2.0.0-beta.11
+## 2.0.0-beta.13
 
-### Minor Changes
+## 1.118.0
 
-- ac783d6: ZERO-3482: Update tailwindcss to version 4.1.11 and enhance button cursor styles
+## 1.117.0
 
-## 2.0.0-beta.10
+## 1.116.0
 
-### Minor Changes
+## 1.115.0
 
-- 2806320: ZERO-3390: Update version tailwindcss, autoprefixer, tailwind-merge, postcss
+## 1.114.0
 
-## 2.0.0-beta.9
+## 1.113.0
 
-### Minor Changes
+## 1.112.0
+
+## 1.111.0
+
+## 1.110.0
+
+## 1.109.0
+
+## 1.108.0
 
-- 0fe7711: ZERO-3387: Upgrade nextjs, eslint-config-next
+## 1.107.0
 
-## 2.0.0-beta.8
+## 1.106.0
 
-## 2.0.0-beta.7
+## 1.105.0
 
-## 2.0.0-beta.6
+## 1.104.0
+
+## 1.103.0
+
+## 1.102.0
+
+## 1.101.0
+
+## 1.100.0
+
+## 1.99.0
 
 ### Minor Changes
 
-- 8f05f9b: ZERO-3250: Beta branch synchronized with Main branch
+- d58538b: ZERO-3638: Enhance RC pipeline: add fetch, merge, and pre-release setup with conditional commit
+
+## 1.98.0
+
+## 1.97.0
 
-## 2.0.0-beta.5
+## 1.96.0
 
-## 2.0.0-beta.4
+## 1.95.0
 
-## 2.0.0-beta.3
+## 1.94.0
 
-## 2.0.0-beta.2
+## 1.93.0
+
+## 1.92.0
+
+## 1.91.0
+
+## 1.90.0
 
 ### Minor Changes
 
-- a006015: ZERO-3116: Add not-found page and update default middleware.
-- 1eeb3d8: ZERO-3116: Add not found page
+- 1044bce: ZERO-3379: Add custom UI rendering support
+
+## 1.89.0
+
+## 1.88.0
+
+## 1.87.0
+
+## 1.86.0
 
-## 2.0.0-beta.1
+## 1.85.0
+
+## 1.84.0
 
 ### Minor Changes
 
-- ZERO-3091: Upgrade Next.js to v15 and React to v19
+- 624a4eb: ZERO-3276: Update installation instructions across multiple README files to standardize format and improve clarity
+
+## 1.83.0
+
+## 1.82.0
+
+## 1.81.0
+
+## 1.80.0
+
+## 1.79.0
 
-## 2.0.0-beta.0
+## 1.78.0
 
-### Major Changes
+## 1.77.0
 
-- be6c09d: ZERO-3114: Create beta version.
+## 1.76.0
 
 ## 1.75.0
 

package/package.json

@@ -1,19 +1,19 @@
 {
   "name": "@akinon/pz-bkm",
-  "version": "2.0.0-beta.12",
+  "version": "2.0.0-beta.14",
   "license": "MIT",
   "main": "src/index.tsx",
   "peerDependencies": {
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0"
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
   },
   "devDependencies": {
-    "@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"
+    "@types/node": "^18.7.8",
+    "@types/react": "^18.0.17",
+    "@types/react-dom": "^18.0.6",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "typescript": "5.2.2"
   },
   "dependencies": {
     "@hookform/resolvers": "2.9.0",

package/src/views/bkm-option.tsx

@@ -1,4 +1,4 @@
-import React, { ReactElement, useId } from 'react';
+import React, { ReactElement, useId, useState } from 'react';
 import Script from 'next/script';
 import * as yup from 'yup';
 import { yupResolver } from '@hookform/resolvers/yup';
@@ -53,56 +53,68 @@ const BKMOption = ({
   customUIRender
 }: BKMOptionProps) => {
   const id = useId();
+  const [isProcessing, setIsProcessing] = useState(false);
   const {
     handleSubmit,
     control,
-    formState: { errors },
+    formState: { errors, isSubmitting },
     getValues
   } = useForm<BKMOptionForm>({
-    resolver: yupResolver(formSchema(translations?.required))
+    resolver: yupResolver(formSchema(translations?.required)) as any
   });
-  const [setBkm] = useSetBkmMutation();
+  const [setBkm, { isLoading: isSettingBkm }] = useSetBkmMutation();
   const [completeBkm] = useCompleteBkmMutation();
 
+  const isButtonDisabled = isSubmitting || isSettingBkm || isProcessing;
+
   const onSubmit: SubmitHandler<BKMOptionForm> = async () => {
-    const response = await setBkm(getValues('agreement')).unwrap();
+    if (isButtonDisabled) return;
 
-    const bexContext = response.context_list.find(
-      (context) => context.page_name === 'BexBinNumberPage'
-    );
+    setIsProcessing(true);
 
-    if (!bexContext) {
-      return;
-    }
+    try {
+      const response = await setBkm(getValues('agreement')).unwrap();
 
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    window.Bex.init(
-      {
-        id: bexContext.page_context.transaction_id,
-        path: bexContext.page_context.path,
-        token: bexContext.page_context.token
-      },
-      'modal',
-      {
-        container: `js-bkm-frame-${id}`,
-        buttonSize: [500, 500],
-        skipButton: true,
-        onComplete: async (status) => {
-          if (status == 'success') {
-            const data = await completeBkm().unwrap();
-            const redirectUrl =
-              data.context_list?.[0]?.page_context?.redirect_url;
-
-            if (!redirectUrl) {
-              return;
-            }
+      const bexContext = response.context_list.find(
+        (context) => context.page_name === 'BexBinNumberPage'
+      );
+
+      if (!bexContext) {
+        setIsProcessing(false);
+        return;
+      }
 
-            window.location.href = redirectUrl;
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      window.Bex.init(
+        {
+          id: bexContext.page_context.transaction_id,
+          path: bexContext.page_context.path,
+          token: bexContext.page_context.token
+        },
+        'modal',
+        {
+          container: `js-bkm-frame-${id}`,
+          buttonSize: [500, 500],
+          skipButton: true,
+          onComplete: async (status) => {
+            if (status == 'success') {
+              const data = await completeBkm().unwrap();
+              const redirectUrl =
+                data.context_list?.[0]?.page_context?.redirect_url;
+
+              if (!redirectUrl) {
+                return;
+              }
+
+              window.location.href = redirectUrl;
+            }
           }
         }
-      }
-    );
+      );
+    } catch (error) {
+      setIsProcessing(false);
+    }
   };
 
   if (customUIRender) {
@@ -155,9 +167,8 @@ const BKMOption = ({
         <div className="px-4 sm:px-6">
           <div className="flex items-start flex-col border-t border-solid border-gray-400 py-4 space-y-4">
             {agreementCheckbox &&
-              React.cloneElement(agreementCheckbox, {
-                // @ts-ignore
-                control: control,
+              React.cloneElement(agreementCheckbox as any, {
+                control: control as any,
                 error: errors.agreement,
                 fieldId: 'agreement'
               })}
@@ -167,6 +178,7 @@ const BKMOption = ({
                 classes?.button
               )}
               type="submit"
+              disabled={isButtonDisabled}
               data-testid="checkout-bank-account-place-order"
             >
               <span>{translations?.button ?? 'Pay with BKM Express'}</span>
@@ -176,7 +188,7 @@ const BKMOption = ({
       </form>
       <div
         id={`js-bkm-frame-${id}`}
-        className="bkm-frame flex! justify-center items-center pt-0!"
+        className="bkm-frame !flex justify-center items-center !pt-0"
       ></div>
       <Script src="https://js.bkmexpress.com.tr/v1/javascripts/bex.js" defer />
     </>