Shaheer/Suisin/Amina/feature/90115/update jurisdiction (binary-com#8093)

* refactor: ✏️ renames a type

* refactor: 🎨 improves code structure by removing unwanted return statements

* refactor: 🎨 organises jurisdiction contents to seperate folder

* refactor: ✏️ renames a type

* refactor: ✨ converts jurisdiction object to functions for translation

* refactor: 💄 nests sass classes

* refactor: 💄 nests sass classes

* refactor: 🎨 uses border radius constant value in css

* refactor: 🎨 refactors css property usages

* refactor: ✏️ renames a key in mt5 contents

* refactor: 🎨 refactors mt5 code

* refactor: 🎨 sorts color constants used

* refactor: 🎨 refactors color usages

* fix: 🐛 prevents states of child card being destroyed by parent

* refactor: 🗑️ cleans up jurisdiction code

* chore: update Test Case for Jurisdiction modal content

* refactor: 🎨 moves state down the tree from parent to local level

* feat: ✨ animates jurisdiction card on flip

* feat: ✨ displays 'Added' indicator if the card is already added

* chore: test case for jurisdiction modal content

* chore: update jurisdiction_selected_shortcode for foot note

* chore: update import to follow document

* style: 💄 fixes the height

* chore: test case for jurisdiction card front

* chore: remove hard coded parts

* chore: move the imports variable according to documentation

* style: 💄 styles the back of the card as per figma design

* refactor: ✏️ rearranges import statements

* chore: included checks for MF clients and high risk clients

* chore: updated test case based on comments

* refactor: 🗑️ removes unwanted css classes

* refactor: 🎨 moved classNames into single object

* refactor: 🎨 rearranges import statements

* chore: updated logic for test cases

* chore: update test case in footnote

* refactor: 🎨 sorts props alphabetically

* refactor: 🎨 reuses the prop object

* refactor: ✏️ sorts props alphabetically

* refactor: 🎨 uses single object for classnames

* style: 💄 aligns card sections equally

* feat: ✨ sets up displaying verification icons in card front

* refactor: 🎨 sorts props alphabetically

* refactor: 🎨 adds verification items to props

* feat: ✨ displays verification icons on card front

* chore: test case for jurisdiction title indicator

* feat: ✨ adds icons for various verification status

* refactor: 🎨 adds account_status to components

* refactor: 🎨 adds type_of_card props to components

* fix: 💄 fixes icon to text alignment

* chore: test case for jurisdiction card section

* chore: update code to check test over header not in test case

* feat: ✨ displays verification icons based on status

* chore: test case for jurisdiction clickable description

* style: 💄 fixes jurisdiction modal width

* fix: 🐛 jurisdiction testcase fix

* fix: 💄 fixes modal height clipping

* fix: 💄 fixes modal card heights

* refactor: ✏️ renames a type variable

* refactor: 🗑️ removes unused text value

* chore: test case for jurisdiction card

* style: 💄 refactors styling

* fix: 🐛 fixes firefox flipped card issue

* chore: updated test case based on new changes

* chore: update test case based on latest update

* chore: remove hard coded variables

* chore: edit test case based on latest update

* chore: test case for jurisdiction card back

* fix: 🐛 fixes crossbrowser support issues

* chore: update code based on comment

* chore: remove as const from code

* chore: remove as const from code

* chore: remove object type declaration for data-testid

* chore: added extra check for className for clickable description

* chore: remove all as const

* chore: remove as const from code base

* refactor: ♻️ refactors the code

* refactor: ♻️ refactors jurisdiction localize usages

* refactor: 🎨 uses existing color for Text component

* perf: ⚡ optimizes svg icons

* chore: remove secret from currency-selector

* refactor: ✏️ renames css variable

* chore: fix code smells issue

* refactor: ✏️ renames jurisdiction content getter funcs

* refactor: 💄 uses BORDER_RADIUS constant in css

* refactor: 🎨 uses react MouseEvent instead of SyntheticEvent

* refactor: 🎨 uses hook via React namespace

* chore: update code based on comments

* fix: 🐛 removes gradient effect from jurisdiction card

* fix: 🐛 updates verification docs icons for vanuatu

* fix: 🐛 displays the correct icon on card

* fix: 🐛 fixes onfido verification screens

* fix: 🐛 fixes circleci issues

* fix: 🐛 verification icons update based on onfido

* fix: 🐛 inlcudes onfido verification case for all cards

* refactor: ✏️ adds default prop value for is_onfido_design

* style: 💄 adjusts card width as per figma design

* Revert "style: 💄 adjusts card width as per figma design"

This reverts commit 58f5c18.

* fix: 🐛 displays card text as per figma design

* fix: 🐛 fixes labuan assets value

* style: 💄 fixes hover effect for added cards

* fix: 🐛 adds disabled prop for flipped card

* test: 🧪 adds missing prop to jurisdiction testcase

* test: 🧪 fixes circleci test

* test: 🧪 fixes testcases for swapfree merge

* feat: ✨ includes swap free to new design

* style: 💄 fixes modal width for swap free

* refactor: 🗑️ refactors and cleans the code

* fix: empty_commit_to_trigger_build

* refactor: ✏️ renames variable to avoid ambiguity

* refactor: 🧪 removes duplicate testcase mockprops

* test: 🧪 adds swap-free related tests to jurisdiction modal

* chore: update test case declare function

* chore: solve circi issue

* chore: 🧪 fixes circleci issue

---------

Co-authored-by: Shaheer <122449658+shaheer-deriv@users.noreply.github.com>
Co-authored-by: Shaheer <shaheer@deriv.com>
Co-authored-by: Taysuisin <suisin@regentmarkets.com>
Co-authored-by: Matin shafiei <matin@binary.com>
Co-authored-by: Matin shafiei <matin@deriv.com>
Co-authored-by: Sui Sin <103026762+suisin-deriv@users.noreply.github.com>
Co-authored-by: hirad-deriv <hirad@re-work.dev>
Co-authored-by: hirad-deriv <hirad@regentmarkets.com>

packages/account/src/Components/currency-selector/__tests__/currency-selector.spec.tsx

@@ -26,8 +26,8 @@ describe('<CurrencySelector/>', () => {
                 is_virtual: 1,
                 landing_company_shortcode: 'virtual',
                 trading: {},
-                token: 'a1-sLGGrhfYPkeEprxEop2T591cLKbuN',
-                email: 'test+qw@deriv.com',
+                token: '',
+                email: '',
                 session_start: 1651059038,
                 excluded_until: '',
                 landing_company_name: 'virtual',
@@ -273,8 +273,8 @@ describe('<CurrencySelector/>', () => {
                     is_virtual: 1,
                     landing_company_shortcode: 'svg',
                     trading: {},
-                    token: 'a1-sLGGrhfYPkeEprxEop2T591cLKbuN',
-                    email: 'test+qw@deriv.com',
+                    token: '',
+                    email: '',
                     session_start: 1651059038,
                     excluded_until: '',
                     landing_company_name: 'svg',

packages/account/src/Components/poi-poa-docs-submitted/poi-poa-docs-submitted.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Button, Icon, Loading } from '@deriv/components';
 import { localize } from '@deriv/translations';
-import { getAuthenticationStatusInfo } from '@deriv/shared';
+import { getAuthenticationStatusInfo, Jurisdiction } from '@deriv/shared';
 import IconMessageContent from 'Components/icon-message-content';
 import { GetAccountStatus } from '@deriv/api-types';
 
@@ -43,8 +43,9 @@ const PoiPoaDocsSubmitted = ({
     const getDescription = () => {
         const { manual_status, poi_verified_for_vanuatu_maltainvest, poi_verified_for_bvi_labuan, poa_pending } =
             getAuthenticationStatusInfo(account_status);
-        const is_vanuatu_or_maltainvest_selected =
-            jurisdiction_selected_shortcode === 'vanuatu' || jurisdiction_selected_shortcode === 'maltainvest';
+        const is_vanuatu_or_maltainvest_selected = [Jurisdiction.VANUATU, Jurisdiction.MALTA_INVEST].includes(
+            jurisdiction_selected_shortcode
+        );
         if (
             (is_vanuatu_or_maltainvest_selected && poi_verified_for_vanuatu_maltainvest && poa_pending) ||
             (!is_vanuatu_or_maltainvest_selected && poi_verified_for_bvi_labuan && poa_pending) ||

packages/account/src/Sections/Verification/ProofOfIdentity/proof-of-identity-submission-for-mt5.jsx

@@ -1,6 +1,6 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 import React from 'react';
-import { WS } from '@deriv/shared';
+import { WS, Jurisdiction } from '@deriv/shared';
 import Unsupported from 'Components/poi/status/unsupported';
 import OnfidoUpload from './onfido-sdk-view.jsx';
 import { identity_status_codes, submission_status_code, service_code } from './proof-of-identity-utils';
@@ -30,7 +30,7 @@ const POISubmissionForMT5 = ({
                 is_idv_supported &&
                 Number(idv_submissions_left) > 0 &&
                 !is_idv_disallowed &&
-                jurisdiction_selected_shortcode !== 'vanuatu'
+                jurisdiction_selected_shortcode !== Jurisdiction.VANUATU
             ) {
                 setSubmissionService(service_code.idv);
             } else if (onfido_submissions_left && is_onfido_supported) {