@autobusal/order-process 1.3.1 → 1.3.3

package/BKT/Bkt.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useRef } from 'react';
 import { TFunction } from 'i18next';
 import { useForm } from 'react-hook-form';
+import { useNavigate } from 'react-router-dom';
 import { Inline } from '@autobusal/common';
 import { Container } from '../styles';
 import { BKTFormData } from '../types';
@@ -16,7 +17,9 @@ const Bkt = ({ hash, t }: Props): JSX.Element => {
 
   const ref = useRef<HTMLFormElement>(null);
 
-  const { data, isLoading, isSuccess } = useMakeBkt(String(hash));
+  const { data, isLoading, isSuccess, isError } = useMakeBkt(String(hash));
+
+  const navigate = useNavigate();
 
   const onSubmit = (): void => {
     ref.current?.submit();
@@ -28,6 +31,18 @@ const Bkt = ({ hash, t }: Props): JSX.Element => {
     }
   }, [isSuccess, handleSubmit]);
 
+  // Edited: Ferjolt Ozuni - Date: 2026-07-18
+  // Bug: unlike the other 4 gateways, BKT never even reached an isSuccess
+  // state on failure (isLoading just stayed true), so this stuck on the
+  // loading text forever with no way out. Fix: navigate back so they can
+  // retry. Same fix as Raiffeisen/Stripe/Mollie/Nexi (see Raiffeisen.tsx for
+  // the full explanation, including why there's no toast() call here).
+  useEffect(() => {
+    if (isError) {
+      navigate(-1);
+    }
+  }, [isError, navigate]);
+
   if (isLoading) {
     return (
       <Container>
@@ -40,7 +55,12 @@ const Bkt = ({ hash, t }: Props): JSX.Element => {
     <Container>
       <Inline text={ t('order_process.bkt') } />
 
-      <form ref={ ref } action="https://pgw.bkt.com.al/fim/est3Dgate" method="POST" onSubmit={ handleSubmit(onSubmit) }>
+      { /* Edited: Ferjolt Ozuni - Date: 2026-07-24
+           Bug: the gateway URL was hardcoded here instead of read from the
+           label's own configured BKT credentials (which already have an
+           editable 'url' field in the admin GUI, just unused). Now reads
+           data.url, returned by Prepare::addAccountData() in obtapi. */ }
+      <form ref={ ref } action={ data?.url } method="POST" onSubmit={ handleSubmit(onSubmit) }>
         <input type="hidden" defaultValue={ data?.clientId } { ...register('clientid') } />
         <input type="hidden" defaultValue={ data?.storetype } { ...register('storetype') } />
         <input type="hidden" defaultValue={ data?.trantype } { ...register('trantype') } />

package/CHANGELOG.md

@@ -0,0 +1,37 @@
+# Changelog
+
+All notable changes to `@autobusal/order-process` are documented here. This
+project adheres to [Keep a Changelog](https://keepachangelog.com/en/1.1.0/) and
+[Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [1.3.3] - 2026-07-24
+
+### Fixed
+
+- **`BKT/Bkt.tsx` was submitting a nearly-blank form to the bank.** The component reads camelCase fields (`clientId`, `orderId`, `fullName`, `postalCode`, etc.) matching the `BKTData` type, but `BKTController::make()` on the backend was returning a differently-shaped payload (raw bank field names like `clientid`, `ObtBktId`, `ShippingNameSurname`) with none of the expected keys present — every hidden input except `amount`/`description`/`rnd`/`hash`/`refreshtime` was silently `undefined`. Fixed on the obtapi side (`Prepare::$data` is now what's returned); no change needed here beyond adding the new `url` field.
+- The gateway URL was hardcoded (`https://pgw.bkt.com.al/fim/est3Dgate`) instead of read from the label's own configured BKT credentials. Now reads `data.url`, which the admin GUI already has an editable field for.
+
+## [1.3.2] - 2026-07-19
+
+### Fixed
+
+- **Payment-initiation failures no longer strand the user on a spinner.** The
+  five gateway components — `Reiffeisen/Raiffeisen.tsx`, `Stripe/Stripe.tsx`,
+  `Mollie/Mollie.tsx`, `Nexi/Nexi.tsx`, and `BKT/Bkt.tsx` — previously only
+  reacted to `isSuccess`. When the `useMake*` payment-initiation request
+  failed (gateway auth failure, no funds, etc.), the component sat on
+  "Preparing to take you to the payment portal…" indefinitely with no feedback
+  and no way out except leaving the page. Each now also consumes `isError`
+  from its query and, in an effect, calls `navigate(-1)` to return the user so
+  they can retry. No local `toast()`/`error()` is raised on purpose: the
+  `@autobusal/providers` Axios response interceptor already surfaces one toast
+  per 422/500, and adding another here stacked a duplicate.
+- **BKT loading state could never resolve on failure (`BKT/Bkt.tsx`).** Unlike
+  the other four gateways, BKT never reached an `isSuccess` state on failure —
+  `isLoading` simply stayed `true` — so it was stuck on the loading text
+  forever. The new `isError` → `navigate(-1)` handling gives it the same exit
+  path as the others.
+
+Authored by Ferjolt Ozuni. Consolidated from the magus and alvavel whitelabel
+patch sets into canonical @autobusal source (eliminates per-repo patch-package
+divergence).

package/Mollie/Mollie.tsx

@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 import { TFunction } from 'i18next';
+import { useNavigate } from 'react-router-dom';
 import { Inline } from '@autobusal/common';
 import { Container } from '../styles';
 import { useMakeMollie } from '../services';
@@ -10,7 +11,9 @@ interface Props {
 }
 
 const Mollie = ({ hash, t }: Props): JSX.Element => {
-  const { data, isSuccess } = useMakeMollie(String(hash));
+  const { data, isSuccess, isError } = useMakeMollie(String(hash));
+
+  const navigate = useNavigate();
 
   useEffect(() => {
     if (isSuccess) {
@@ -18,6 +21,19 @@ const Mollie = ({ hash, t }: Props): JSX.Element => {
     }
   }, [data, isSuccess]);
 
+  // Edited: Ferjolt Ozuni - Date: 2026-07-18
+  // Bug: this only ever checked isSuccess - a failed payment-initiation
+  // request left the user staring at "Preparing to take you to the payment
+  // portal..." forever with no feedback at all. Fix: navigate back so they
+  // can retry. Same fix applied identically to Raiffeisen/Stripe/Nexi/Bkt
+  // (see Raiffeisen.tsx for the full explanation, including why there's no
+  // toast() call here).
+  useEffect(() => {
+    if (isError) {
+      navigate(-1);
+    }
+  }, [isError, navigate]);
+
   return (
     <Container>
       <Inline text={ t('order_process.mollie') } />

package/Nexi/Nexi.tsx

@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 import { TFunction } from 'i18next';
+import { useNavigate } from 'react-router-dom';
 import { Inline } from '@autobusal/common';
 import { Container } from '../styles';
 import { useMakeNexi } from '../services';
@@ -10,7 +11,9 @@ interface Props {
 }
 
 const Nexi = ({ hash, t }: Props): JSX.Element => {
-  const { data, isSuccess } = useMakeNexi(String(hash));
+  const { data, isSuccess, isError } = useMakeNexi(String(hash));
+
+  const navigate = useNavigate();
 
   useEffect(() => {
     if (isSuccess) {
@@ -18,6 +21,19 @@ const Nexi = ({ hash, t }: Props): JSX.Element => {
     }
   }, [data, isSuccess]);
 
+  // Edited: Ferjolt Ozuni - Date: 2026-07-18
+  // Bug: this only ever checked isSuccess - a failed payment-initiation
+  // request left the user staring at "Preparing to take you to the payment
+  // portal..." forever with no feedback at all. Fix: navigate back so they
+  // can retry. Same fix applied identically to Raiffeisen/Stripe/Mollie/Bkt
+  // (see Raiffeisen.tsx for the full explanation, including why there's no
+  // toast() call here).
+  useEffect(() => {
+    if (isError) {
+      navigate(-1);
+    }
+  }, [isError, navigate]);
+
   return (
     <Container>
       <Inline text={ t('order_process.nexi') } />

package/Reiffeisen/Raiffeisen.tsx

@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 import { TFunction } from 'i18next';
+import { useNavigate } from 'react-router-dom';
 import { Inline } from '@autobusal/common';
 import { Container } from '../styles';
 import { useMakeRaiffeisen } from '../services';
@@ -10,7 +11,9 @@ interface Props {
 }
 
 const Raiffeisen = ({ hash, t }: Props): JSX.Element => {
-  const { data, isSuccess } = useMakeRaiffeisen(String(hash));
+  const { data, isSuccess, isError } = useMakeRaiffeisen(String(hash));
+
+  const navigate = useNavigate();
 
   useEffect(() => {
     if (isSuccess) {
@@ -18,6 +21,22 @@ const Raiffeisen = ({ hash, t }: Props): JSX.Element => {
     }
   }, [data, isSuccess]);
 
+  // Edited: Ferjolt Ozuni - Date: 2026-07-18
+  // Bug: this only ever checked isSuccess - a failed payment-initiation
+  // request (gateway auth failure, no funds, etc) left the user staring
+  // at "Preparing to take you to the payment portal..." forever with no
+  // feedback at all and no way out except leaving the page. Fix: navigate
+  // them back so they can retry. No toast() call here - apiClient's Axios
+  // response interceptor (@autobusal/providers/Queries/apiClient.ts)
+  // already shows one for every 422/500, and calling error() again here
+  // stacked a second, duplicate toast on top of it (caught in browser
+  // testing against the Raiffeisen sandbox).
+  useEffect(() => {
+    if (isError) {
+      navigate(-1);
+    }
+  }, [isError, navigate]);
+
   return (
     <Container>
       <Inline text={ t('order_process.raiffeisen') } />

package/Stripe/Stripe.tsx

@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 import { TFunction } from 'i18next';
+import { useNavigate } from 'react-router-dom';
 import { Inline } from '@autobusal/common';
 import { Container } from '../styles';
 import { useMakeStripe } from '../services';
@@ -10,7 +11,9 @@ interface Props {
 }
 
 const Stripe = ({ hash, t }: Props): JSX.Element => {
-  const { data, isSuccess } = useMakeStripe(String(hash));
+  const { data, isSuccess, isError } = useMakeStripe(String(hash));
+
+  const navigate = useNavigate();
 
   useEffect(() => {
     if (isSuccess) {
@@ -18,6 +21,19 @@ const Stripe = ({ hash, t }: Props): JSX.Element => {
     }
   }, [data, isSuccess]);
 
+  // Edited: Ferjolt Ozuni - Date: 2026-07-18
+  // Bug: this only ever checked isSuccess - a failed payment-initiation
+  // request left the user staring at "Preparing to take you to the payment
+  // portal..." forever with no feedback at all. Fix: navigate back so they
+  // can retry. Same fix applied identically to Raiffeisen/Mollie/Nexi/Bkt
+  // (see Raiffeisen.tsx for the full explanation, including why there's no
+  // toast() call here).
+  useEffect(() => {
+    if (isError) {
+      navigate(-1);
+    }
+  }, [isError, navigate]);
+
   return (
     <Container>
       <Inline text={ t('order_process.stripe') } />

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@autobusal/order-process",
-  "version": "1.3.1",
+  "version": "1.3.3",
+  "author": "Ferjolt Ozuni",
   "type": "module",
   "main": "index.ts"
 }

package/types.ts

@@ -35,6 +35,7 @@ export interface BKTFormData {
 }
 
 export interface BKTData {
+  url: string
   fullName: string
   company: string
   email: string