OPS-511: Add Gateways Business Error (#337)

src/common/backend/p2p/getGateways.ts

@@ -1,4 +1,4 @@
-import { Gateway } from './types';
+import { BusinessError, Gateway } from './types';
 import { fetchApi } from '../../../common/utils';
 
 export const getGateways = async (
@@ -6,7 +6,7 @@ export const getGateways = async (
     accessToken: string,
     invoiceID: string,
     paymentID: string,
-): Promise<Gateway[]> => {
+): Promise<Gateway[] | BusinessError> => {
     const queryParams = new URLSearchParams({
         invoiceId: invoiceID,
         paymentId: paymentID,

src/common/backend/p2p/index.ts

@@ -2,4 +2,11 @@ export { complete } from './complete';
 export { getDestinations } from './getDestinations';
 export { getGateways } from './getGateways';
 
-export type { Gateway, Destination, DestinationBankAccount, DestinationBankCard, DestinationSBP } from './types';
+export type {
+    Gateway,
+    Destination,
+    DestinationBankAccount,
+    DestinationBankCard,
+    DestinationSBP,
+    BusinessError,
+} from './types';

src/common/backend/p2p/types.ts

@@ -1,3 +1,7 @@
+export type BusinessError = {
+    errorMessage: string;
+};
+
 export type Gateway = {
     id: string;
     name: string;

src/components/ViewContainer/ApiExtensionView/useGateways.ts

@@ -1,25 +1,44 @@
 import { useCallback, useReducer } from 'react';
 
-import { Gateway, getGateways as getApiGateways } from 'checkout/backend/p2p';
-import { extractError, withRetry } from 'checkout/utils';
+import { BusinessError, Gateway, getGateways as getApiGateways } from 'checkout/backend/p2p';
+import { extractError, isNil, withRetry } from 'checkout/utils';
 
-type State = { status: 'PRISTINE' | 'LOADING' | 'FAILURE' } | { status: 'SUCCESS'; data: Gateway[] };
+type State =
+    | { status: 'PRISTINE' | 'LOADING' }
+    | { status: 'SUCCESS'; data: Gateway[] }
+    | { status: 'BUSINESS_ERROR'; error: BusinessError }
+    | { status: 'FAILURE'; error: unknown };
 
-type Action = { type: 'FETCH_START' } | { type: 'FETCH_SUCCESS'; payload: Gateway[] } | { type: 'FETCH_FAILURE' };
+type Action =
+    | { type: 'FETCH_START' }
+    | { type: 'FETCH_SUCCESS'; payload: Gateway[] }
+    | { type: 'FETCH_BUSINESS_ERROR'; payload: BusinessError }
+    | { type: 'FETCH_FAILURE'; error: unknown };
 
 const reducer = (state: State, action: Action): State => {
     switch (action.type) {
         case 'FETCH_START':
-            return { ...state, status: 'LOADING' };
+            return { status: 'LOADING' };
         case 'FETCH_SUCCESS':
             return { status: 'SUCCESS', data: action.payload };
+        case 'FETCH_BUSINESS_ERROR':
+            return { status: 'BUSINESS_ERROR', error: action.payload };
         case 'FETCH_FAILURE':
-            return { status: 'FAILURE' };
+            return { status: 'FAILURE', error: action.error };
         default:
             return state;
     }
 };
 
+const isGateways = (payload: Gateway[] | BusinessError): payload is Gateway[] => {
+    return Array.isArray(payload);
+};
+
+const isBusinessError = (payload: Gateway[] | BusinessError): payload is BusinessError => {
+    if (isGateways(payload)) return false;
+    return !isNil(payload?.errorMessage);
+};
+
 export const useGateways = (capiEndpoint: string, accessToken: string, invoiceID: string, paymentID: string) => {
     const [gatewaysState, dispatch] = useReducer(reducer, {
         status: 'PRISTINE',
@@ -29,10 +48,18 @@ export const useGateways = (capiEndpoint: string, accessToken: string, invoiceID
         dispatch({ type: 'FETCH_START' });
         try {
             const getGatewaysWithRetry = withRetry(getApiGateways);
-            const gateways = await getGatewaysWithRetry(capiEndpoint, accessToken, invoiceID, paymentID);
-            dispatch({ type: 'FETCH_SUCCESS', payload: gateways });
+            const gatewaysOrBusinessError = await getGatewaysWithRetry(capiEndpoint, accessToken, invoiceID, paymentID);
+            if (isGateways(gatewaysOrBusinessError)) {
+                dispatch({ type: 'FETCH_SUCCESS', payload: gatewaysOrBusinessError });
+                return;
+            }
+            if (isBusinessError(gatewaysOrBusinessError)) {
+                dispatch({ type: 'FETCH_BUSINESS_ERROR', payload: gatewaysOrBusinessError });
+                return;
+            }
+            throw new Error('Unknown getGateways response format.');
         } catch (error) {
-            dispatch({ type: 'FETCH_FAILURE' });
+            dispatch({ type: 'FETCH_FAILURE', error });
             console.error(`Failed to fetch gateways. ${extractError(error)}`);
         }
     }, [capiEndpoint, accessToken, invoiceID, paymentID]);

src/components/ViewContainer/ApiExtensionView/useRequisites.ts

@@ -63,6 +63,10 @@ export const useRequisites = (
         if (gatewaysState.status === 'FAILURE') {
             dispatch({ type: 'FETCH_FAILURE' });
         }
+        if (gatewaysState.status === 'BUSINESS_ERROR') {
+            console.error(`Failed to fetch gateways. Business Error: ${gatewaysState.error.errorMessage}`);
+            dispatch({ type: 'FETCH_FAILURE' });
+        }
     }, [gatewaysState]);
 
     useEffect(() => {