Revert "Farzin/Hamid/wall 250/withdraw hooks (#8489)" (#8745)

This reverts commit c96c51f.

packages/cashier/src/components/cashier-locked/__tests__/cashier-locked.spec.tsx

@@ -1,25 +1,22 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import CashierLocked from '../cashier-locked';
-import { useCashierLocked, useDepositLocked, useWithdrawLocked } from '@deriv/hooks';
+import { useCashierLocked, useDepositLocked } from '@deriv/hooks';
 import { mockStore } from '@deriv/stores';
 import CashierProviders from '../../../cashier-providers';
 
 jest.mock('@deriv/hooks', () => ({
     ...jest.requireActual('@deriv/hooks'),
     useDepositLocked: jest.fn(() => false),
     useCashierLocked: jest.fn(() => false),
-    useWithdrawLocked: jest.fn(() => false),
 }));
 const mockUseDepositLocked = useDepositLocked as jest.MockedFunction<typeof useDepositLocked>;
 const mockUseCashierLocked = useCashierLocked as jest.MockedFunction<typeof useCashierLocked>;
-const mockUseWithdrawLocked = useWithdrawLocked as jest.MockedFunction<typeof useWithdrawLocked>;
 
 describe('<CashierLocked />', () => {
     beforeEach(() => {
         mockUseDepositLocked.mockReturnValue(false);
         mockUseCashierLocked.mockReturnValue(false);
-        mockUseWithdrawLocked.mockReturnValue(false);
     });
 
     it('should show the proper message if there is a crypto cashier maintenance', () => {
@@ -48,11 +45,11 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show the proper message if crypto withdrawal is suspended', () => {
-        (useWithdrawLocked as jest.Mock).mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['system_maintenance'] },
                 current_currency_type: 'crypto',
+                is_withdrawal_lock: true,
                 mt5_login_list: [
                     {
                         account_type: 'demo',
@@ -74,7 +71,6 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show the proper message if crypto deposit is suspended', () => {
-        (useDepositLocked as jest.Mock).mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['system_maintenance'] },
@@ -418,8 +414,7 @@ describe('<CashierLocked />', () => {
         ).toBeInTheDocument();
     });
 
-    it('should show the proper message if the client has self-excluded from the website', () => {
-        (useDepositLocked as jest.Mock).mockReturnValue(true);
+    it('should show the proper message if the client has self-exluded from the website', () => {
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['SelfExclusion'] },
@@ -446,7 +441,6 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show the proper message if the client has unwelcome_status', () => {
-        (useDepositLocked as jest.Mock).mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['unwelcome_status'] },
@@ -469,11 +463,11 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show the proper message if the client has no_withdrawal_or_trading_status', () => {
-        useWithdrawLocked.mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['no_withdrawal_or_trading_status'] },
                 current_currency_type: 'fiat',
+                is_withdrawal_lock: true,
                 mt5_login_list: [
                     {
                         account_type: 'demo',
@@ -493,12 +487,11 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show the proper message if the client has withdrawal_locked_status', () => {
-        (useDepositLocked as jest.Mock).mockReturnValue(false);
-        (useWithdrawLocked as jest.Mock).mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['withdrawal_locked_status'] },
                 current_currency_type: 'fiat',
+                is_withdrawal_lock: true,
                 mt5_login_list: [
                     {
                         account_type: 'demo',
@@ -518,12 +511,11 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show the proper message if the client has only_pa_withdrawals_allowed_status', () => {
-        (useDepositLocked as jest.Mock).mockReturnValue(false);
-        (useWithdrawLocked as jest.Mock).mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['only_pa_withdrawals_allowed_status'] },
                 current_currency_type: 'fiat',
+                is_withdrawal_lock: true,
                 mt5_login_list: [
                     {
                         account_type: 'demo',
@@ -565,7 +557,6 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show cashier locked message if the client has a combo of deposit and withdrawal locked reasons', () => {
-        (useDepositLocked as jest.Mock).mockReturnValue(false);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['no_withdrawal_or_trading_status', 'unwelcome_status'] },
@@ -590,12 +581,11 @@ describe('<CashierLocked />', () => {
     });
 
     it('should show the proper message if the client has PACommisionWithdrawalLimit', () => {
-        (useDepositLocked as jest.Mock).mockReturnValue(false);
-        (useWithdrawLocked as jest.Mock).mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['PACommisionWithdrawalLimit'] },
                 current_currency_type: 'fiat',
+                is_withdrawal_lock: true,
                 mt5_login_list: [
                     {
                         account_type: 'demo',

packages/cashier/src/components/cashier-locked/cashier-locked.tsx

@@ -1,19 +1,25 @@
 import React from 'react';
 import { useStore, observer } from '@deriv/stores';
-import { useCashierLocked, useDepositLocked, useIsSystemMaintenance, useWithdrawLocked } from '@deriv/hooks';
+import { useCashierLocked, useDepositLocked, useIsSystemMaintenance } from '@deriv/hooks';
 import EmptyState from 'Components/empty-state';
 import getMessage from './cashier-locked-provider';
 
 const CashierLocked = observer(() => {
     const { client } = useStore();
-    const { account_status, accounts, current_currency_type, loginid, is_identity_verification_needed } = client;
+    const {
+        account_status,
+        accounts,
+        current_currency_type,
+        is_withdrawal_lock: is_withdrawal_locked,
+        loginid,
+        is_identity_verification_needed,
+    } = client;
     const is_cashier_locked = useCashierLocked();
     const is_system_maintenance = useIsSystemMaintenance();
     const is_deposit_locked = useDepositLocked();
-    const is_withdrawal_locked = useWithdrawLocked();
 
     const state = getMessage({
-        cashier_validation: account_status?.cashier_validation,
+        cashier_validation: account_status.cashier_validation,
         is_crypto: current_currency_type === 'crypto',
         is_system_maintenance,
         is_cashier_locked,

packages/cashier/src/pages/withdrawal/__tests__/withdrawal.spec.tsx

@@ -6,9 +6,8 @@ import { isDesktop } from '@deriv/shared';
 import Withdrawal from '../withdrawal';
 import CashierProviders from '../../../cashier-providers';
 import { mockStore } from '@deriv/stores';
-import { useCashierLocked, useWithdrawLocked } from '@deriv/hooks';
+import { useCashierLocked } from '@deriv/hooks';
 
-jest.mock('@deriv/hooks');
 jest.mock('Components/cashier-locked', () => jest.fn(() => 'CashierLocked'));
 jest.mock('Components/cashier-container/virtual', () => jest.fn(() => 'Virtual'));
 jest.mock('../withdrawal-locked', () => jest.fn(() => 'WithdrawalLocked'));
@@ -31,10 +30,8 @@ jest.mock('@deriv/shared/src/utils/screen/responsive', () => ({
 jest.mock('@deriv/hooks', () => ({
     ...jest.requireActual('@deriv/hooks'),
     useCashierLocked: jest.fn(() => false),
-    useWithdrawLocked: jest.fn(() => false),
 }));
 const mockUseCashierLocked = useCashierLocked as jest.MockedFunction<typeof useCashierLocked>;
-const mockUseWithdrawLocked = useWithdrawLocked as jest.MockedFunction<typeof useWithdrawLocked>;
 
 const cashier_mock = {
     general_store: {
@@ -69,7 +66,6 @@ describe('<Withdrawal />', () => {
     beforeEach(() => {
         setSideNotes = jest.fn();
         mockUseCashierLocked.mockReturnValue(false);
-        mockUseWithdrawLocked.mockReturnValue(false);
     });
 
     const mockWithdrawal = (mock_root_store: ReturnType<typeof mockStore>, is_rerender = false) => {
@@ -83,7 +79,6 @@ describe('<Withdrawal />', () => {
     };
 
     it('should render <CashierLocked /> component', () => {
-        mockUseWithdrawLocked.mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 account_status: { cashier_validation: ['system_maintenance'] },
@@ -156,7 +151,6 @@ describe('<Withdrawal />', () => {
     });
 
     it('should render <WithdrawalLocked /> component', () => {
-        mockUseWithdrawLocked.mockReturnValue(true);
         const mock_root_store = mockStore({
             client: {
                 balance: '1000',

packages/cashier/src/pages/withdrawal/crypto-withdraw-form/__tests__/crypto-withdraw-form.spec.tsx

@@ -1,15 +1,11 @@
 import React from 'react';
 import { act } from 'react-dom/test-utils';
 import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { useCurrentAccountDetails } from '@deriv/hooks';
 import CryptoWithdrawForm from '../crypto-withdraw-form';
 import CashierProviders from '../../../../cashier-providers';
 import { mockStore } from '@deriv/stores';
 
-jest.mock('@deriv/hooks');
-
 describe('<CryptoWithdrawForm />', () => {
-    (useCurrentAccountDetails as jest.Mock).mockReturnValue({ icon: 'icon' });
     let mockRootStore: ReturnType<typeof mockStore>;
     beforeEach(() => {
         mockRootStore = mockStore({
@@ -31,6 +27,7 @@ describe('<CryptoWithdrawForm />', () => {
                         onMount: jest.fn(),
                     },
                     withdraw: {
+                        account_platform_icon: 'icon',
                         blockchain_address: 'tb1ql7w62elx9ucw4pj5lgw4l028hmuw80sndtntxt',
                         onMountCryptoWithdraw: jest.fn(),
                         requestWithdraw: jest.fn(),

packages/cashier/src/pages/withdrawal/crypto-withdraw-form/crypto-withdraw-form.tsx

@@ -3,7 +3,6 @@ import React from 'react';
 import { Field, FieldProps, Formik, FormikProps } from 'formik';
 import { Button, Icon, Input, Loading, MobileWrapper, Text } from '@deriv/components';
 import { CryptoConfig, getCurrencyName, isCryptocurrency, isMobile } from '@deriv/shared';
-import { useCurrentAccountDetails } from '@deriv/hooks';
 import { localize, Localize } from '@deriv/translations';
 import { useStore, observer } from '@deriv/stores';
 import CryptoFiatConverter from '../../../components/crypto-fiat-converter';
@@ -59,6 +58,7 @@ const CryptoWithdrawForm = observer(() => {
     const { crypto_fiat_converter, general_store, transaction_history, withdraw } = useCashierStore();
     const crypto_currency = currency;
     const {
+        account_platform_icon,
         blockchain_address,
         onMountCryptoWithdraw: onMountWithdraw,
         requestWithdraw,
@@ -77,7 +77,6 @@ const CryptoWithdrawForm = observer(() => {
     } = crypto_fiat_converter;
     const { is_loading, percentage, percentageSelectorSelectionStatus, should_percentage_reset } = general_store;
     const { crypto_transactions, onMount: recentTransactionOnMount } = transaction_history;
-    const account_details = useCurrentAccountDetails();
 
     React.useEffect(() => {
         recentTransactionOnMount();
@@ -109,7 +108,7 @@ const CryptoWithdrawForm = observer(() => {
         <div className='cashier__wrapper' data-testid='dt_crypto_withdraw_form'>
             {!isMobile() && <Header currency={currency} />}
             <div className={classNames({ 'crypto-withdraw-form__icon': isMobile() })}>
-                <Icon icon={`IcCurrency-${account_details?.icon?.toLowerCase()}`} size={isMobile() ? 64 : 128} />
+                <Icon icon={`IcCurrency-${account_platform_icon?.toLowerCase()}`} size={isMobile() ? 64 : 128} />
             </div>
             {isMobile() && <Header currency={currency} />}
             <Formik

packages/cashier/src/pages/withdrawal/withdrawal.tsx

@@ -3,7 +3,6 @@ import { Loading } from '@deriv/components';
 import { Localize } from '@deriv/translations';
 import { isCryptocurrency, isDesktop } from '@deriv/shared';
 import { useStore, observer } from '@deriv/stores';
-import { useWithdrawLocked, useCashierLocked, useIsSystemMaintenance } from '@deriv/hooks';
 import CryptoTransactionsHistory from '../../components/crypto-transactions-history';
 import CryptoWithdrawForm from './crypto-withdraw-form';
 import CryptoWithdrawReceipt from './crypto-withdraw-receipt';
@@ -18,6 +17,7 @@ import SideNote from '../../components/side-note';
 import USDTSideNote from '../../components/usdt-side-note';
 import { Virtual } from '../../components/cashier-container';
 import { useCashierStore } from '../../stores/useCashierStores';
+import { useCashierLocked, useIsSystemMaintenance } from '@deriv/hooks';
 
 type TWithdrawalSideNoteProps = {
     currency: string;
@@ -75,10 +75,10 @@ const Withdrawal = observer(({ setSideNotes }: TWithdrawalProps) => {
         error,
         is_10k_withdrawal_limit_reached,
         is_withdraw_confirmed,
+        is_withdrawal_locked,
         error: { setErrorMessage },
         willMountWithdraw,
     } = withdraw;
-    const is_withdrawal_locked = useWithdrawLocked();
 
     React.useEffect(() => {
         if (!is_crypto_transactions_visible) {

packages/cashier/src/stores/__tests__/withdraw-store.spec.ts

@@ -234,6 +234,28 @@ describe('WithdrawStore', () => {
         expect(setLoading).toHaveBeenCalledWith(false);
     });
 
+    it('should return is_withdrawal_locked equal to false if there is no account status', () => {
+        withdraw_store.root_store.client.account_status = {
+            currency_config: {},
+            prompt_client_to_authenticate: 0,
+            risk_classification: '',
+            status: [],
+            p2p_status: 'none',
+        };
+        expect(withdraw_store.is_withdrawal_locked).toBeFalsy();
+    });
+
+    it('should return is_withdrawal_locked equal to true if client needs POI verification', () => {
+        withdraw_store.root_store.client.account_status.status = ['authentication_needed'];
+        withdraw_store.error.is_ask_authentication = true;
+        expect(withdraw_store.is_withdrawal_locked).toBeTruthy();
+    });
+
+    it('should return is_withdrawal_locked equal to true if client needs financial risk approval', () => {
+        withdraw_store.error.is_ask_financial_risk_approval = true;
+        expect(withdraw_store.is_withdrawal_locked).toBeTruthy();
+    });
+
     it('should set max_withdraw_amount', () => {
         withdraw_store.setMaxWithdrawAmount(100);
         expect(withdraw_store.max_withdraw_amount).toBe(100);
@@ -306,4 +328,8 @@ describe('WithdrawStore', () => {
         withdraw_store.validateWithdrawToAmount();
         expect(setConverterToError).toHaveBeenCalledWith(error_message);
     });
+
+    it('should get account_platform_icon', () => {
+        expect(withdraw_store.account_platform_icon).toBe('icon');
+    });
 });

packages/cashier/src/stores/withdraw-store.ts

@@ -26,13 +26,15 @@ export default class WithdrawStore {
             setBlockchainAddress: action.bound,
             onMountWithdraw: action.bound,
             onMountCryptoWithdraw: action.bound,
+            is_withdrawal_locked: computed,
             setMaxWithdrawAmount: action.bound,
             check10kLimit: action.bound,
             set10kLimitation: action.bound,
             setCryptoConfig: action.bound,
             setWithdrawPercentageSelectorResult: action.bound,
             validateWithdrawFromAmount: action.bound,
             validateWithdrawToAmount: action.bound,
+            account_platform_icon: computed,
         });
 
         this.root_store = root_store;
@@ -267,6 +269,17 @@ export default class WithdrawStore {
         this.crypto_config = (await this.WS.cryptoConfig())?.crypto_config;
     }
 
+    get is_withdrawal_locked() {
+        const { client } = this.root_store;
+        const { authentication } = client.account_status;
+
+        if (!client.account_status?.status) return false;
+        const need_poi = authentication?.needs_verification.includes('identity');
+        const need_authentication = this.error.is_ask_authentication && need_poi;
+
+        return client.is_withdrawal_lock || need_authentication || this.error.is_ask_financial_risk_approval;
+    }
+
     setMaxWithdrawAmount(amount: number) {
         this.max_withdraw_amount = amount;
     }
@@ -371,4 +384,11 @@ export default class WithdrawStore {
 
         setConverterToError(error_message);
     }
+
+    get account_platform_icon() {
+        const { account_list, loginid } = this.root_store.client;
+        const platform_icon = account_list.find(acc => loginid === acc.loginid)?.icon;
+
+        return platform_icon;
+    }
 }

packages/core/src/Stores/client-store.js

@@ -735,7 +735,6 @@ export default class ClientStore extends BaseStore {
         return this.account_status?.status?.some(status_name => status_name === 'deposit_locked');
     }
 
-    // @deprecated use `useWithdrawLock` hook from `@deriv/hooks` instead
     get is_withdrawal_lock() {
         return this.account_status?.status?.some(status_name => status_name === 'withdrawal_locked');
     }