mustofa/yashim/feat: idv smile identity (deriv-com#3374)

* refactor: class to functional components

* refactor: cleanup

* refactor id service

* feat: add country selector page

* feat: added validation for country selector

* feat: added document upload page

* chore: refactor current poi container logics

* chore: refactor authentication flow

* fix: service_code typo

* feat: add validation to idv upload document

* fix: removed old props

* fix: rejected status

* feat: added doc img placeholder + default format. connected uploader to flow

* feat: add auto-formatter for key input (for supported doc type + countries)

* fix: add missing oncomplete logic from merge resolve

* fix: sample document data fetching

* fix: image + layout fixes to document uploader

* feat: add idv document status pending

* fix: removed test components

* feat: add idv verified page.

* feat: add all remaining status pages

* fix: removed placeholder data

* test: add test-data

* fix: remove re-setting state in child component. derive state directly from parent.

* fix: mobile layout

* fix: onfido layout to match design

* fix: layout of main container to follow design

* fix: all component should load within the main wrapper

* fix: mobile view + auto format feature

* fix: typo

* fix: new imports for WS

* fix: left out WS import

* refactor/feat: add submission. fix auto format

* fix: handle resubmission

* feat: idv upload complete

* fix: poi submission flow

* fix: round 1 mobile fix

* fix: submission

* fix: dropdown styles

* fix: eslint error

* fix: responsive + submission + submission_left checks

* fix: desktop styles + add mock examples for testing diff doc statuses

* feat: add missing status pages. minor fix and refactor

* cleanup + nit fixing

* fix: poi submission refactor

* refactor: cleanups + fixed errors

* fix: added more validation for country selector

* fix: some responsive layout. cleanup.

* fix: mobile country selection. minor refactor

* fix: bugs after review

* fix: add better conditionals

* feat/refactor: added missing sample images. code cleanup

* fix/refactor: fix different contents from design (responsive). renamed file to be clearer

* refactor: final cleanup

* fix: corrected comments

* fix: add external

* fix: move logic for dmt5 poi verification

* fix: cfd poi

* fix: cfd poi + document submission (submit + error)

* fix: QA Bugs Round #1

* feat: add ghana + fix in case of null

* fix: remove mock accounts

* fix: typo

* fix: removed unused imports

* fix: onfido initiation

* fix: QA Bugs

* cleanup

* fix: BE API structure

* fix: fetching data during refresh

* fix: weird linting problems after merge

* fix: QA raised bugs. Updated mock data based on new API structure

* fix: await loading before parsing account status data

* fix: rate limit

* fix: ensure that country is supported before passing to onfido

* fix: QA bugs

* fix: only init onfido if necessary

* fix: service

* fix: remove mock data

* fix: only finish loading once onfido is init

* fix: onfido conditions

* fix: Raised QA Issues

* fix: wrong logic for on item selection

* fix: QA Bugs Round 2

* fix: QA Issue for Kenya Sample

* fix: page shld load either one not both error and onfido pages

* fix: check not updating to latest value

* feat/fix: add new flow. fix all bugs

* fix: loading on error

* fix: flow final form

* fix: onfido_init will always be null

* fix: missing placeholder for reponsive

* fix: document rejected icon (QA)

* fix: conditional

* fix: remove mock data

* fix: missing personal details should take precedence (QA)

* fix: document checking

* fix: precedence + conditions

* fix: copy + weird id returned when null (QA)

* feat: add client store to mt5 financial stp sign up

* feat: add all used states

* fix: poi from dmt5. passing of states

* fix: random "0" appearing after validation

* fix: remove mock data

* fix: addressed code review

* fix: sonarqube cognitive overload

* feat: add support for selecting country code on onfido to BE

* feat: updated copy for onfido submitted

* merge

* fix: enable all countries (QA1)

* fix: add idv_disallowed check to country selector

* fix: text visibility (QA)

* fix: disabled text color (QA)

* fix: autoformatter check

* fix: unsupported regex (QA)

* fix: mobile message (QA)

* fix: mt5 unable to proceed

* fix: idv failure message (QA)

* fix: mt5 modal (QA)

* fix: text + design consistency issues (QA)

* feat: add uwelcome handling (QA)

* revert

* Retrigger sonarcube

* fix: mobile width (QA)

* feat: add handling for status modified from BO (QA)

* Retrigger deployment

* refactor: unused props + update onstatechange logic

* fix: onStateChange status arg

* fix: icon size (QA)

* feat: will always show country selector for both idv + onfido (QA)

* fix: example code length

* fix: doc length based on official src (QA)

* fix: comment spelling

* fix: allow poi for allow_poi_resubmission flag

* fix: allow resubmission will now reset verification flow

* fix: remove disallowed check if there are still attempts

* fix: weird alignment from mt5 sign up (QA)

* fix: after first attempt, will not ask country selector anymore

* fix: revert submission logic

* fix: copy

* fix: mt5 dropdown (QA)

* fix: clipped icons

* fix: z-index

* fix: removed placeholder

* fix: container height (QA)

* fix: side effects

* fix: overlap

* fix: status checking

* feat: add new info message

* fix: wrong url component

* fix: container sizing

* fix: display on large screens

* feat: add alert text

* fix: helper msg show condition

* refactor: use proper fragments

* Apply suggestions from code review

Co-authored-by: reza-fs <53177016+reza-fs@users.noreply.github.com>

* Add suggestions from code review

Co-authored-by: reza-fs <53177016+reza-fs@users.noreply.github.com>

* Add suggestions from code review

Co-authored-by: reza-fs <53177016+reza-fs@users.noreply.github.com>

* fix: add suggestions from code review

* fix: remove localization

* feat: exclude voter id from ghana document list

Co-authored-by: mustofa-binary <mustofa@regentmarkets.com>
Co-authored-by: Dev Sans <yashimwong@gmail.com>
Co-authored-by: Yashim Wong <yashim@Yashims-MacBook-Pro.local>
Co-authored-by: reza-fs <53177016+reza-fs@users.noreply.github.com>
Co-authored-by: Matin shafiei <matin@binary.com>

packages/account/build/webpack.config.js

@@ -46,6 +46,7 @@ module.exports = function (env, argv) {
             'poi-unverified': 'Components/poi-unverified',
             'poi-upload-complete': 'Components/poi-upload-complete',
             'poi-verified': 'Components/poi-verified',
+            'proof-of-identity': 'Sections/Verification/ProofOfIdentity/proof-of-identity.jsx',
             'proof-of-identity-container': 'Sections/Verification/ProofOfIdentity/proof-of-identity-container.jsx',
             'proof-of-address-container': 'Sections/Verification/ProofOfAddress/proof-of-address-container.jsx',
             'reset-trading-password-modal': 'Components/reset-trading-password-modal',

packages/account/package.json

@@ -31,6 +31,7 @@
         "bowser": "^2.9.0",
         "classnames": "^2.2.6",
         "formik": "^2.1.4",
+        "i18n-iso-countries": "^6.8.0",
         "js-cookie": "^2.2.1",
         "mobx": "^5.15.7",
         "mobx-react": "^6.2.2",

packages/account/src/Components/icon-message-content/icon-message-content.jsx

@@ -64,6 +64,6 @@ IconMessageContent.propTypes = {
     full_width: PropTypes.bool,
     icon: PropTypes.object,
     message: PropTypes.oneOfType([PropTypes.node, PropTypes.string, PropTypes.object]),
-    text: PropTypes.string,
+    text: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
 };
 export default IconMessageContent;

packages/account/src/Components/icon-message-list/icon-message-list.jsx

@@ -63,7 +63,7 @@ const IconMessageList = ({ className, icon, message, message_list, onContinue })
                         <Button
                             type='button'
                             className='account-management__continue'
-                            onClick={() => onContinue(true)}
+                            onClick={onContinue}
                             large
                             text={localize('Upload Document')}
                             primary

packages/account/src/Components/poa-button/poa-button.jsx

@@ -1,12 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
 import { ButtonLink, Text } from '@deriv/components';
 import { routes } from '@deriv/shared';
 import { localize } from '@deriv/translations';
-import React from 'react';
 
-export const PoaButton = () => (
+export const PoaButton = ({ custom_text = localize('Proof of address') }) => (
     <ButtonLink className='account-management__button' to={routes.proof_of_address}>
         <Text className='dc-btn__text' as='p' weight='bold'>
-            {localize('Proof of address')}
+            {custom_text || localize('Proof of address')}
         </Text>
     </ButtonLink>
 );
+
+PoaButton.propTypes = {
+    custom_text: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+};

packages/account/src/Components/poi-country-selector/index.js

@@ -0,0 +1,3 @@
+import CountrySelector from './poi-country-selector.jsx';
+
+export default CountrySelector;