Merge branch 'master' into matin/79302/acuity

aizad-deriv · Oct 31, 2022 · 0f37276 · 0f37276
2 parents 53bd935 + 28f9bfe
commit 0f37276
Show file tree

Hide file tree

Showing 168 changed files with 51,878 additions and 45,640 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -81,6 +81,7 @@ module.exports = {
         'import/prefer-default-export': 0,
         'import/extensions': [0, { jsx: 'always', json: 'always' }],
         'no-sequences': ['warn'],
+        'react/no-unknown-property': 1,
         'import/no-unresolved': [2, { ignore: ['@deriv/components', '@deriv/shared'] }],
 
         // react rules

diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/account/package.json b/packages/account/package.json
@@ -37,8 +37,8 @@
         "formik": "^2.1.4",
         "i18n-iso-countries": "^6.8.0",
         "js-cookie": "^2.2.1",
-        "mobx": "^5.15.7",
-        "mobx-react": "6.3.1",
+        "mobx": "^6.6.1",
+        "mobx-react": "^7.5.1",
         "onfido-sdk-ui": "8.1.1",
         "prop-types": "^15.7.2",
         "qrcode.react": "^1.0.0",

diff --git a/packages/account/src/Components/account-limits/__tests__/account-limits-footer.spec.js b/packages/account/src/Components/account-limits/__tests__/account-limits-footer.spec.js
@@ -34,9 +34,4 @@ describe('<AccountLimitsFooterPortal/>', () => {
         render(<AccountLimitsFooterPortalComponent />);
         expect(screen.getAllByTestId('footer_text').length).toBe(1);
     });
-
-    it('should render AppSettings.Footer components correctly', () => {
-        const { container } = render(<AccountLimitsFooterPortalComponent />);
-        expect(container.getElementsByClassName('dc-app-settings__footer').length).toBe(1);
-    });
 });
diff --git a/packages/account/src/Components/account-limits/account-limits-footer.jsx b/packages/account/src/Components/account-limits/account-limits-footer.jsx
@@ -1,22 +1,18 @@
 import * as React from 'react';
 import { createPortal } from 'react-dom';
-import { AppSettings, Text } from '@deriv/components';
+import { Text } from '@deriv/components';
 import { Localize } from '@deriv/translations';
 import AccountLimitsContext from './account-limits-context';
 
 const AccountLimitsFooterPortal = () => {
     const { footer_ref, toggleOverlay } = React.useContext(AccountLimitsContext);
 
     return createPortal(
-        <AppSettings.Footer>
-            <AppSettings.Footer.Left>
-                <a className='link link--prominent' onClick={toggleOverlay} data-testid='footer_text'>
-                    <Text size='xxs' line_height='m' weight='bold'>
-                        <Localize i18n_default_text='Learn more about account limits' />
-                    </Text>
-                </a>
-            </AppSettings.Footer.Left>
-        </AppSettings.Footer>,
+        <a className='link link--prominent' onClick={toggleOverlay} data-testid='footer_text'>
+            <Text size='xxs' line_height='m' weight='bold'>
+                <Localize i18n_default_text='Learn more about account limits' />
+            </Text>
+        </a>,
         footer_ref
     );
 };

diff --git a/packages/account/src/Components/account-limits/index.js b/packages/account/src/Components/account-limits/index.js
@@ -1,4 +1,3 @@
 import AccountLimits from './account-limits.jsx';
-import './account-limits.scss';
 
 export default AccountLimits;
diff --git a/packages/account/src/Components/api-token/api-token-footer.jsx b/packages/account/src/Components/api-token/api-token-footer.jsx
@@ -1,22 +1,18 @@
 import React from 'react';
 import { createPortal } from 'react-dom';
-import { AppSettings, Text } from '@deriv/components';
+import { Text } from '@deriv/components';
 import { Localize } from '@deriv/translations';
 import ApiTokenContext from './api-token-context';
 
 const ApiTokenFooter = () => {
     const { footer_ref, toggleOverlay } = React.useContext(ApiTokenContext);
 
     return createPortal(
-        <AppSettings.Footer>
-            <AppSettings.Footer.Left>
-                <a className='link link--prominent' onClick={toggleOverlay}>
-                    <Text size='xxs' line_height='m' weight='bold'>
-                        <Localize i18n_default_text='Learn more about API token' />
-                    </Text>
-                </a>
-            </AppSettings.Footer.Left>
-        </AppSettings.Footer>,
+        <a className='link link--prominent' onClick={toggleOverlay}>
+            <Text size='xxs' line_height='m' weight='bold'>
+                <Localize i18n_default_text='Learn more about API token' />
+            </Text>
+        </a>,
         footer_ref
     );
 };

diff --git a/packages/account/src/Components/api-token/index.js b/packages/account/src/Components/api-token/index.js
@@ -1,4 +1,3 @@
 import ApiToken from './api-token.jsx';
-import './api-token.scss';
 
 export default ApiToken;
diff --git a/packages/account/src/Components/self-exclusion/index.js b/packages/account/src/Components/self-exclusion/index.js
@@ -1,4 +1,3 @@
 import SelfExclusion from './self-exclusion.jsx';
-import './self-exclusion.scss';
 
 export default SelfExclusion;
diff --git a/packages/account/src/Components/self-exclusion/self-exclusion-footer.jsx b/packages/account/src/Components/self-exclusion/self-exclusion-footer.jsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { createPortal } from 'react-dom';
 import { useFormikContext } from 'formik';
-import { AppSettings, Button, Text } from '@deriv/components';
+import { Button, Text } from '@deriv/components';
 import { Localize } from '@deriv/translations';
 import SelfExclusionContext from './self-exclusion-context';
 
@@ -11,27 +11,23 @@ const SelfExclusionFooter = () => {
 
     if (footer_ref) {
         return createPortal(
-            <AppSettings.Footer>
-                <AppSettings.Footer.Left>
-                    <a className='link link--prominent' onClick={toggleArticle}>
-                        <Text size='xxs' line_height='m' weight='bold'>
-                            <Localize i18n_default_text='Learn more about trading limits' />
-                        </Text>
-                    </a>
-                </AppSettings.Footer.Left>
-                <AppSettings.Footer.Right>
-                    <Button
-                        disabled={!dirty || !isValid || isSubmitting}
-                        primary
-                        className='da-self-exclusion__button'
-                        large
-                        onClick={() => goToConfirm(values)}
-                        type='button'
-                    >
-                        <Localize i18n_default_text='Next' />
-                    </Button>
-                </AppSettings.Footer.Right>
-            </AppSettings.Footer>,
+            <>
+                <a className='link link--prominent' onClick={toggleArticle}>
+                    <Text size='xxs' line_height='m' weight='bold'>
+                        <Localize i18n_default_text='Learn more about trading limits' />
+                    </Text>
+                </a>
+                <Button
+                    disabled={!dirty || !isValid || isSubmitting}
+                    primary
+                    className='da-self-exclusion__button'
+                    large
+                    onClick={() => goToConfirm(values)}
+                    type='button'
+                >
+                    <Localize i18n_default_text='Next' />
+                </Button>
+            </>,
             footer_ref
         );
     }

diff --git a/packages/account/src/Sections/Profile/PersonalDetails/personal-details.jsx b/packages/account/src/Sections/Profile/PersonalDetails/personal-details.jsx
@@ -127,6 +127,7 @@ export const PersonalDetailsForm = ({
     const [rest_state, setRestState] = React.useState({
         show_form: true,
         errors: false,
+        form_initial_values: {},
     });
 
     const [start_on_submit_timeout, setStartOnSubmitTimeout] = React.useState({

diff --git a/packages/account/src/Sections/Security/AccountLimits/account-limits.jsx b/packages/account/src/Sections/Security/AccountLimits/account-limits.jsx
@@ -1,4 +1,5 @@
 import AccountLimits from 'Components/account-limits/account-limits.jsx';
+import 'Components/account-limits/account-limits.scss';
 import { connect } from 'Stores/connect';
 
 export default connect(({ client, common, ui }) => ({

diff --git a/packages/account/src/Sections/Security/ApiToken/api-token.jsx b/packages/account/src/Sections/Security/ApiToken/api-token.jsx
@@ -1,5 +1,6 @@
 import { WS } from '@deriv/shared';
 import { connect } from 'Stores/connect';
 import ApiToken from 'Components/api-token/api-token.jsx';
+import 'Components/api-token/api-token.scss';
 
 export default connect(({ client }) => ({ is_switching: client.is_switching, ws: WS }))(ApiToken);
diff --git a/packages/account/src/Sections/Security/SelfExclusion/self-exclusion.jsx b/packages/account/src/Sections/Security/SelfExclusion/self-exclusion.jsx
@@ -2,6 +2,7 @@ import React from 'react';
 import { PlatformContext, WS } from '@deriv/shared';
 import { connect } from 'Stores/connect';
 import SelfExclusionComponent from 'Components/self-exclusion/self-exclusion.jsx';
+import 'Components/self-exclusion/self-exclusion.scss';
 
 const SelfExclusion = props => {
     const { is_appstore } = React.useContext(PlatformContext);

diff --git a/...account/src/Sections/Verification/ProofOfIdentity/proof-of-identity-container-for-mt5.jsx b/...account/src/Sections/Verification/ProofOfIdentity/proof-of-identity-container-for-mt5.jsx
@@ -18,7 +18,7 @@ const ShowDemoMessage = () => (
             line_height='m'
             weight='bold'
         >
-            {localize('This feature is not available for demo accounts.')}
+            {localize('Switch to your real account to create a Deriv MT5 account')}
         </Text>
     </div>
 );

diff --git a/packages/appstore/package.json b/packages/appstore/package.json
@@ -36,8 +36,8 @@
         "@deriv/translations": "^1.0.0",
         "classnames": "^2.2.6",
         "formik": "^2.1.4",
-        "mobx": "^5.15.7",
-        "mobx-react-lite": "^2.2.2",
+        "mobx": "^6.6.1",
+        "mobx-react-lite": "^3.4.0",
         "object.fromentries": "^2.0.0",
         "prop-types": "^15.7.2",
         "react": "^16.14.0",

diff --git a/packages/bot-web-ui/package.json b/packages/bot-web-ui/package.json
@@ -69,7 +69,7 @@
     "dependencies": {
         "@deriv/bot-skeleton": "^1.0.0",
         "@deriv/components": "^1.0.0",
-        "@deriv/deriv-charts": "^0.6.3",
+        "@deriv/deriv-charts": "1.0.0",
         "@deriv/shared": "^1.0.0",
         "@deriv/translations": "^1.0.0",
         "classnames": "^2.2.6",
@@ -78,8 +78,8 @@
         "gh-pages": "^2.1.1",
         "immutable": "^3.8.2",
         "lz-string": "^1.4.4",
-        "mobx": "^5.15.7",
-        "mobx-react": "6.3.1",
+        "mobx": "^6.6.1",
+        "mobx-react": "^7.5.1",
         "pako": "^1.0.11",
         "prop-types": "^15.7.2",
         "react": "^16.14.0",

diff --git a/packages/bot-web-ui/src/stores/app-store.js b/packages/bot-web-ui/src/stores/app-store.js
@@ -1,16 +1,20 @@
-import { action, reaction } from 'mobx';
+import { action, reaction, makeObservable } from 'mobx';
 import { isEuResidenceWithOnlyVRTC, showDigitalOptionsUnavailableError } from '@deriv/shared';
 import { localize } from '@deriv/translations';
 import { runIrreversibleEvents, ApiHelpers, DBot } from '@deriv/bot-skeleton';
 
 export default class AppStore {
     constructor(root_store) {
+        makeObservable(this, {
+            onMount: action.bound,
+            onUnmount: action.bound,
+        });
+
         this.root_store = root_store;
         this.dbot_store = null;
         this.api_helpers_store = null;
     }
 
-    @action.bound
     onMount() {
         const { blockly_store, core, main_content } = this.root_store;
         const { client, common, ui } = core;
@@ -33,7 +37,6 @@ export default class AppStore {
         main_content.getCachedActiveTab();
     }
 
-    @action.bound
     onUnmount() {
         DBot.terminateBot();
 

diff --git a/packages/bot-web-ui/src/stores/blockly-store.js b/packages/bot-web-ui/src/stores/blockly-store.js
@@ -1,18 +1,22 @@
-import { action, observable } from 'mobx';
+import { action, observable, makeObservable } from 'mobx';
 
 export default class BlocklyStore {
     constructor(root_store) {
+        makeObservable(this, {
+            is_loading: observable,
+            startLoading: action.bound,
+            endLoading: action.bound,
+        });
+
         this.root_store = root_store;
     }
 
-    @observable is_loading = false;
+    is_loading = false;
 
-    @action.bound
     startLoading() {
         this.is_loading = true;
     }
 
-    @action.bound
     endLoading() {
         this.is_loading = false;
     }

diff --git a/packages/bot-web-ui/src/stores/chart-store.js b/packages/bot-web-ui/src/stores/chart-store.js
@@ -1,4 +1,4 @@
-import { action, computed, observable, reaction } from 'mobx';
+import { action, computed, observable, reaction, makeObservable } from 'mobx';
 // import { tabs_title } from '../constants/bot-contents';
 import { ServerTime } from '@deriv/bot-skeleton';
 
@@ -7,6 +7,21 @@ let WS;
 
 export default class ChartStore {
     constructor(root_store) {
+        makeObservable(this, {
+            symbol: observable,
+            is_chart_loading: observable,
+            chart_type: observable,
+            granularity: observable,
+            is_contract_ended: computed,
+            onStartBot: action.bound,
+            onStopBot: action.bound,
+            updateSymbol: action.bound,
+            onSymbolChange: action.bound,
+            updateGranularity: action.bound,
+            updateChartType: action.bound,
+            setChartStatus: action.bound,
+        });
+
         this.root_store = root_store;
         WS = root_store.ws;
         const { run_panel } = root_store;
@@ -17,34 +32,30 @@ export default class ChartStore {
         );
     }
 
-    @observable symbol;
-    @observable is_chart_loading;
-    @observable chart_type;
-    @observable granularity;
+    symbol;
+    is_chart_loading;
+    chart_type;
+    granularity;
 
-    @computed
     get is_contract_ended() {
         const { transactions } = this.root_store;
 
         return transactions.contracts.length > 0 && transactions.contracts[0].is_ended;
     }
 
-    @action.bound
     onStartBot() {
         this.updateSymbol();
 
         // const { main_content } = this.root_store;
         // main_content.setActiveTab(tabs_title.CHART);
     }
 
-    @action.bound
     // eslint-disable-next-line
     onStopBot() {
         // const { main_content } = this.root_store;
         // main_content.setActiveTab(tabs_title.WORKSPACE);
     }
 
-    @action.bound
     updateSymbol() {
         const workspace = Blockly.derivWorkspace;
         const market_block = workspace.getAllBlocks().find(block => {
@@ -57,22 +68,18 @@ export default class ChartStore {
         }
     }
 
-    @action.bound
     onSymbolChange(symbol) {
         this.symbol = symbol;
     }
 
-    @action.bound
     updateGranularity(granularity) {
         this.granularity = granularity;
     }
 
-    @action.bound
     updateChartType(chart_type) {
         this.chart_type = chart_type;
     }
 
-    @action.bound
     setChartStatus(status) {
         this.is_chart_loading = status;
     }