-
+
{localize('ID verification failed')}
@@ -30,4 +30,4 @@ const IdvNoSubmissions = ({ handleRequireSubmission }: TIdvNoSubmission) => {
);
};
-export default IdvNoSubmissions;
+export default IdvLimited;
diff --git a/packages/account/src/Components/poi/idv-status/idv-limited/index.js b/packages/account/src/Components/poi/idv-status/idv-limited/index.js
deleted file mode 100644
index 1223bdf639cb..000000000000
--- a/packages/account/src/Components/poi/idv-status/idv-limited/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import IdvNoSubmissions from './idv-limited';
-
-export default IdvNoSubmissions;
diff --git a/packages/account/src/Components/poi/idv-status/idv-limited/index.ts b/packages/account/src/Components/poi/idv-status/idv-limited/index.ts
new file mode 100644
index 000000000000..649a4a5158a4
--- /dev/null
+++ b/packages/account/src/Components/poi/idv-status/idv-limited/index.ts
@@ -0,0 +1,3 @@
+import IdvLimited from './idv-limited';
+
+export default IdvLimited;
diff --git a/packages/account/src/Components/poi/idv-status/idv-rejected/__tests__/idv-rejected.spec.tsx b/packages/account/src/Components/poi/idv-status/idv-rejected/__tests__/idv-rejected.spec.tsx
deleted file mode 100644
index 52c58bef0094..000000000000
--- a/packages/account/src/Components/poi/idv-status/idv-rejected/__tests__/idv-rejected.spec.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from 'react';
-import { fireEvent, render, screen } from '@testing-library/react';
-import IdvRejected from '../idv-rejected';
-
-jest.mock('Assets/ic-idv-document-rejected.svg', () => jest.fn(() => 'IdvDocumentRejected'));
-
-describe('
', () => {
- const mockHandleRequireSubmission = jest.fn();
-
- it('should render IdvRejected component and trigger click', () => {
- render(
);
-
- expect(screen.getByText('IdvDocumentRejected')).toBeInTheDocument();
- expect(screen.getByText(/ID verification failed/i)).toBeInTheDocument();
- expect(screen.getByText(/we were unable to verify your ID with the details you provided/i)).toBeInTheDocument();
-
- const btn = screen.getByRole('button');
- expect(btn).toHaveTextContent(/try again/i);
- fireEvent.click(btn);
- expect(mockHandleRequireSubmission).toHaveBeenCalledTimes(1);
- });
-});
diff --git a/packages/account/src/Components/poi/idv-status/idv-rejected/idv-rejected.tsx b/packages/account/src/Components/poi/idv-status/idv-rejected/idv-rejected.tsx
deleted file mode 100644
index 81a4bbc6f83d..000000000000
--- a/packages/account/src/Components/poi/idv-status/idv-rejected/idv-rejected.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import React from 'react';
-import { Button, Text } from '@deriv/components';
-import { localize } from '@deriv/translations';
-import IdvDocumentRejected from 'Assets/ic-idv-document-rejected.svg';
-
-type TIdvRejected = {
- handleRequireSubmission: () => void;
-};
-
-const IdvRejected = ({ handleRequireSubmission }: TIdvRejected) => {
- return (
-
-
-
- {localize('ID verification failed')}
-
-
- {localize('We were unable to verify your ID with the details you provided.')}
-
-
-
- );
-};
-
-export default IdvRejected;
diff --git a/packages/account/src/Components/poi/idv-status/idv-rejected/index.js b/packages/account/src/Components/poi/idv-status/idv-rejected/index.js
deleted file mode 100644
index f35e095598df..000000000000
--- a/packages/account/src/Components/poi/idv-status/idv-rejected/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import IdvRejected from './idv-rejected';
-
-export default IdvRejected;
diff --git a/packages/account/src/Components/poi/idv-status/idv-submit-complete/__tests__/idv-submit-complete.spec.tsx b/packages/account/src/Components/poi/idv-status/idv-submit-complete/__tests__/idv-submit-complete.spec.tsx
index 86212d2144de..aa923548204f 100644
--- a/packages/account/src/Components/poi/idv-status/idv-submit-complete/__tests__/idv-submit-complete.spec.tsx
+++ b/packages/account/src/Components/poi/idv-status/idv-submit-complete/__tests__/idv-submit-complete.spec.tsx
@@ -1,55 +1,154 @@
import React from 'react';
import { BrowserRouter } from 'react-router-dom';
import { render, screen } from '@testing-library/react';
+import { idv_error_statuses } from '@deriv/shared';
import IdvSubmitComplete from '../idv-submit-complete';
+import { StoreProvider, mockStore } from '@deriv/stores';
jest.mock('../../../../../Assets/ic-idv-document-pending.svg', () => jest.fn(() => 'IdvDocumentPending'));
+type TIdvSubmitCompleteProps = React.ComponentProps
;
+
describe('', () => {
- const mock_props = {
+ const mock_props: TIdvSubmitCompleteProps = {
needs_poa: false,
is_from_external: false,
+ redirect_button: '',
};
- const commonRenderCheck = () => {
+ const store = mockStore({
+ client: {
+ account_status: {
+ authentication: {
+ attempts: {
+ count: 0,
+ history: [],
+ },
+ },
+ },
+ },
+ });
+
+ const renderComponent = ({ props = mock_props, store_config = store }) =>
+ render(
+
+
+
+
+
+ );
+
+ it('should render IdvSubmitComplete component external, no needs_poa, without mismatch_status', () => {
+ const new_props: TIdvSubmitCompleteProps = {
+ ...mock_props,
+ redirect_button: 'Mock Redirect Button',
+ };
+ renderComponent({ props: new_props });
+
expect(screen.getByText('IdvDocumentPending')).toBeInTheDocument();
+ expect(screen.getByText('Mock Redirect Button')).toBeInTheDocument();
expect(screen.getByText('Your documents were submitted successfully')).toBeInTheDocument();
expect(
screen.getByText('We’ll review your documents and notify you of its status within 5 minutes.')
).toBeInTheDocument();
- };
- it('should render IdvSubmitComplete component not external, no needs_poa', () => {
- render();
-
- commonRenderCheck();
+ expect(screen.queryByText('Your profile is updated')).not.toBeInTheDocument();
+ expect(screen.queryByText('Your document has been submitted')).not.toBeInTheDocument();
+ expect(
+ screen.queryByText(
+ "We'll review your proof of identity again and will give you an update as soon as possible."
+ )
+ ).not.toBeInTheDocument();
expect(screen.queryByText("Next, we'll need your proof of address.")).not.toBeInTheDocument();
- expect(screen.queryByText('Submit proof of address')).not.toBeInTheDocument();
});
- it('should render IdvSubmitComplete component not external, needs_poa', () => {
- mock_props.needs_poa = true;
- render(
-
-
-
- );
+ it('should render IdvSubmitComplete component needs_poa not external, without mismatch_status and redirect_button', () => {
+ const new_props: TIdvSubmitCompleteProps = {
+ ...mock_props,
+ needs_poa: true,
+ };
- commonRenderCheck();
- expect(screen.getByText("Next, we'll need your proof of address.")).toBeInTheDocument();
+ renderComponent({ props: new_props });
+
+ expect(screen.getByText('IdvDocumentPending')).toBeInTheDocument();
+ expect(screen.getByText('Your documents were submitted successfully')).toBeInTheDocument();
expect(screen.getByText('Submit proof of address')).toBeInTheDocument();
+ expect(screen.getByText("Next, we'll need your proof of address.")).toBeInTheDocument();
+ expect(screen.queryByText('Your profile is updated')).not.toBeInTheDocument();
+ expect(screen.queryByText('Your document has been submitted')).not.toBeInTheDocument();
+ expect(
+ screen.queryByText(
+ "We'll review your proof of identity again and will give you an update as soon as possible."
+ )
+ ).not.toBeInTheDocument();
});
- it('should render IdvSubmitComplete component external, needs_poa', () => {
- mock_props.needs_poa = true;
- mock_props.is_from_external = true;
- render(
-
-
-
- );
+ it('should render IdvSubmitComplete component with mismatch_status ', () => {
+ const new_store = mockStore({
+ client: {
+ account_status: {
+ authentication: {
+ attempts: {
+ count: 2,
+ history: [{ status: 'pending' }],
+ },
+ },
+ },
+ },
+ });
- commonRenderCheck();
- expect(screen.getByText("Next, we'll need your proof of address.")).toBeInTheDocument();
- expect(screen.queryByText('Submit proof of address')).not.toBeInTheDocument();
+ const new_props: TIdvSubmitCompleteProps = {
+ ...mock_props,
+ mismatch_status: idv_error_statuses.poi_name_dob_mismatch,
+ };
+ renderComponent({ props: new_props, store_config: new_store });
+
+ expect(screen.getByText('IdvDocumentPending')).toBeInTheDocument();
+ expect(screen.getByText('Your profile is updated')).toBeInTheDocument();
+ expect(
+ screen.getByText(
+ "We'll review your proof of identity again and will give you an update as soon as possible."
+ )
+ ).toBeInTheDocument();
+ expect(
+ screen.queryByText('We’ll review your documents and notify you of its status within 5 minutes.')
+ ).not.toBeInTheDocument();
+ expect(screen.queryByText('Your documents were submitted successfully')).not.toBeInTheDocument();
+ expect(screen.queryByText('Your document has been submitted')).not.toBeInTheDocument();
+ expect(screen.queryByText("Next, we'll need your proof of address.")).not.toBeInTheDocument();
+ });
+
+ it('should render IdvSubmitComplete component with mismatch_status', () => {
+ const new_store = mockStore({
+ client: {
+ account_status: {
+ authentication: {
+ attempts: {
+ count: 2,
+ history: [{ status: 'pending' }],
+ },
+ },
+ },
+ },
+ });
+
+ const new_props: TIdvSubmitCompleteProps = {
+ ...mock_props,
+ mismatch_status: idv_error_statuses.poi_expired,
+ };
+ renderComponent({ props: new_props, store_config: new_store });
+
+ expect(screen.getByText('IdvDocumentPending')).toBeInTheDocument();
+ expect(screen.getByText('Your document has been submitted')).toBeInTheDocument();
+ expect(
+ screen.getByText(
+ "We'll review your proof of identity again and will give you an update as soon as possible."
+ )
+ ).toBeInTheDocument();
+ expect(
+ screen.queryByText('We’ll review your documents and notify you of its status within 5 minutes.')
+ ).not.toBeInTheDocument();
+ expect(screen.queryByText('Your profile is updated')).not.toBeInTheDocument();
+ expect(screen.queryByText('Your documents were submitted successfully')).not.toBeInTheDocument();
+ expect(screen.queryByText("Next, we'll need your proof of address.")).not.toBeInTheDocument();
});
});
diff --git a/packages/account/src/Components/poi/idv-status/idv-submit-complete/idv-submit-complete.tsx b/packages/account/src/Components/poi/idv-status/idv-submit-complete/idv-submit-complete.tsx
index bd0f526e110d..7b66f7720ee1 100644
--- a/packages/account/src/Components/poi/idv-status/idv-submit-complete/idv-submit-complete.tsx
+++ b/packages/account/src/Components/poi/idv-status/idv-submit-complete/idv-submit-complete.tsx
@@ -1,39 +1,81 @@
-import IdvDocumentPending from '../../../../Assets/ic-idv-document-pending.svg';
-import PoaButton from '../../../poa/poa-button/poa-button';
import React from 'react';
import { Text } from '@deriv/components';
-import { localize } from '@deriv/translations';
+import { idv_error_statuses, TIDVErrorStatus } from '@deriv/shared';
+import { observer, useStore } from '@deriv/stores';
+import { Localize } from '@deriv/translations';
+import IdvDocumentPending from 'Assets/ic-idv-document-pending.svg';
+import PoaButton from 'Components/poa/poa-button';
type TIdvSubmitComplete = {
- needs_poa: boolean;
is_from_external: boolean;
- redirect_button: React.ReactElement;
+ mismatch_status: TIDVErrorStatus;
+ needs_poa: boolean;
+ redirect_button: React.ReactNode;
};
-const IdvSubmitComplete = ({ needs_poa, is_from_external, redirect_button }: TIdvSubmitComplete) => {
- const poa_button = !is_from_external && ;
-
- return (
-
-
-
- {localize('Your documents were submitted successfully')}
-
-
- {localize('We’ll review your documents and notify you of its status within 5 minutes.')}
-
- {needs_poa ? (
-
-
- {localize("Next, we'll need your proof of address.")}
-
- {poa_button}
-
- ) : (
-
{redirect_button}
- )}
-
+
+
+ {getHeaderText()}
+
+
+ {getDescriptionText()}
+
+ {needs_poa ? (
+
+
+
+
+ {poa_button}
+
+ ) : (
+
{redirect_button}
+ )}
+
@@ -26,13 +29,15 @@ const IdvVerified = ({ needs_poa, is_from_external, redirect_button }: Partial
{!isMobile() && (
- {localize("Next, we'll need your proof of address.")}
+
)}
- {!is_from_external && }
+ {!is_from_external && (
+ } />
+ )}
) : (
- redirect_button
+ redirect_button ||
)}