From cfa790fe6c88cb97bbf4dcf991d5c42ff003ced7 Mon Sep 17 00:00:00 2001
From: Carol Sachdeva <58209918+carol-binary@users.noreply.github.com>
Date: Tue, 27 Sep 2022 16:36:57 +0800
Subject: [PATCH] Revert "yauheni/74383/ converting app.jsx in account to
 functional component (#6282)" (#6612)

This reverts commit e1fc3e8af2bc0bfefa3427e0bcf257300563755c.
---
 packages/account/build/webpack.config.js     |  2 +-
 packages/account/src/App.jsx                 | 28 ++++++++++++++++++++
 packages/account/src/App.tsx                 | 28 --------------------
 packages/account/src/Stores/index.js         | 10 +++++++
 packages/account/src/Stores/index.ts         | 26 ------------------
 packages/account/src/{index.tsx => index.js} |  2 +-
 6 files changed, 40 insertions(+), 56 deletions(-)
 create mode 100644 packages/account/src/App.jsx
 delete mode 100644 packages/account/src/App.tsx
 create mode 100644 packages/account/src/Stores/index.js
 delete mode 100644 packages/account/src/Stores/index.ts
 rename packages/account/src/{index.tsx => index.js} (85%)

diff --git a/packages/account/build/webpack.config.js b/packages/account/build/webpack.config.js
index e61df5fe3fb2..d03aa1c7051b 100644
--- a/packages/account/build/webpack.config.js
+++ b/packages/account/build/webpack.config.js
@@ -8,7 +8,7 @@ module.exports = function (env) {
         context: path.resolve(__dirname, '../src'),
         devtool: IS_RELEASE ? undefined : 'eval-cheap-module-source-map',
         entry: {
-            account: path.resolve(__dirname, '../src', 'index.tsx'),
+            account: path.resolve(__dirname, '../src', 'index.js'),
             'accept-risk-config': 'Configs/accept-risk-config',
             'account-limits': 'Components/account-limits',
             'address-details': 'Components/address-details',
diff --git a/packages/account/src/App.jsx b/packages/account/src/App.jsx
new file mode 100644
index 000000000000..122431d67976
--- /dev/null
+++ b/packages/account/src/App.jsx
@@ -0,0 +1,28 @@
+import React from 'react';
+import { setWebsocket } from '@deriv/shared';
+import Routes from 'Containers/routes.jsx';
+import ResetTradingPassword from 'Containers/reset-trading-password.jsx';
+import { MobxContentProvider } from 'Stores/connect';
+import initStore from 'Stores/init-store';
+
+class App extends React.Component {
+    constructor(props) {
+        super(props);
+        const {
+            passthrough: { WS, root_store },
+        } = props;
+        this.root_store = initStore(root_store, WS);
+        setWebsocket(WS);
+    }
+
+    render() {
+        return (
+            <MobxContentProvider store={this.props.passthrough.root_store}>
+                <Routes />
+                <ResetTradingPassword />
+            </MobxContentProvider>
+        );
+    }
+}
+
+export default App;
diff --git a/packages/account/src/App.tsx b/packages/account/src/App.tsx
deleted file mode 100644
index c697fbc7aaa8..000000000000
--- a/packages/account/src/App.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import React from 'react';
-import Routes from 'Containers/routes.jsx';
-import ResetTradingPassword from 'Containers/reset-trading-password.jsx';
-import { MobxContentProvider } from 'Stores/connect';
-import initStore from 'Stores/init-store';
-import { TCoreStore } from 'Stores/index';
-
-// TODO: add correct types for stores and WS after implementing them
-type TAppProps = {
-    passthrough: {
-        root_store: TCoreStore;
-        WS: Record<string, any>;
-    };
-};
-
-const App = ({ passthrough }: TAppProps) => {
-    const { root_store, WS } = passthrough;
-    initStore(root_store, WS);
-
-    return (
-        <MobxContentProvider store={root_store}>
-            <Routes />
-            <ResetTradingPassword />
-        </MobxContentProvider>
-    );
-};
-
-export default App;
diff --git a/packages/account/src/Stores/index.js b/packages/account/src/Stores/index.js
new file mode 100644
index 000000000000..4e3c2e333bdd
--- /dev/null
+++ b/packages/account/src/Stores/index.js
@@ -0,0 +1,10 @@
+export default class RootStore {
+    constructor(core_store) {
+        this.client = core_store.client;
+        this.common = core_store.common;
+        this.ui = core_store.ui;
+        this.gtm = core_store.gtm;
+        this.rudderstack = core_store.rudderstack;
+        this.pushwoosh = core_store.pushwoosh;
+    }
+}
diff --git a/packages/account/src/Stores/index.ts b/packages/account/src/Stores/index.ts
deleted file mode 100644
index 9797a63b3b03..000000000000
--- a/packages/account/src/Stores/index.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-export type TCoreStore = {
-    client: Record<string, any>;
-    common: Record<string, any>;
-    ui: Record<string, any>;
-    gtm: Record<string, any>;
-    rudderstack: Record<string, any>;
-    pushwoosh: Record<string, any>;
-};
-
-export default class RootStore {
-    public client: Record<string, any>;
-    public common: Record<string, any>;
-    public ui: Record<string, any>;
-    public gtm: Record<string, any>;
-    public rudderstack: Record<string, any>;
-    public pushwoosh: Record<string, any>;
-
-    constructor(core_store: TCoreStore) {
-        this.client = core_store.client;
-        this.common = core_store.common;
-        this.ui = core_store.ui;
-        this.gtm = core_store.gtm;
-        this.rudderstack = core_store.rudderstack;
-        this.pushwoosh = core_store.pushwoosh;
-    }
-}
diff --git a/packages/account/src/index.tsx b/packages/account/src/index.js
similarity index 85%
rename from packages/account/src/index.tsx
rename to packages/account/src/index.js
index 784223d7f9af..459167f21d91 100644
--- a/packages/account/src/index.tsx
+++ b/packages/account/src/index.js
@@ -3,7 +3,7 @@ import { makeLazyLoader, moduleLoader } from '@deriv/shared';
 import { Loading } from '@deriv/components';
 
 const App = makeLazyLoader(
-    () => moduleLoader(() => import(/* webpackChunkName: "account-app", webpackPreload: true */ './App')),
+    () => moduleLoader(() => import(/* webpackChunkName: "account-app", webpackPreload: true */ './App.jsx')),
     () => <Loading />
 )();