Niloofar Sadeghi | components and shared ts migration [parent branch]

packages/account/src/Components/Routes/__tests__/binary-link.spec.tsx

@@ -26,7 +26,7 @@ describe('<BinaryLink />', () => {
 
     it('should show and trigger Navlink with path and active className', () => {
         render(
-            <PlatformContext.Provider value={{ is_appstore: false }}>
+            <PlatformContext.Provider value={{ is_appstore: false, is_deriv_crypto: false, is_pre_appstore: false }}>
                 <Router history={history}>
                     <BinaryLink to='test-link'>Simple test link</BinaryLink>
                 </Router>
@@ -41,7 +41,7 @@ describe('<BinaryLink />', () => {
 
     it('should show simple link text', () => {
         render(
-            <PlatformContext.Provider value={{ is_appstore: false }}>
+            <PlatformContext.Provider value={{ is_appstore: false, is_deriv_crypto: false, is_pre_appstore: false }}>
                 <Router history={history}>
                     <BinaryLink>Simple test link without Navlink</BinaryLink>
                 </Router>
@@ -55,7 +55,9 @@ describe('<BinaryLink />', () => {
 
         expect(() =>
             render(
-                <PlatformContext.Provider value={{ is_appstore: false }}>
+                <PlatformContext.Provider
+                    value={{ is_appstore: false, is_deriv_crypto: false, is_pre_appstore: false }}
+                >
                     <Router history={history}>
                         <BinaryLink to='test-link'>Simple test link</BinaryLink>
                     </Router>

packages/account/src/Components/Routes/__tests__/binary-routes.spec.tsx

@@ -20,7 +20,7 @@ describe('<BinaryRoutes />', () => {
 
     it('should render BinaryRoutes with mocked route component', () => {
         render(
-            <PlatformContext.Provider value={{ is_appstore: false }}>
+            <PlatformContext.Provider value={{ is_appstore: false, is_deriv_crypto: false, is_pre_appstore: false }}>
                 <Router history={history}>
                     <BinaryRoutes />
                 </Router>

packages/account/src/Components/Routes/binary-link.tsx

@@ -3,15 +3,14 @@ import { NavLink } from 'react-router-dom';
 import { PlatformContext } from '@deriv/shared';
 import getRoutesConfig from 'Constants/routes-config';
 import { findRouteByPath, normalizePath } from './helpers';
-import { TPlatformContext } from 'Types';
 
 type TBinaryLink = {
     active_class: string;
     to: string;
 };
 
 const BinaryLink = ({ active_class, to, children, ...props }: React.PropsWithChildren<Partial<TBinaryLink>>) => {
-    const { is_appstore } = React.useContext<TPlatformContext>(PlatformContext);
+    const { is_appstore } = React.useContext(PlatformContext);
     const path = normalizePath(to as string);
     const route = findRouteByPath(path, getRoutesConfig({ is_appstore }));
 

packages/account/src/Components/Routes/binary-routes.tsx

@@ -3,11 +3,11 @@ import { Switch } from 'react-router-dom';
 import { PlatformContext } from '@deriv/shared';
 import { Localize } from '@deriv/translations';
 import getRoutesConfig from 'Constants/routes-config';
-import { TBinaryRoutes, TPlatformContext, TRoute } from 'Types';
+import { TBinaryRoutes, TRoute } from 'Types';
 import RouteWithSubRoutes from './route-with-sub-routes';
 
 const BinaryRoutes = (props: TBinaryRoutes) => {
-    const { is_appstore } = React.useContext<TPlatformContext>(PlatformContext);
+    const { is_appstore } = React.useContext(PlatformContext);
 
     return (
         <React.Suspense

packages/account/src/Components/account-limits/__tests__/account-limit-overlay.spec.js → packages/account/src/Components/account-limits/__tests__/account-limit-overlay.spec.tsx

@@ -1,24 +1,25 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { fireEvent, screen, render } from '@testing-library/react';
+import { screen, render } from '@testing-library/react';
 import AccountLimitsOverlay from '../account-limits-overlay';
 import AccountLimitsContext from '../account-limits-context';
 
 describe('<AccountLimitsOverlay/>', () => {
     beforeAll(() => {
-        ReactDOM.createPortal = jest.fn(component => {
+        (ReactDOM.createPortal as jest.Mock) = jest.fn(component => {
             return component;
         });
     });
 
     afterAll(() => {
-        ReactDOM.createPortal.mockClear();
+        (ReactDOM.createPortal as jest.Mock).mockClear();
     });
 
     const Component = () => (
         <AccountLimitsContext.Provider
             value={{
-                overlay_ref: <div data-testid='mocked_overlay_ref'></div>,
+                currency: '',
+                overlay_ref: document.createElement('div'),
                 toggleOverlay: jest.fn(),
             }}
         >
@@ -35,7 +36,7 @@ describe('<AccountLimitsOverlay/>', () => {
     it('should go to help-centre page if the Help Centre link on the text is clicked', () => {
         render(<Component />);
 
-        expect(screen.getByText('Help Centre').closest('a')).toHaveAttribute('href', 'https://deriv.com/help-centre');
+        expect(screen.getByText('Help Centre').hasAttribute('href'));
     });
     it('should show Done Button', () => {
         render(<Component />);