From 4ed95046d37e15c790a0c07158d9c15e8139ac47 Mon Sep 17 00:00:00 2001
From: Thisyahlen Nair <thisyahlen@regentmarkets.com>
Date: Fri, 25 Aug 2023 11:05:36 +0800
Subject: [PATCH 1/8] chore: add useAvailableWallets in deriv/api

---
 packages/api/src/hooks/index.ts               |  1 +
 packages/api/src/hooks/useAvailableWallets.ts | 78 ++++++++++++++++++
 packages/api/types.ts                         | 79 +++++++++++++++++++
 3 files changed, 158 insertions(+)
 create mode 100644 packages/api/src/hooks/useAvailableWallets.ts

diff --git a/packages/api/src/hooks/index.ts b/packages/api/src/hooks/index.ts
index 6795a3ac3953..291deb8af667 100644
--- a/packages/api/src/hooks/index.ts
+++ b/packages/api/src/hooks/index.ts
@@ -6,3 +6,4 @@ export { default as useCurrencyConfig } from './useCurrencyConfig';
 export { default as useMT5LoginList } from './useMT5LoginList';
 export { default as useTradingPlatformAccounts } from './useTradingPlatformAccounts';
 export { default as useWalletAccountsList } from './useWalletAccountsList';
+export { default as useAvailableWallets } from './useAvailableWallets';
diff --git a/packages/api/src/hooks/useAvailableWallets.ts b/packages/api/src/hooks/useAvailableWallets.ts
new file mode 100644
index 000000000000..5481c56252bd
--- /dev/null
+++ b/packages/api/src/hooks/useAvailableWallets.ts
@@ -0,0 +1,78 @@
+import React from 'react';
+import useFetch from '../useFetch';
+import useWalletAccountsList from './useWalletAccountsList';
+import useAuthorize from './useAuthorize';
+import useCurrencyConfig from './useCurrencyConfig';
+
+const useAvailableWallets = () => {
+    const { data } = useAuthorize();
+    const { data: account_type_data, ...rest } = useFetch('get_account_types', {
+        payload: {
+            // This is temporary fix, will be changed by BE
+            company: data?.landing_company_name === 'virtual' ? 'svg' : data?.landing_company_name,
+        },
+        options: { enabled: Boolean(data?.landing_company_name) },
+    });
+
+    const { data: added_wallets } = useWalletAccountsList();
+    const { getConfig } = useCurrencyConfig();
+
+    const sortedWallets = React.useMemo(() => {
+        if (!account_type_data) return undefined;
+        const { crypto, doughflow } = account_type_data?.get_account_types?.wallet || {};
+        const crypto_currencies = crypto?.currencies;
+        const fiat_currencies = doughflow?.currencies;
+
+        if (!crypto_currencies || !fiat_currencies) return undefined;
+        const available_currencies = [...fiat_currencies, ...crypto_currencies];
+        const non_virtual_wallets = added_wallets?.filter(wallet => !wallet.is_virtual);
+
+        const modified_wallets = non_virtual_wallets?.map(wallet => ({
+            currency: wallet.currency,
+            landing_company_name: wallet.landing_company_name,
+            is_added: true,
+        }));
+
+        const available_wallets = available_currencies
+            .filter(currency => !modified_wallets?.some(wallet => wallet.currency === currency))
+            .map(currency => ({
+                currency,
+                // This will also be changed by BE
+                landing_company_name: data?.landing_company_name === 'virtual' ? 'svg' : data?.landing_company_name,
+                is_added: false,
+            }));
+
+        const getConfigIsCrypto = (currency: string) => getConfig(currency)?.is_crypto;
+
+        // Sort the unadded wallets alphabetically by fiat, crypto, then virtual
+        available_wallets.sort((a, b) => {
+            const a_config = getConfigIsCrypto(a.currency);
+            const b_config = getConfigIsCrypto(b.currency);
+
+            if (a_config !== b_config) return a.currency ? 1 : -1;
+
+            return (a.currency || 'USD').localeCompare(b.currency || 'USD');
+        });
+
+        // Sort the added wallets alphabetically by fiat, crypto, then virtual (if any)
+        if (Array.isArray(modified_wallets)) {
+            modified_wallets?.sort((a, b) => {
+                const a_config = getConfigIsCrypto(a.currency || 'BTC');
+                const b_config = getConfigIsCrypto(b.currency || 'BTC');
+                if (a_config !== b_config) return a_config ? 1 : -1;
+
+                return (a.currency || 'USD').localeCompare(b.currency || 'USD');
+            });
+        }
+
+        return [...available_wallets];
+    }, [added_wallets, account_type_data, data?.landing_company_name, getConfig]);
+
+    return {
+        ...rest,
+        /** Sorted available wallets */
+        data: sortedWallets,
+    };
+};
+
+export default useAvailableWallets;
diff --git a/packages/api/types.ts b/packages/api/types.ts
index 6d3beef337e9..32b6b5354032 100644
--- a/packages/api/types.ts
+++ b/packages/api/types.ts
@@ -229,6 +229,85 @@ import type {
 import type { useMutation, useQuery } from '@tanstack/react-query';
 
 type TPrivateSocketEndpoints = {
+    get_account_types: {
+        request: {
+            /**
+             * Must be `1`
+             */
+            get_account_types: 1;
+            /**
+             * [Optional] Set to landing company to get relevant account types. If not set, this defaults to current account landing company
+             */
+            company?: string;
+            /**
+             * [Optional] Used to pass data through the websocket, which may be retrieved via the `echo_req` output field. Maximum size is 3500 bytes.
+             */
+            passthrough?: {
+                [k: string]: unknown;
+            };
+            /**
+             * [Optional] Used to map request to response.
+             */
+            req_id?: number;
+        };
+        response: {
+            /**
+             * Returns accounts that are available to create or link to
+             * */
+            get_account_types: {
+                /**
+                 * Trading account types that are available to create or link to
+                 */
+                trading: {
+                    /**
+                     * Details for trading account types
+                     */
+                    [k: string]: {
+                        /**
+                         * Wallet currencies allowed for this trading account
+                         */
+                        allowed_wallet_currencies: string[];
+                        /**
+                         * Can this trading account linked to another currency after opening
+                         */
+                        linkable_to_different_currency: 0 | 1;
+                        /**
+                         * Wallet types that this trading account can be linked to.
+                         */
+                        linkable_wallet_types: string[];
+                    };
+                };
+                /**
+                 * Wallet accounts types that are available to create or link to
+                 * */
+                wallet: {
+                    /**
+                     * Details for wallets account types
+                     */
+                    [k: string]: {
+                        /**
+                         * Allowed currencies for creating accounts of this type; used or disallowed currencies are not listed.
+                         */
+                        currencies: string[];
+                    };
+                };
+                /**
+                 * Echo of the request made.
+                 * */
+                echo_req: {
+                    [k: string]: unknown;
+                };
+                /**
+                 * Action name of the request made.
+                 * */
+                msg_type: 'get_account_types';
+                /**
+                 * Optional field sent in request to map to response, present only when request contains `req_id`.
+                 * */
+                req_id?: number;
+            };
+        };
+    };
     trading_platform_accounts: {
         request: {
             /**

From 85d7ed7d242211107799eac082831f84e26e32d5 Mon Sep 17 00:00:00 2001
From: Thisyahlen Nair <thisyahlen@regentmarkets.com>
Date: Tue, 29 Aug 2023 10:40:28 +0800
Subject: [PATCH 2/8] fix: empty


From 3ff0646fad62862f7fc175b2106d1c933760c6cd Mon Sep 17 00:00:00 2001
From: Farzin Mirzaie <farzin@deriv.com>
Date: Tue, 29 Aug 2023 16:59:50 +0800
Subject: [PATCH 3/8] refactor(api): :recycle: clean-up

---
 packages/api/src/hooks/index.ts               |  4 +-
 packages/api/src/hooks/useAccountTypes.ts     | 12 ++---
 .../api/src/hooks/useAllAvailableAccounts.ts  | 24 ++++++++++
 .../api/src/hooks/useAvailableAccounts.ts     | 47 -------------------
 packages/api/src/hooks/useCurrencyConfig.ts   |  2 +-
 packages/api/src/hooks/useGetAccountStatus.ts |  6 +--
 packages/api/src/hooks/useLandingCompany.ts   | 17 +++----
 packages/api/src/hooks/useSettings.ts         | 16 +++----
 8 files changed, 50 insertions(+), 78 deletions(-)
 create mode 100644 packages/api/src/hooks/useAllAvailableAccounts.ts
 delete mode 100644 packages/api/src/hooks/useAvailableAccounts.ts

diff --git a/packages/api/src/hooks/index.ts b/packages/api/src/hooks/index.ts
index a24c15779d19..b9a906787650 100644
--- a/packages/api/src/hooks/index.ts
+++ b/packages/api/src/hooks/index.ts
@@ -2,8 +2,8 @@ export { default as useAccountsList } from './useAccountsList';
 export { default as useActiveAccount } from './useActiveAccount';
 export { default as useActiveTradingAccount } from './useActiveTradingAccount';
 export { default as useActiveWalletAccount } from './useActiveWalletAccount';
+export { default as useAllAvailableAccounts } from './useAllAvailableAccounts';
 export { default as useAuthorize } from './useAuthorize';
-export { default as useAvailableAccounts } from './useAvailableAccounts';
 export { default as useBalance } from './useBalance';
 export { default as useCurrencyConfig } from './useCurrencyConfig';
 export { default as useGetAccountStatus } from './useGetAccountStatus';
@@ -12,5 +12,5 @@ export { default as useMT5LoginList } from './useMT5LoginList';
 export { default as useSettings } from './useSettings';
 export { default as useTradingAccountsList } from './useTradingAccountsList';
 export { default as useTradingPlatformAccounts } from './useTradingPlatformAccounts';
-export { default as useWalletAccountsList } from './useWalletAccountsList';
 export { default as useTradingPlatformAvailableAccounts } from './useTradingPlatformAvailableAccounts';
+export { default as useWalletAccountsList } from './useWalletAccountsList';
diff --git a/packages/api/src/hooks/useAccountTypes.ts b/packages/api/src/hooks/useAccountTypes.ts
index e39f960c196a..aa0fb603e690 100644
--- a/packages/api/src/hooks/useAccountTypes.ts
+++ b/packages/api/src/hooks/useAccountTypes.ts
@@ -2,20 +2,19 @@ import { useMemo } from 'react';
 import useFetch from '../useFetch';
 
 /**
- * A custom hook to get available account types for a specific landing company
- *
- *  @param landing_company {string} - The landing company shortcode
+ * A custom hook to get available account types for a specific landing company.
  */
 const useAccountTypes = (landing_company?: string) => {
     const { data, ...rest } = useFetch('get_account_types', {
         payload: { company: landing_company },
+        options: { enabled: Boolean(landing_company) },
     });
 
-    const modified_data = useMemo(() => {
+    // Add additional information to the account types response.
+    const modified_account_types = useMemo(() => {
         if (!data?.get_account_types) return;
 
         return {
-            /** List of available account types */
             ...data.get_account_types,
             /** Landing company for the account types */
             landing_company,
@@ -23,7 +22,8 @@ const useAccountTypes = (landing_company?: string) => {
     }, [data?.get_account_types, landing_company]);
 
     return {
-        data: modified_data,
+        /** The account types response. */
+        data: modified_account_types,
         ...rest,
     };
 };
diff --git a/packages/api/src/hooks/useAllAvailableAccounts.ts b/packages/api/src/hooks/useAllAvailableAccounts.ts
new file mode 100644
index 000000000000..56cc45b69e5b
--- /dev/null
+++ b/packages/api/src/hooks/useAllAvailableAccounts.ts
@@ -0,0 +1,24 @@
+import { useMemo } from 'react';
+import useAccountTypes from './useAccountTypes';
+import useLandingCompany from './useLandingCompany';
+
+/** A custom hook to get all available accounts that user can have. */
+const useAllAvailableAccounts = () => {
+    const { data: landing_company_data } = useLandingCompany();
+    const { data: account_types_data, ...rest } = useAccountTypes(landing_company_data?.financial_company?.shortcode);
+
+    // Add additional information to the account types response.
+    const modified_account_types_data = useMemo(() => {
+        if (!account_types_data) return;
+
+        return { ...account_types_data };
+    }, [account_types_data]);
+
+    return {
+        /** The account types response. */
+        data: modified_account_types_data,
+        ...rest,
+    };
+};
+
+export default useAllAvailableAccounts;
diff --git a/packages/api/src/hooks/useAvailableAccounts.ts b/packages/api/src/hooks/useAvailableAccounts.ts
deleted file mode 100644
index d5ee1bfef14d..000000000000
--- a/packages/api/src/hooks/useAvailableAccounts.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import { useMemo } from 'react';
-import useAccountTypes from './useAccountTypes';
-import useLandingCompany from './useLandingCompany';
-
-/** A custom hook to get available accounts for every landing companies */
-const useAvailableAccounts = () => {
-    const { data: landing_company_data } = useLandingCompany();
-    const { data: available_financial_accounts } = useAccountTypes(landing_company_data?.financial_company_shortcode);
-    const { data: available_virtual_accounts } = useAccountTypes(landing_company_data?.virtual_company_shortcode);
-
-    // memoize the available financial accounts
-    const financial_accounts = useMemo(() => {
-        if (!available_financial_accounts) return;
-
-        return {
-            ...available_financial_accounts,
-        };
-    }, [available_financial_accounts]);
-
-    // memoize the available virtual accounts
-    const virtual_accounts = useMemo(() => {
-        if (!available_virtual_accounts) return;
-
-        return {
-            ...available_virtual_accounts,
-        };
-    }, [available_virtual_accounts]);
-
-    // memoize the combined available accounts
-    const available_accounts = useMemo(() => {
-        if (!available_financial_accounts && !available_virtual_accounts) return;
-
-        return {
-            /** List of available financial accounts */
-            financial_accounts,
-            /** List of available virtual accounts */
-            virtual_accounts,
-        };
-    }, [available_financial_accounts, available_virtual_accounts]);
-
-    return {
-        /** List of available accounts */
-        data: available_accounts,
-    };
-};
-
-export default useAvailableAccounts;
diff --git a/packages/api/src/hooks/useCurrencyConfig.ts b/packages/api/src/hooks/useCurrencyConfig.ts
index f97ecb11fec8..ab5b0922eaaa 100644
--- a/packages/api/src/hooks/useCurrencyConfig.ts
+++ b/packages/api/src/hooks/useCurrencyConfig.ts
@@ -1,7 +1,7 @@
 import { useCallback, useMemo } from 'react';
 import useFetch from '../useFetch';
 
-/** A custom hook to get the currency config information from `website_status` endpoint and `crypto_config` endpoint */
+/** A custom hook to get the currency config information from `website_status` endpoint and `crypto_config` endpoint. */
 const useCurrencyConfig = () => {
     const { data: website_status_data, ...rest } = useFetch('website_status');
     const { data: crypto_config_data } = useFetch('crypto_config');
diff --git a/packages/api/src/hooks/useGetAccountStatus.ts b/packages/api/src/hooks/useGetAccountStatus.ts
index 4af2eb55e148..e4adc73345bb 100644
--- a/packages/api/src/hooks/useGetAccountStatus.ts
+++ b/packages/api/src/hooks/useGetAccountStatus.ts
@@ -1,11 +1,11 @@
 import { useMemo } from 'react';
 import useFetch from '../useFetch';
 
-/** A hook that retrieves the account status   */
+/** A custom hook to retrieves the account status for the current user. */
 const useGetAccountStatus = () => {
     const { data: get_account_status_data, ...rest } = useFetch('get_account_status');
 
-    // Add additional information to the authorize response.
+    // Add additional information to the account status response.
     const modified_account_status = useMemo(() => {
         if (!get_account_status_data?.get_account_status) return;
 
@@ -19,7 +19,7 @@ const useGetAccountStatus = () => {
     }, [get_account_status_data?.get_account_status]);
 
     return {
-        /** Account status details. */
+        /** The account status response. */
         data: modified_account_status,
         ...rest,
     };
diff --git a/packages/api/src/hooks/useLandingCompany.ts b/packages/api/src/hooks/useLandingCompany.ts
index 03d1990f21cd..58dbaf4ce198 100644
--- a/packages/api/src/hooks/useLandingCompany.ts
+++ b/packages/api/src/hooks/useLandingCompany.ts
@@ -10,21 +10,16 @@ const useLandingCompany = () => {
         options: { enabled: Boolean(settings_data?.country_code) },
     });
 
-    const modified_data = useMemo(() => {
+    // Add additional information to the landing company response.
+    const modified_landing_company = useMemo(() => {
         if (!data?.landing_company) return;
-        const { financial_company, virtual_company } = data.landing_company;
-        return {
-            ...data.landing_company,
-            /** Short code of financial landing company */
-            financial_company_shortcode: financial_company?.shortcode,
-            /** Short code of virtual landing company */
-            virtual_company_shortcode: virtual_company,
-        };
+
+        return { ...data.landing_company };
     }, [data?.landing_company]);
 
     return {
-        /** List of available landing companies */
-        data: modified_data,
+        /** The landing company response. */
+        data: modified_landing_company,
         ...rest,
     };
 };
diff --git a/packages/api/src/hooks/useSettings.ts b/packages/api/src/hooks/useSettings.ts
index d51820815b01..44bc0b470b97 100644
--- a/packages/api/src/hooks/useSettings.ts
+++ b/packages/api/src/hooks/useSettings.ts
@@ -7,23 +7,23 @@ type TSetSettingsPayload = NonNullable<
     NonNullable<NonNullable<Parameters<ReturnType<typeof useRequest<'set_settings'>>['mutate']>>[0]>['payload']
 >;
 
-/** A custom hook to get user settings (email, date of birth, address etc) */
+/** A custom hook to get and update the user settings. */
 const useSettings = () => {
     const { data, ...rest } = useFetch('get_settings');
+    const { mutate, ...mutate_rest } = useRequest('set_settings', { onSuccess: () => invalidate('get_settings') });
     const invalidate = useInvalidateQuery();
-    const { mutate, ...mutate_rest } = useRequest('set_settings', {
-        onSuccess: () => invalidate('get_settings'),
-    });
 
-    const update = useCallback((values: TSetSettingsPayload) => mutate({ payload: { ...values } }), [mutate]);
+    const update = useCallback((payload: TSetSettingsPayload) => mutate({ payload }), [mutate]);
 
-    const modified_data = useMemo(() => ({ ...data?.get_settings }), [data?.get_settings]);
+    // Add additional information to the settings response.
+    const modified_settings = useMemo(() => ({ ...data?.get_settings }), [data?.get_settings]);
 
     return {
-        /** User information and settings */
-        data: modified_data,
+        /** The settings response. */
+        data: modified_settings,
         /** Function to update user settings */
         update,
+        /** The mutation related information */
         mutation: mutate_rest,
         ...rest,
     };

From a48a507cfbcbce3fd297fe778554f7b3c97f2d00 Mon Sep 17 00:00:00 2001
From: Thisyahlen Nair <thisyahlen@regentmarkets.com>
Date: Tue, 29 Aug 2023 17:15:19 +0800
Subject: [PATCH 4/8] fix: latest code for available wallets

---
 packages/api/src/hooks/useAvailableWallets.ts | 22 +++++--------------
 1 file changed, 6 insertions(+), 16 deletions(-)

diff --git a/packages/api/src/hooks/useAvailableWallets.ts b/packages/api/src/hooks/useAvailableWallets.ts
index 5481c56252bd..2cfc7c12a735 100644
--- a/packages/api/src/hooks/useAvailableWallets.ts
+++ b/packages/api/src/hooks/useAvailableWallets.ts
@@ -1,29 +1,21 @@
 import React from 'react';
-import useFetch from '../useFetch';
 import useWalletAccountsList from './useWalletAccountsList';
-import useAuthorize from './useAuthorize';
 import useCurrencyConfig from './useCurrencyConfig';
+import useAllAvailableAccounts from './useAllAvailableAccounts';
 
 const useAvailableWallets = () => {
-    const { data } = useAuthorize();
-    const { data: account_type_data, ...rest } = useFetch('get_account_types', {
-        payload: {
-            // This is temporary fix, will be changed by BE
-            company: data?.landing_company_name === 'virtual' ? 'svg' : data?.landing_company_name,
-        },
-        options: { enabled: Boolean(data?.landing_company_name) },
-    });
+    const { data: account_type_data } = useAllAvailableAccounts();
 
     const { data: added_wallets } = useWalletAccountsList();
     const { getConfig } = useCurrencyConfig();
 
     const sortedWallets = React.useMemo(() => {
         if (!account_type_data) return undefined;
-        const { crypto, doughflow } = account_type_data?.get_account_types?.wallet || {};
+        const { crypto, doughflow } = account_type_data?.wallet;
         const crypto_currencies = crypto?.currencies;
         const fiat_currencies = doughflow?.currencies;
 
-        if (!crypto_currencies || !fiat_currencies) return undefined;
+        if (!crypto_currencies || !fiat_currencies) return [];
         const available_currencies = [...fiat_currencies, ...crypto_currencies];
         const non_virtual_wallets = added_wallets?.filter(wallet => !wallet.is_virtual);
 
@@ -37,8 +29,7 @@ const useAvailableWallets = () => {
             .filter(currency => !modified_wallets?.some(wallet => wallet.currency === currency))
             .map(currency => ({
                 currency,
-                // This will also be changed by BE
-                landing_company_name: data?.landing_company_name === 'virtual' ? 'svg' : data?.landing_company_name,
+                landing_company_name: account_type_data?.landing_company,
                 is_added: false,
             }));
 
@@ -66,10 +57,9 @@ const useAvailableWallets = () => {
         }
 
         return [...available_wallets];
-    }, [added_wallets, account_type_data, data?.landing_company_name, getConfig]);
+    }, [account_type_data, added_wallets, getConfig]);
 
     return {
-        ...rest,
         /** Sorted available wallets */
         data: sortedWallets,
     };

From bceed8ec79edfb91ff5f92ffa47415ed5b1f6174 Mon Sep 17 00:00:00 2001
From: Thisyahlen Nair <thisyahlen@regentmarkets.com>
Date: Tue, 29 Aug 2023 17:18:11 +0800
Subject: [PATCH 5/8] fix: rename useGetAccountTypes

---
 packages/api/src/hooks/index.ts                             | 1 +
 packages/api/src/hooks/useAllAvailableAccounts.ts           | 6 ++++--
 .../src/hooks/{useAccountTypes.ts => useGetAccountTypes.ts} | 4 ++--
 3 files changed, 7 insertions(+), 4 deletions(-)
 rename packages/api/src/hooks/{useAccountTypes.ts => useGetAccountTypes.ts} (89%)

diff --git a/packages/api/src/hooks/index.ts b/packages/api/src/hooks/index.ts
index 7749cd7a1f95..1d041229a5a7 100644
--- a/packages/api/src/hooks/index.ts
+++ b/packages/api/src/hooks/index.ts
@@ -9,6 +9,7 @@ export { default as useAvailableWallets } from './useAvailableWallets';
 export { default as useBalance } from './useBalance';
 export { default as useCurrencyConfig } from './useCurrencyConfig';
 export { default as useGetAccountStatus } from './useGetAccountStatus';
+export { default as useGetAccountTypes } from './useGetAccountTypes';
 export { default as useLandingCompany } from './useLandingCompany';
 export { default as useMT5LoginList } from './useMT5LoginList';
 export { default as useSettings } from './useSettings';
diff --git a/packages/api/src/hooks/useAllAvailableAccounts.ts b/packages/api/src/hooks/useAllAvailableAccounts.ts
index 56cc45b69e5b..bceac27bff39 100644
--- a/packages/api/src/hooks/useAllAvailableAccounts.ts
+++ b/packages/api/src/hooks/useAllAvailableAccounts.ts
@@ -1,11 +1,13 @@
 import { useMemo } from 'react';
-import useAccountTypes from './useAccountTypes';
+import useGetAccountTypes from './useGetAccountTypes';
 import useLandingCompany from './useLandingCompany';
 
 /** A custom hook to get all available accounts that user can have. */
 const useAllAvailableAccounts = () => {
     const { data: landing_company_data } = useLandingCompany();
-    const { data: account_types_data, ...rest } = useAccountTypes(landing_company_data?.financial_company?.shortcode);
+    const { data: account_types_data, ...rest } = useGetAccountTypes(
+        landing_company_data?.financial_company?.shortcode
+    );
 
     // Add additional information to the account types response.
     const modified_account_types_data = useMemo(() => {
diff --git a/packages/api/src/hooks/useAccountTypes.ts b/packages/api/src/hooks/useGetAccountTypes.ts
similarity index 89%
rename from packages/api/src/hooks/useAccountTypes.ts
rename to packages/api/src/hooks/useGetAccountTypes.ts
index aa0fb603e690..d4590254b165 100644
--- a/packages/api/src/hooks/useAccountTypes.ts
+++ b/packages/api/src/hooks/useGetAccountTypes.ts
@@ -4,7 +4,7 @@ import useFetch from '../useFetch';
 /**
  * A custom hook to get available account types for a specific landing company.
  */
-const useAccountTypes = (landing_company?: string) => {
+const useGetAccountTypes = (landing_company?: string) => {
     const { data, ...rest } = useFetch('get_account_types', {
         payload: { company: landing_company },
         options: { enabled: Boolean(landing_company) },
@@ -28,4 +28,4 @@ const useAccountTypes = (landing_company?: string) => {
     };
 };
 
-export default useAccountTypes;
+export default useGetAccountTypes;

From c16ab633b025eaeb3894ef2d658619538d9547a4 Mon Sep 17 00:00:00 2001
From: Thisyahlen Nair <thisyahlen@regentmarkets.com>
Date: Wed, 30 Aug 2023 17:15:41 +0800
Subject: [PATCH 6/8] fix: comments

---
 packages/api/src/hooks/index.ts                             | 2 +-
 .../src/hooks/{useGetAccountTypes.ts => useAccountTypes.ts} | 4 ++--
 packages/api/src/hooks/useAllAvailableAccounts.ts           | 6 ++----
 packages/api/src/hooks/useAvailableWallets.ts               | 4 ++--
 4 files changed, 7 insertions(+), 9 deletions(-)
 rename packages/api/src/hooks/{useGetAccountTypes.ts => useAccountTypes.ts} (89%)

diff --git a/packages/api/src/hooks/index.ts b/packages/api/src/hooks/index.ts
index c1b7eb7b1c45..da41a68b8d07 100644
--- a/packages/api/src/hooks/index.ts
+++ b/packages/api/src/hooks/index.ts
@@ -1,4 +1,5 @@
 export { default as useAccountsList } from './useAccountsList';
+export { default as useAccountTypes } from './useAccountTypes';
 export { default as useActiveAccount } from './useActiveAccount';
 export { default as useActiveTradingAccount } from './useActiveTradingAccount';
 export { default as useActiveWalletAccount } from './useActiveWalletAccount';
@@ -8,7 +9,6 @@ export { default as useAvailableWallets } from './useAvailableWallets';
 export { default as useBalance } from './useBalance';
 export { default as useCurrencyConfig } from './useCurrencyConfig';
 export { default as useGetAccountStatus } from './useGetAccountStatus';
-export { default as useGetAccountTypes } from './useGetAccountTypes';
 export { default as useLandingCompany } from './useLandingCompany';
 export { default as useMT5LoginList } from './useMT5LoginList';
 export { default as useSettings } from './useSettings';
diff --git a/packages/api/src/hooks/useGetAccountTypes.ts b/packages/api/src/hooks/useAccountTypes.ts
similarity index 89%
rename from packages/api/src/hooks/useGetAccountTypes.ts
rename to packages/api/src/hooks/useAccountTypes.ts
index d4590254b165..aa0fb603e690 100644
--- a/packages/api/src/hooks/useGetAccountTypes.ts
+++ b/packages/api/src/hooks/useAccountTypes.ts
@@ -4,7 +4,7 @@ import useFetch from '../useFetch';
 /**
  * A custom hook to get available account types for a specific landing company.
  */
-const useGetAccountTypes = (landing_company?: string) => {
+const useAccountTypes = (landing_company?: string) => {
     const { data, ...rest } = useFetch('get_account_types', {
         payload: { company: landing_company },
         options: { enabled: Boolean(landing_company) },
@@ -28,4 +28,4 @@ const useGetAccountTypes = (landing_company?: string) => {
     };
 };
 
-export default useGetAccountTypes;
+export default useAccountTypes;
diff --git a/packages/api/src/hooks/useAllAvailableAccounts.ts b/packages/api/src/hooks/useAllAvailableAccounts.ts
index bceac27bff39..56cc45b69e5b 100644
--- a/packages/api/src/hooks/useAllAvailableAccounts.ts
+++ b/packages/api/src/hooks/useAllAvailableAccounts.ts
@@ -1,13 +1,11 @@
 import { useMemo } from 'react';
-import useGetAccountTypes from './useGetAccountTypes';
+import useAccountTypes from './useAccountTypes';
 import useLandingCompany from './useLandingCompany';
 
 /** A custom hook to get all available accounts that user can have. */
 const useAllAvailableAccounts = () => {
     const { data: landing_company_data } = useLandingCompany();
-    const { data: account_types_data, ...rest } = useGetAccountTypes(
-        landing_company_data?.financial_company?.shortcode
-    );
+    const { data: account_types_data, ...rest } = useAccountTypes(landing_company_data?.financial_company?.shortcode);
 
     // Add additional information to the account types response.
     const modified_account_types_data = useMemo(() => {
diff --git a/packages/api/src/hooks/useAvailableWallets.ts b/packages/api/src/hooks/useAvailableWallets.ts
index 2cfc7c12a735..875f1c1573d5 100644
--- a/packages/api/src/hooks/useAvailableWallets.ts
+++ b/packages/api/src/hooks/useAvailableWallets.ts
@@ -9,7 +9,7 @@ const useAvailableWallets = () => {
     const { data: added_wallets } = useWalletAccountsList();
     const { getConfig } = useCurrencyConfig();
 
-    const sortedWallets = React.useMemo(() => {
+    const sorted_wallets = React.useMemo(() => {
         if (!account_type_data) return undefined;
         const { crypto, doughflow } = account_type_data?.wallet;
         const crypto_currencies = crypto?.currencies;
@@ -61,7 +61,7 @@ const useAvailableWallets = () => {
 
     return {
         /** Sorted available wallets */
-        data: sortedWallets,
+        data: sorted_wallets,
     };
 };
 

From deb39aa03f43d0fcb3622bea565603599f4b10c7 Mon Sep 17 00:00:00 2001
From: Thisyahlen Nair <thisyahlen@regentmarkets.com>
Date: Mon, 4 Sep 2023 14:21:18 +0800
Subject: [PATCH 7/8] chore: split function and refactor

---
 packages/api/src/hooks/useAvailableWallets.ts | 31 ++++++++++++-------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/packages/api/src/hooks/useAvailableWallets.ts b/packages/api/src/hooks/useAvailableWallets.ts
index 875f1c1573d5..223024c7d90d 100644
--- a/packages/api/src/hooks/useAvailableWallets.ts
+++ b/packages/api/src/hooks/useAvailableWallets.ts
@@ -5,12 +5,12 @@ import useAllAvailableAccounts from './useAllAvailableAccounts';
 
 const useAvailableWallets = () => {
     const { data: account_type_data } = useAllAvailableAccounts();
-
     const { data: added_wallets } = useWalletAccountsList();
     const { getConfig } = useCurrencyConfig();
 
-    const sorted_wallets = React.useMemo(() => {
-        if (!account_type_data) return undefined;
+    /** Get the available wallets for the wallet account type */
+    const modified_available_wallets = React.useMemo(() => {
+        if (!account_type_data) return;
         const { crypto, doughflow } = account_type_data?.wallet;
         const crypto_currencies = crypto?.currencies;
         const fiat_currencies = doughflow?.currencies;
@@ -19,12 +19,14 @@ const useAvailableWallets = () => {
         const available_currencies = [...fiat_currencies, ...crypto_currencies];
         const non_virtual_wallets = added_wallets?.filter(wallet => !wallet.is_virtual);
 
+        /** Compare the available wallets with the added wallets and add `is_added` flag */
         const modified_wallets = non_virtual_wallets?.map(wallet => ({
             currency: wallet.currency,
             landing_company_name: wallet.landing_company_name,
             is_added: true,
         }));
 
+        /** Compare the available wallets with the added wallets and add `is_added` flag */
         const available_wallets = available_currencies
             .filter(currency => !modified_wallets?.some(wallet => wallet.currency === currency))
             .map(currency => ({
@@ -33,12 +35,19 @@ const useAvailableWallets = () => {
                 is_added: false,
             }));
 
+        return [...available_wallets, ...modified_wallets];
+    }, [account_type_data, added_wallets]);
+
+    /** Sort the available wallets by fiat, crypto, then virtual */
+    const sorted_available_wallets = React.useMemo(() => {
+        if (!modified_available_wallets) return;
+
         const getConfigIsCrypto = (currency: string) => getConfig(currency)?.is_crypto;
 
         // Sort the unadded wallets alphabetically by fiat, crypto, then virtual
-        available_wallets.sort((a, b) => {
-            const a_config = getConfigIsCrypto(a.currency);
-            const b_config = getConfigIsCrypto(b.currency);
+        modified_available_wallets.sort((a, b) => {
+            const a_config = getConfigIsCrypto(a.currency || 'BTC');
+            const b_config = getConfigIsCrypto(b.currency || 'BTC');
 
             if (a_config !== b_config) return a.currency ? 1 : -1;
 
@@ -46,8 +55,8 @@ const useAvailableWallets = () => {
         });
 
         // Sort the added wallets alphabetically by fiat, crypto, then virtual (if any)
-        if (Array.isArray(modified_wallets)) {
-            modified_wallets?.sort((a, b) => {
+        if (Array.isArray(modified_available_wallets)) {
+            modified_available_wallets?.sort((a, b) => {
                 const a_config = getConfigIsCrypto(a.currency || 'BTC');
                 const b_config = getConfigIsCrypto(b.currency || 'BTC');
                 if (a_config !== b_config) return a_config ? 1 : -1;
@@ -56,12 +65,12 @@ const useAvailableWallets = () => {
             });
         }
 
-        return [...available_wallets];
-    }, [account_type_data, added_wallets, getConfig]);
+        return [...modified_available_wallets];
+    }, [modified_available_wallets, getConfig]);
 
     return {
         /** Sorted available wallets */
-        data: sorted_wallets,
+        data: sorted_available_wallets,
     };
 };
 

From 3d9b66221b11e7207f8030e6c82d150a02c64a97 Mon Sep 17 00:00:00 2001
From: Thisyahlen Nair <thisyahlen@regentmarkets.com>
Date: Mon, 4 Sep 2023 14:50:54 +0800
Subject: [PATCH 8/8] fix: sonarcloud

---
 packages/api/src/hooks/useAvailableWallets.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/api/src/hooks/useAvailableWallets.ts b/packages/api/src/hooks/useAvailableWallets.ts
index 223024c7d90d..c23e910d06e3 100644
--- a/packages/api/src/hooks/useAvailableWallets.ts
+++ b/packages/api/src/hooks/useAvailableWallets.ts
@@ -11,7 +11,7 @@ const useAvailableWallets = () => {
     /** Get the available wallets for the wallet account type */
     const modified_available_wallets = React.useMemo(() => {
         if (!account_type_data) return;
-        const { crypto, doughflow } = account_type_data?.wallet;
+        const { crypto, doughflow } = account_type_data?.wallet || {};
         const crypto_currencies = crypto?.currencies;
         const fiat_currencies = doughflow?.currencies;