[WALL] Fix POA screen switching condition and POI status hook (#11687)

* chore: removed responsive root

* fix: fix issue where poa screen is not shown

* chore: removed unrelated changes

packages/api/src/hooks/useAuthentication.ts

@@ -35,9 +35,9 @@ const useAuthentication = () => {
             is_poi_name_mismatch: account_status.has('poi_name_mismatch'),
             /** client's name in POA documents does not match */
             is_poa_address_mismatch: account_status.has('poa_address_mismatch'),
-            /** client has attempted POI before */
-            has_poa_been_attempted: get_account_status_data?.authentication?.document?.status !== 'none',
             /** client has attempted POA before */
+            has_poa_been_attempted: get_account_status_data?.authentication?.document?.status !== 'none',
+            /** client has attempted POI before */
             has_poi_been_attempted: get_account_status_data?.authentication?.identity?.status !== 'none',
             /** client's poi verification status */
             poi_status: get_account_status_data?.authentication?.identity?.status,

packages/api/src/hooks/usePOI.ts

@@ -47,7 +47,7 @@ const usePOI = () => {
         const user_country_code = get_settings_data?.citizen || get_settings_data?.country_code;
         const matching_residence_data = residence_list_data?.find(r => r.value === user_country_code);
         const is_idv_supported = matching_residence_data?.identity?.services?.idv?.is_country_supported;
-        const is_onfido_supported = matching_residence_data?.identity?.services?.onfido?.documents_supported;
+        const is_onfido_supported = matching_residence_data?.identity?.services?.onfido?.is_country_supported;
         const services = authentication_data?.identity?.services;
         const idv_submission_left = services?.idv?.submissions_left ?? 0;
         const onfido_submission_left = services?.onfido?.submissions_left ?? 0;

packages/wallets/src/features/cfd/flows/Verification/Verification.tsx

@@ -1,5 +1,5 @@
 import React, { FC, useMemo } from 'react';
-import { useAuthentication, usePOA, usePOI, useSettings } from '@deriv/api';
+import { usePOA, usePOI, useSettings } from '@deriv/api';
 import { ModalStepWrapper, WalletButton } from '../../../../components/Base';
 import { FlowProvider, TFlowProviderContext } from '../../../../components/FlowProvider';
 import { Loader } from '../../../../components/Loader';
@@ -36,29 +36,29 @@ type TVerificationProps = {
 const Verification: FC<TVerificationProps> = ({ selectedJurisdiction }) => {
     const { data: poiStatus, isSuccess: isSuccessPOIStatus } = usePOI();
     const { data: poaStatus, isSuccess: isSuccessPOAStatus } = usePOA();
-    const { data: authenticationData } = useAuthentication();
     const { data: getSettings, update: updateSettings } = useSettings();
     const { getModalState, hide, show } = useModal();
 
     const selectedMarketType = getModalState('marketType') || 'all';
     const platform = getModalState('platform') || 'mt5';
+    const shouldSubmitPOA = useMemo(
+        () => !poaStatus?.has_attempted_poa || (!poaStatus?.is_pending && !poaStatus.is_verified),
+        [poaStatus]
+    );
 
     const isLoading = useMemo(() => {
         return !isSuccessPOIStatus || !isSuccessPOAStatus;
     }, [isSuccessPOIStatus, isSuccessPOAStatus]);
 
-    const hasAttemptedPOA = poaStatus?.has_attempted_poa || true;
-
     const initialScreenId: keyof typeof screens = useMemo(() => {
         const service = (poiStatus?.current?.service || 'manual') as keyof THooks.POI['services'];
 
         if (poiStatus?.services && isSuccessPOIStatus) {
             const serviceStatus = poiStatus.status;
 
             if (!isSuccessPOIStatus) return 'loadingScreen';
-
             if (serviceStatus === 'pending' || serviceStatus === 'verified') {
-                if (authenticationData?.is_poa_needed && !hasAttemptedPOA) return 'poaScreen';
+                if (shouldSubmitPOA) return 'poaScreen';
                 if (!getSettings?.has_submitted_personal_details) return 'personalDetailsScreen';
                 show(<MT5PasswordModal marketType={selectedMarketType} platform={platform} />);
             }
@@ -69,8 +69,7 @@ const Verification: FC<TVerificationProps> = ({ selectedJurisdiction }) => {
     }, [
         poiStatus,
         isSuccessPOIStatus,
-        authenticationData?.is_poa_needed,
-        hasAttemptedPOA,
+        shouldSubmitPOA,
         getSettings?.has_submitted_personal_details,
         show,
         selectedMarketType,
@@ -115,7 +114,7 @@ const Verification: FC<TVerificationProps> = ({ selectedJurisdiction }) => {
             } else if (currentScreenId === 'manualScreen') {
                 // TODO: call the api here
             }
-            if (hasAttemptedPOA) {
+            if (shouldSubmitPOA) {
                 switchScreen('poaScreen');
             } else if (!getSettings?.has_submitted_personal_details) {
                 switchScreen('personalDetailsScreen');