Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: 🔱 refactors useIsMt5LoginListStatus hook #70

Merged
merged 2 commits into from
Oct 4, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
shaheer-deriv marked this conversation as resolved.
Show resolved Hide resolved
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ let mockRootStore: ReturnType<typeof mockStore>;

jest.mock('@deriv/hooks', () => ({
...jest.requireActual('@deriv/hooks'),
useIsMt5LoginListStatusPresent: jest.fn(() => false),
useIsMt5LoginListStatusPresent: jest.fn(() => ({ is_flag_present: false, flag_value: undefined })),
}));
const mockedUseIsMt5LoginListStatusPresent = useIsMt5LoginListStatusPresent as jest.MockedFunction<
typeof useIsMt5LoginListStatusPresent
Expand Down Expand Up @@ -289,14 +289,14 @@ describe('<AccountTransferForm />', () => {
});

it('should display no new positions can be opened when transferring amount to a migrated svg account', () => {
mockedUseIsMt5LoginListStatusPresent.mockReturnValue(true);
mockedUseIsMt5LoginListStatusPresent.mockReturnValue({ is_flag_present: true, flag_value: 1 });
renderAccountTransferForm();
expect(screen.getByText(/You can no longer open new positions with this account./i)).toBeInTheDocument();
expect(screen.queryByText(/You have 0 transfer remaining for today./i)).not.toBeInTheDocument();
});

it('should display the number of transfers remaining when transferring amount to a non migrated svg accounts', () => {
mockedUseIsMt5LoginListStatusPresent.mockReturnValue(false);
mockedUseIsMt5LoginListStatusPresent.mockReturnValue({ is_flag_present: false, flag_value: undefined });
renderAccountTransferForm();
expect(screen.getByText(/You have 0 transfer remaining for today./i)).toBeInTheDocument();
expect(screen.queryByText(/You can no longer open new positions with this account./i)).not.toBeInTheDocument();
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,8 @@ const AccountTransferForm = observer(
} = crypto_fiat_converter;

// TODO: Replace 'login' with 'open_order_position_status' once the flag is available in the BE response and in type TSocketResponseData<"mt5_login_list">
const is_open_order_position_status_present = useIsMt5LoginListStatusPresent('login', selected_to.value ?? '');
const { is_flag_present, flag_value } = useIsMt5LoginListStatusPresent('login', selected_to.value ?? '');
const is_open_order_position_status_present = is_flag_present && !!flag_value;

const [from_accounts, setFromAccounts] = React.useState({});
const [to_accounts, setToAccounts] = React.useState({});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,26 +2,36 @@ import { renderHook } from '@testing-library/react-hooks';
import useIsMt5LoginListStatusPresent from '../useIsMt5LoginListStatusPresent';

const mock_login_id = 'MOCK_LOGIN_ID';
const mock_landing_company_short_code = 'MOCK_LANDING_COMPANY_SHORT_CODE';
jest.mock('@deriv/api', () => ({
...jest.requireActual('@deriv/api'),
useMT5AccountsList: jest.fn(() => ({
data: [{ login: mock_login_id, landing_company_short: 'MOCK_LANDING_COMPANY_SHORT_CODE' }],
data: [{ login: mock_login_id, landing_company_short: mock_landing_company_short_code }],
})),
}));

describe('useIsMt5LoginListStatusPresent', () => {
it('should return true when the given status is present for the given login id', () => {
const { result } = renderHook(() => useIsMt5LoginListStatusPresent('landing_company_short', mock_login_id));
expect(result.current).toBeTruthy();
const { flag_value, is_flag_present } = renderHook(() =>
useIsMt5LoginListStatusPresent('landing_company_short', mock_login_id)
).result.current;

expect(is_flag_present).toBeTruthy();
expect(flag_value).toEqual(mock_landing_company_short_code);
});

it('should return false when the given status is not present for the given login id', () => {
const { result } = renderHook(() => useIsMt5LoginListStatusPresent('balance', mock_login_id));
expect(result.current).toBeFalsy();
const { flag_value, is_flag_present } = renderHook(() =>
useIsMt5LoginListStatusPresent('balance', mock_login_id)
).result.current;
expect(is_flag_present).toBeFalsy();
expect(flag_value).toEqual(undefined);
});

it('should return false when the given login id is empty', () => {
const { result } = renderHook(() => useIsMt5LoginListStatusPresent('account_type', ''));
expect(result.current).toBeFalsy();
const { flag_value, is_flag_present } = renderHook(() => useIsMt5LoginListStatusPresent('account_type', ''))
.result.current;
expect(is_flag_present).toBeFalsy();
expect(flag_value).toEqual(undefined);
});
});
12 changes: 7 additions & 5 deletions packages/hooks/src/useIsMt5LoginListStatusPresent.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,17 @@ type DetailsOfEachMT5LoginId = ReturnType<typeof useStore>['client']['mt5_login_
type TStatus = keyof DetailsOfEachMT5LoginId;

/**
* A custom hook to check if the given status flag is present in the mt5_login_list of given account login id
* A custom hook to check if the given status flag is present in the mt5_login_list of given account login id.
* If the flag is present, 'is_flag_present' will be true, else false.
* If the flag is present, 'flag_value' will contain the value, else undefined.
*/
const useIsMt5LoginListStatusPresent = (status: TStatus, account_login_id: string) => {
const { data: mt5_login_list } = useMT5AccountsList();

return React.useMemo(
() => !!mt5_login_list?.find(account => account?.login === account_login_id)?.[status],
[account_login_id, mt5_login_list, status]
);
return React.useMemo(() => {
const account = mt5_login_list?.find(account => account?.login === account_login_id);
return { is_flag_present: Object.hasOwn(account ?? {}, status), flag_value: account?.[status] };
}, [account_login_id, mt5_login_list, status]);
};

export default useIsMt5LoginListStatusPresent;
Loading