diff --git a/packages/cfd/src/Containers/jurisdiction-modal-content.tsx b/packages/cfd/src/Containers/jurisdiction-modal-content.tsx index f9e690c829b3..8f8f60efb8d4 100644 --- a/packages/cfd/src/Containers/jurisdiction-modal-content.tsx +++ b/packages/cfd/src/Containers/jurisdiction-modal-content.tsx @@ -7,29 +7,40 @@ import RootStore from 'Stores/index'; import { connect } from 'Stores/connect'; type TJurisdictionModalContent = { + account_type: string; jurisdiction_selected_card: string | undefined; selectTypeOfCard: (card_type: string | undefined) => string | undefined; - account_status: any[]; synthetic_available_accounts: any[]; financial_available_accounts: any[]; + poa_status: string; + poi_status: string; }; const JurisdictionModalContent = ({ jurisdiction_selected_card, + account_type, selectTypeOfCard, - account_status, synthetic_available_accounts, financial_available_accounts, + poa_status, + poi_status, }: TJurisdictionModalContent) => { - const amount_of_synthetic_accounts_to_be_shown = synthetic_available_accounts.length; - const amount_of_financial_accounts_to_be_shown = financial_available_accounts.length; + const number_of_synthetic_accounts_to_be_shown = synthetic_available_accounts.length; + const number_of_financial_accounts_to_be_shown = financial_available_accounts.length; - const [verification_status] = React.useState('POI'); - const [verification_status2] = React.useState('verified'); - const [verification_status3] = React.useState('not_submitted'); - const [verification_status4] = React.useState('pending'); const [unselect_card, setUnselectCard] = React.useState(false); - const [number_of_cards] = React.useState(amount_of_financial_accounts_to_be_shown); + const [number_of_cards] = React.useState( + account_type === 'Synthetic' + ? number_of_synthetic_accounts_to_be_shown + : number_of_financial_accounts_to_be_shown + ); + + const poa_pending = poa_status === 'pending'; + const poa_verified = poa_status === 'verified'; + const poa_none = poa_status === 'none'; + const poi_pending = poi_status === 'pending'; + const poi_verified = poi_status === 'verified'; + const poi_none = poi_status === 'none'; const cardSelection = (cardType: string) => { setUnselectCard(!unselect_card); @@ -42,6 +53,48 @@ const JurisdictionModalContent = ({ const OneOrTwoCards = number_of_cards === 1 || number_of_cards === 2; + const Verification_statuses = () => { + return ( + <> + {poa_none && poi_none && ( +
+

+ +

+
+ )} + {(poa_pending || poi_pending) && ( +
+

+ +

+
+ )} + {poa_verified && poi_verified && ( +
+

+ +

+
+ )} + {poi_none && poa_verified && ( +
+

+ +

+
+ )} + {poa_none && poi_verified && ( +
+

+ +

+
+ )} + + ); + }; + return ( <>
@@ -80,41 +133,7 @@ const JurisdictionModalContent = ({
- {verification_status === 'not_submitted' && ( -
-

- -

-
- )} - {verification_status === 'pending' && ( -
-

- -

-
- )} - {verification_status === 'verified' && ( -
-

- -

-
- )} - {verification_status === 'POA' && ( -
-

- -

-
- )} - {verification_status === 'POI' && ( -
-

- -

-
- )} + )} @@ -152,41 +171,7 @@ const JurisdictionModalContent = ({ - {verification_status2 === 'not_submitted' && ( -
-

- -

-
- )} - {verification_status2 === 'pending' && ( -
-

- -

-
- )} - {verification_status2 === 'verified' && ( -
-

- -

-
- )} - {verification_status2 === 'POA' && ( -
-

- -

-
- )} - {verification_status2 === 'POI' && ( -
-

- -

-
- )} + {Verification_statuses()} )} {number_of_cards >= 3 && ( @@ -226,41 +211,7 @@ const JurisdictionModalContent = ({ - {verification_status3 === 'not_submitted' && ( -
-

- -

-
- )} - {verification_status3 === 'pending' && ( -
-

- -

-
- )} - {verification_status3 === 'verified' && ( -
-

- -

-
- )} - {verification_status3 === 'POA' && ( -
-

- -

-
- )} - {verification_status3 === 'POI' && ( -
-

- -

-
- )} + {Verification_statuses()} )} @@ -298,41 +249,7 @@ const JurisdictionModalContent = ({ - {verification_status3 === 'not_submitted' && ( -
-

- -

-
- )} - {verification_status3 === 'pending' && ( -
-

- -

-
- )} - {verification_status3 === 'verified' && ( -
-

- -

-
- )} - {verification_status4 === 'POA' && ( -
-

- -

-
- )} - {verification_status4 === 'POI' && ( -
-

- -

-
- )} + {Verification_statuses()} )} diff --git a/packages/cfd/src/Containers/jurisdiction-modal.tsx b/packages/cfd/src/Containers/jurisdiction-modal.tsx index 40c1cb908bbc..88a77f1ef573 100644 --- a/packages/cfd/src/Containers/jurisdiction-modal.tsx +++ b/packages/cfd/src/Containers/jurisdiction-modal.tsx @@ -15,6 +15,11 @@ type TCompareAccountsReusedProps = { }; type TJurisdictionModalProps = TCompareAccountsReusedProps & { + account_type: string; + authentication_status: { + document_status: string; + identity_status: string; + }; disableApp: () => void; enableApp: () => void; is_jurisdiction_modal_visible: boolean; @@ -28,6 +33,8 @@ type TJurisdictionModalProps = TCompareAccountsReusedProps & { }; const JurisdictionModal = ({ + account_type, + authentication_status, disableApp, enableApp, is_jurisdiction_modal_visible, @@ -45,6 +52,9 @@ const JurisdictionModal = ({ .filter(available_account => available_account.market_type === 'gaming') .map((acc: any[]) => acc); + const poa_status = authentication_status?.document_status; + const poi_status = authentication_status?.identity_status; + return ( <>