Merge pull request #63 from shaheer-deriv/shaheer/WALL-1625

feat: 💡 adds svg migration hint text in cashier transfer screen
suisin-deriv · Sep 4, 2023 · ff68ce3 · ff68ce3
2 parents 11652dd + 866b4d4
commit ff68ce3
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 10 deletions.
diff --git a/...src/pages/account-transfer/account-transfer-form/__tests__/account-transfer-form.spec.tsx b/...src/pages/account-transfer/account-transfer-form/__tests__/account-transfer-form.spec.tsx
@@ -279,6 +279,33 @@ describe('<AccountTransferForm />', () => {
         expect(screen.getByText('You have 1 transfer remaining for today.')).toBeInTheDocument();
     });
 
+    it('should show proper hint when transferring amount to a migrated svg account', () => {
+        mockRootStore.client.account_limits = {
+            daily_transfers: {
+                dxtrade: {},
+                internal: {
+                    available: 1,
+                },
+                mt5: {},
+            },
+        };
+        mockRootStore.client.mt5_login_list = [
+            {
+                account_type: 'real',
+                balance: 1233,
+                currency: 'USD',
+                display_balance: '1233.00',
+                login: 'TEST_LOGIN_ID',
+                open_order_position_status: true,
+            },
+        ];
+        mockRootStore.modules.cashier.account_transfer.selected_to.value = 'TEST_LOGIN_ID';
+
+        renderAccountTransferForm();
+
+        expect(screen.getByText('You can no longer open new positions with this account.')).toBeInTheDocument();
+    });
+
     describe('<Dropdown />', () => {
         const accountsList = [
             {

diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx
@@ -83,7 +83,13 @@ const AccountTransferForm = observer(
             common: { is_from_derivgo },
         } = useStore();
 
-        const { account_limits, authentication_status, is_dxtrade_allowed, getLimits: onMount } = client;
+        const {
+            account_limits,
+            authentication_status,
+            is_dxtrade_allowed,
+            getLimits: onMount,
+            mt5_login_list,
+        } = client;
         const { account_transfer, crypto_fiat_converter, general_store } = useCashierStore();
 
         const {
@@ -117,7 +123,7 @@ const AccountTransferForm = observer(
 
         const [from_accounts, setFromAccounts] = React.useState({});
         const [to_accounts, setToAccounts] = React.useState({});
-        const [transfer_to_hint, setTransferToHint] = React.useState<string>();
+        const [transfer_to_hint, setTransferToHint] = React.useState<JSX.Element>();
 
         const is_from_outside_cashier = !location.pathname.startsWith(routes.cashier);
 
@@ -313,15 +319,23 @@ const AccountTransferForm = observer(
                 return internal_remaining_transfers?.available;
             };
 
-            remaining_transfers = getRemainingTransfers();
-
-            const hint =
-                remaining_transfers && Number(remaining_transfers) === 1
-                    ? localize('You have {{number}} transfer remaining for today.', { number: remaining_transfers })
-                    : localize('You have {{number}} transfers remaining for today.', { number: remaining_transfers });
-            setTransferToHint(hint);
+            let hint_text;
+            // flag 'open_order_position_status' does not exist in mt5_login_list, @deriv/api-types yet
+            if (mt5_login_list.find(account => account?.login === selected_to.value)?.open_order_position_status) {
+                hint_text = <Localize i18n_default_text='You can no longer open new positions with this account.' />;
+            } else {
+                remaining_transfers = getRemainingTransfers() ?? 0;
+                const transfer_text = Number(remaining_transfers) > 1 ? 'transfers' : 'transfer';
+                hint_text = (
+                    <Localize
+                        i18n_default_text='You have {{remaining_transfers}} {{transfer_text}} remaining for today.'
+                        values={{ remaining_transfers, transfer_text }}
+                    />
+                );
+            }
+            setTransferToHint(hint_text);
             resetConverter();
-        }, [selected_to, selected_from, account_limits]); // eslint-disable-line react-hooks/exhaustive-deps
+        }, [account_limits, selected_from, selected_to, mt5_login_list]); // eslint-disable-line react-hooks/exhaustive-deps
 
         const is_mt5_restricted =
             selected_from?.is_mt &&