chore: refactored usepoi hook to return some statuses

binary-com · Nov 22, 2023 · 2bfe255 · 2bfe255
1 parent 897b0a5
commit 2bfe255
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/packages/api/src/hooks/usePOI.ts b/packages/api/src/hooks/usePOI.ts
@@ -88,6 +88,11 @@ const usePOI = () => {
             ...authentication_data?.identity,
             previous: previous_poi,
             current: current_poi,
+            is_pending: authentication_data?.identity?.status === 'pending',
+            is_rejected: authentication_data?.identity?.status === 'rejected',
+            is_expired: authentication_data?.identity?.status === 'expired',
+            is_suspected: authentication_data?.identity?.status === 'suspected',
+            is_verified: authentication_data?.identity?.status === 'verified',
         };
     }, [authentication_data, current_poi, previous_poi]);
 

diff --git a/packages/wallets/src/features/cfd/screens/VerificationFailed/VerificationFailed.tsx b/packages/wallets/src/features/cfd/screens/VerificationFailed/VerificationFailed.tsx
@@ -1,17 +1,31 @@
 import React from 'react';
+import { usePOA, usePOI } from '@deriv/api';
 import { WalletButton, WalletText } from '../../../../components/Base';
 import { useModal } from '../../../../components/ModalProvider';
 import './VerificationFailed.scss';
 
+const getDocumentTitle = (isPOIFailed?: boolean, isPOAFailed?: boolean) => {
+    if (isPOIFailed && isPOAFailed) return 'proof of identity and proof of address';
+    if (isPOIFailed) return 'proof of identity';
+    return 'proof of address';
+};
+
 const VerificationFailed = () => {
     const { hide } = useModal();
+    const { data: poiStatus } = usePOI();
+    const { data: poaStatus } = usePOA();
+
+    const isPOIFailed = poiStatus?.is_rejected || poiStatus?.is_expired || poiStatus?.is_suspected;
+    const isPOAFailed = poaStatus?.is_rejected || poaStatus?.is_expired || poaStatus?.is_suspected;
+
     return (
         <div className='wallets-verification-failed'>
             <WalletText size='sm' weight='bold'>
                 Why did my verification fail?
             </WalletText>
             <WalletText size='sm'>
-                Your [dynamic document] did not pass our verification checks. This could be due to reasons such as:
+                Your {getDocumentTitle(isPOIFailed, isPOAFailed)} did not pass our verification checks. This could be
+                due to reasons such as:
             </WalletText>
             <ul>
                 <li>