Revert "Converted app to class for consistency"

This reverts commit 2e30fb4.

Author: githubsaturn

src/App.tsx

@@ -1,5 +1,5 @@
 import { App as AntdApp, ConfigProvider, theme } from 'antd'
-import React from 'react'
+import { useState } from 'react'
 import { Provider } from 'react-redux'
 import { HashRouter, Route, Switch } from 'react-router-dom'
 import { applyMiddleware, createStore } from 'redux'
@@ -10,72 +10,65 @@ import DarkModeContext from './contexts/DarkModeContext'
 import reducers from './redux/reducers'
 import './styles/style.css'
 import CrashReporter from './utils/CrashReporter'
-import { getCurrentLanguageOption, LanguageOption } from './utils/Language'
+import { getCurrentLanguageOption } from './utils/Language'
 import StorageHelper from './utils/StorageHelper'
 
 CrashReporter.getInstance().init()
 
 const createStoreWithMiddleware = applyMiddleware(thunk)(createStore)
 const store = createStoreWithMiddleware(reducers)
 
-class App extends React.Component<
-    any,
-    { isDarkMode: boolean; currentLanguageOption: LanguageOption }
-> {
-    constructor(props: any) {
-        super(props)
-        this.state = {
-            isDarkMode: StorageHelper.getDarkModeFromLocalStorage(),
-            currentLanguageOption: getCurrentLanguageOption(),
-        }
-    }
+const MainComponent = () => {
+    return (
+        <AntdApp className="full-screen">
+            <HashRouter>
+                <Switch>
+                    <Route path="/login/" component={Login} />
+                    <Route path="/" component={PageRoot} />
+                </Switch>
+            </HashRouter>
+        </AntdApp>
+    )
+}
 
-    render() {
-        const { defaultAlgorithm, darkAlgorithm } = theme
-        const currentLanguageOption = this.state.currentLanguageOption
+function App() {
+    const { defaultAlgorithm, darkAlgorithm } = theme
+    const [isDarkMode, setIsDarkMode] = useState(
+        StorageHelper.getDarkModeFromLocalStorage()
+    )
 
-        const self = this
+    const currentLanguageOption = getCurrentLanguageOption()
 
-        return (
-            <ConfigProvider
-                direction={currentLanguageOption.rtl ? 'rtl' : 'ltr'}
-                theme={{
-                    algorithm: this.state.isDarkMode
-                        ? darkAlgorithm
-                        : defaultAlgorithm,
-                    token: {
-                        colorPrimary: '#1b8ad3',
-                        colorLink: '#1b8ad3',
-                        fontFamily: `QuickSand, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
-                            'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
-                            'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'`,
+    return (
+        <ConfigProvider
+            direction={currentLanguageOption.rtl ? 'rtl' : 'ltr'}
+            theme={{
+                algorithm: isDarkMode ? darkAlgorithm : defaultAlgorithm,
+                token: {
+                    colorPrimary: '#1b8ad3',
+                    colorLink: '#1b8ad3',
+                    fontFamily: `QuickSand, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+                        'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
+                        'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'`,
+                },
+            }}
+            locale={currentLanguageOption.antdLocale}
+        >
+            <DarkModeContext.Provider
+                value={{
+                    isDarkMode,
+                    setIsDarkMode: (value) => {
+                        setIsDarkMode(value)
+                        StorageHelper.setDarkModeInLocalStorage(value)
                     },
                 }}
-                locale={currentLanguageOption.antdLocale}
             >
-                <DarkModeContext.Provider
-                    value={{
-                        isDarkMode: this.state.isDarkMode,
-                        setIsDarkMode: (value: boolean) => {
-                            self.setState({ isDarkMode: value })
-                            StorageHelper.setDarkModeInLocalStorage(value)
-                        },
-                    }}
-                >
-                    <Provider store={store}>
-                        <AntdApp className="full-screen">
-                            <HashRouter>
-                                <Switch>
-                                    <Route path="/login/" component={Login} />
-                                    <Route path="/" component={PageRoot} />
-                                </Switch>
-                            </HashRouter>
-                        </AntdApp>
-                    </Provider>
-                </DarkModeContext.Provider>
-            </ConfigProvider>
-        )
-    }
+                <Provider store={store}>
+                    <MainComponent />
+                </Provider>
+            </DarkModeContext.Provider>
+        </ConfigProvider>
+    )
 }
 
 export default App