chore: incorporated review comments

packages/account/src/Components/forms/idv-form.tsx

@@ -6,30 +6,15 @@ import { localize } from '@deriv/translations';
 import { formatInput, IDV_NOT_APPLICABLE_OPTION } from '@deriv/shared';
 import { Autocomplete, DesktopWrapper, Input, MobileWrapper, SelectNative, Text } from '@deriv/components';
 import { getDocumentData, preventEmptyClipboardPaste, generatePlaceholderText, getExampleFormat } from 'Helpers/utils';
-
-type TDocumentList = Array<{
-    id: string;
-    text: string;
-    value?: string;
-    sample_image?: string;
-    example_format?: string;
-    additional?: any;
-}>;
-
-type TFormProps = {
-    document_type: TDocumentList[0];
-    document_number: string;
-    document_additional?: string;
-    error_message?: string;
-};
+import { TIDVFormValues } from 'Types';
 
 type TIDVForm = {
     selected_country: ResidenceList[0];
     hide_hint?: boolean;
     class_name?: string;
     can_skip_document_verification: boolean;
 } & Partial<FormikHandlers> &
-    FormikProps<TFormProps>;
+    FormikProps<TIDVFormValues>;
 
 const IDVForm = ({
     errors,

packages/account/src/Components/poi/idv-document-submit/idv-document-submit.tsx

@@ -11,13 +11,25 @@ import {
     filterObjProperties,
     isDesktop,
     removeEmptyPropertiesFromObject,
+    formatIDVFormValues,
 } from '@deriv/shared';
 import { documentAdditionalError, getRegex, validate, makeSettingsRequest, validateName } from 'Helpers/utils';
 import FormFooter from 'Components/form-footer';
 import BackButtonIcon from 'Assets/ic-poi-back-btn.svg';
 import IDVForm from 'Components/forms/idv-form';
 import PersonalDetailsForm from 'Components/forms/personal-details-form';
 import FormSubHeader from 'Components/form-sub-header';
+import { GetSettings, IdentityVerificationAddDocumentResponse } from '@deriv/api-types';
+import { TIDVFormValues } from 'Types';
+
+type TIdvDocumentSubmitProps = {
+    handleBack: () => void;
+    handleViewComplete: () => void;
+    selected_country: { text: string; value: string };
+    is_from_external: boolean;
+    account_settings: GetSettings;
+    getChangeableFields: () => string[];
+};
 
 const IdvDocumentSubmit = ({
     handleBack,
@@ -26,7 +38,7 @@ const IdvDocumentSubmit = ({
     is_from_external,
     account_settings,
     getChangeableFields,
-}) => {
+}: TIdvDocumentSubmitProps) => {
     const visible_settings = ['first_name', 'last_name', 'date_of_birth'];
     const form_initial_values = filterObjProperties(account_settings, visible_settings) || {};
 
@@ -83,7 +95,7 @@ const IdvDocumentSubmit = ({
         return undefined;
     };
 
-    const validateFields = values => {
+    const validateFields = (values: TIDVFormValues) => {
         const errors = {};
         const { document_type, document_number, document_additional } = values;
         const needs_additional_document = !!document_type.additional;
@@ -127,25 +139,22 @@ const IdvDocumentSubmit = ({
             setSubmitting(false);
             return;
         }
+
         const submit_data = {
             identity_verification_document_add: 1,
-            document_number: values.document_number,
-            document_additional: values.document_additional || '',
-            document_type: values.document_type.id,
-            issuing_country: selected_country.value,
+            ...formatIDVFormValues(values, selected_country.value),
         };
 
-        if (submit_data.document_type === IDV_NOT_APPLICABLE_OPTION.id) {
-            return;
-        }
-        WS.send(submit_data).then(response => {
-            setSubmitting(false);
-            if (response.error) {
-                setErrors({ error_message: response.error.message });
-                return;
+        WS.send(submit_data).then(
+            (response: IdentityVerificationAddDocumentResponse & { error: { message: string } }) => {
+                setSubmitting(false);
+                if (response.error) {
+                    setErrors({ error_message: response.error.message });
+                    return;
+                }
+                handleViewComplete();
             }
-            handleViewComplete();
-        });
+        );
     };
 
     return (

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, isVerificationServiceSupported, IDV_NOT_APPLICABLE_OPTION } from '@deriv/shared';
+import { WS, isVerificationServiceSupported, formatIDVFormValues } from '@deriv/shared';
 import Unsupported from 'Components/poi/status/unsupported';
 import OnfidoUpload from './onfido-sdk-view-container';
 import { identity_status_codes, submission_status_code, service_code } from './proof-of-identity-utils';
@@ -51,7 +51,6 @@ const POISubmissionForMT5 = ({
 
     const handleIdvSubmit = async (values, { setSubmitting, setErrors }) => {
         setSubmitting(true);
-        const { document_number, document_type } = values;
 
         const request = makeSettingsRequest(values, [...getChangeableFields()]);
 
@@ -72,16 +71,9 @@ const POISubmissionForMT5 = ({
 
         const submit_data = {
             identity_verification_document_add: 1,
-            document_number,
-            document_type: document_type.id,
-            issuing_country: citizen_data.value,
+            ...formatIDVFormValues(values, citizen_data.value),
         };
 
-        if (submit_data.document_type === IDV_NOT_APPLICABLE_OPTION.id) {
-            handlePOIComplete();
-            return;
-        }
-
         WS.send(submit_data).then(response => {
             setSubmitting(false);
             if (response.error) {

packages/account/src/Types/common-prop.type.ts

@@ -153,3 +153,22 @@ export type TInputFieldValues = Record<string, string>;
 export type TVerificationStatus = Readonly<
     Record<'none' | 'pending' | 'rejected' | 'verified' | 'expired' | 'suspected', string>
 >;
+
+type TDocumentList = Array<{
+    id: string;
+    text: string;
+    value?: string;
+    sample_image?: string;
+    example_format?: string;
+    additional?: {
+        display_name: string;
+        format: string;
+    };
+}>;
+
+export type TIDVFormValues = {
+    document_type: TDocumentList[0];
+    document_number: string;
+    document_additional?: string;
+    error_message?: string;
+};

packages/core/src/App/Containers/RealAccountSignup/account-wizard.jsx

@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 
 import { DesktopWrapper, FormProgress, MobileWrapper, Text, Wizard } from '@deriv/components';
-import { WS, getLocation, toMoment, IDV_NOT_APPLICABLE_OPTION } from '@deriv/shared';
+import { WS, getLocation, toMoment, formatIDVFormValues } from '@deriv/shared';
 import { Localize } from '@deriv/translations';
 import { connect } from 'Stores/connect';
 import AcceptRiskForm from './accept-risk-form.jsx';
@@ -259,22 +259,11 @@ const AccountWizard = props => {
         return properties;
     };
 
-    const submitIDVData = async (document_type, document_number, document_additional = '', country_code) => {
-        const idv_submit_data = {
-            identity_verification_document_add: 1,
-            document_number,
-            document_additional,
-            document_type: document_type.id,
-            issuing_country: country_code,
-        };
-        await WS.send(idv_submit_data);
-    };
-
     const createRealAccount = (payload = undefined) => {
         setLoading(true);
         const form_data = { ...form_values() };
         submitForm(payload)
-            .then(response => {
+            .then(async response => {
                 props.setIsRiskWarningVisible(false);
                 if (props.real_account_signup_target === 'maltainvest') {
                     props.onFinishSuccess(response.new_account_maltainvest.currency.toLowerCase());
@@ -283,18 +272,13 @@ const AccountWizard = props => {
                 } else {
                     props.onFinishSuccess(response.new_account_real.currency.toLowerCase());
                 }
-                const { document_type, document_number, document_additional } = { ...form_values() };
-                /**
-                 * If user opted-out of IDV verification, we send the value "none" for document_number and document_type to the API.
-                 */
-                const idv_doc_number =
-                    document_type.id === IDV_NOT_APPLICABLE_OPTION.id
-                        ? IDV_NOT_APPLICABLE_OPTION.value
-                        : document_number;
-                if (document_type && idv_doc_number) {
-                    const country_code = props.account_settings.citizen || props.residence;
-                    submitIDVData(document_type, idv_doc_number, document_additional, country_code);
-                }
+                const country_code = props.account_settings.citizen || props.residence;
+                const idv_form_data = form_values();
+                const idv_submit_data = {
+                    identity_verification_document_add: 1,
+                    ...formatIDVFormValues(idv_form_data, country_code),
+                };
+                await WS.send(idv_submit_data);
             })
             .catch(error => {
                 if (error.code === 'show risk disclaimer') {

packages/shared/src/utils/config/__tests__/adapters.spec.ts

@@ -0,0 +1,33 @@
+import { formatIDVFormValues } from '../adapters';
+
+describe('Adapter functions tests', () => {
+    it('should return the correct IDV form values', () => {
+        const form_data = {
+            document_type: { id: 'test' },
+            document_additional: 'additional text',
+            document_number: '123456789',
+        };
+
+        expect(formatIDVFormValues(form_data, 'US')).toEqual({
+            document_number: '123456789',
+            document_additional: 'additional text',
+            document_type: 'test',
+            issuing_country: 'US',
+        });
+    });
+
+    it('should render the correct IDV form values when document type is not applicable', () => {
+        const form_data = {
+            document_type: { id: 'none' },
+            document_additional: '',
+            document_number: '123456789',
+        };
+
+        expect(formatIDVFormValues(form_data, 'US')).toEqual({
+            document_number: 'none',
+            document_additional: '',
+            document_type: 'none',
+            issuing_country: 'US',
+        });
+    });
+});

packages/shared/src/utils/config/adapters.ts

@@ -0,0 +1,40 @@
+import { IDV_NOT_APPLICABLE_OPTION } from '../constants/idv-options';
+import { FormikValues } from 'formik';
+
+type TDocumentList = Array<{
+    id: string;
+    text: string;
+    value?: string;
+    sample_image?: string;
+    example_format?: string;
+    additional?: {
+        display_name: string;
+        format: string;
+    };
+}>;
+
+type TIDVFormValues = {
+    document_type: TDocumentList[0];
+    document_number: string;
+    document_additional?: string;
+    error_message?: string;
+};
+
+/**
+ * Formats the IDV form values to be sent to the API
+ * @param idv_form_value - Formik values of the IDV form
+ * @param country_code - Country code of the user
+ * @returns IDV form values
+ */
+export const formatIDVFormValues = (idv_form_value: FormikValues, country_code: string) => {
+    const idv_submit_data = {
+        document_number:
+            idv_form_value.document_type.id === IDV_NOT_APPLICABLE_OPTION.id
+                ? IDV_NOT_APPLICABLE_OPTION.value
+                : idv_form_value.document_number,
+        document_additional: idv_form_value.document_additional,
+        document_type: idv_form_value.document_type.id,
+        issuing_country: country_code,
+    };
+    return idv_submit_data;
+};

packages/shared/src/utils/config/index.ts

@@ -1,3 +1,4 @@
 export * from './config';
 export * from './app-config';
 export * from './platform-config';
+export * from './adapters';