1
1
import { App as AntdApp , ConfigProvider , theme } from 'antd'
2
- import React from 'react'
2
+ import { useState } from 'react'
3
3
import { Provider } from 'react-redux'
4
4
import { HashRouter , Route , Switch } from 'react-router-dom'
5
5
import { applyMiddleware , createStore } from 'redux'
@@ -10,72 +10,65 @@ import DarkModeContext from './contexts/DarkModeContext'
10
10
import reducers from './redux/reducers'
11
11
import './styles/style.css'
12
12
import CrashReporter from './utils/CrashReporter'
13
- import { getCurrentLanguageOption , LanguageOption } from './utils/Language'
13
+ import { getCurrentLanguageOption } from './utils/Language'
14
14
import StorageHelper from './utils/StorageHelper'
15
15
16
16
CrashReporter . getInstance ( ) . init ( )
17
17
18
18
const createStoreWithMiddleware = applyMiddleware ( thunk ) ( createStore )
19
19
const store = createStoreWithMiddleware ( reducers )
20
20
21
- class App extends React . Component <
22
- any ,
23
- { isDarkMode : boolean ; currentLanguageOption : LanguageOption }
24
- > {
25
- constructor ( props : any ) {
26
- super ( props )
27
- this . state = {
28
- isDarkMode : StorageHelper . getDarkModeFromLocalStorage ( ) ,
29
- currentLanguageOption : getCurrentLanguageOption ( ) ,
30
- }
31
- }
21
+ const MainComponent = ( ) => {
22
+ return (
23
+ < AntdApp className = "full-screen" >
24
+ < HashRouter >
25
+ < Switch >
26
+ < Route path = "/login/" component = { Login } />
27
+ < Route path = "/" component = { PageRoot } />
28
+ </ Switch >
29
+ </ HashRouter >
30
+ </ AntdApp >
31
+ )
32
+ }
32
33
33
- render ( ) {
34
- const { defaultAlgorithm, darkAlgorithm } = theme
35
- const currentLanguageOption = this . state . currentLanguageOption
34
+ function App ( ) {
35
+ const { defaultAlgorithm, darkAlgorithm } = theme
36
+ const [ isDarkMode , setIsDarkMode ] = useState (
37
+ StorageHelper . getDarkModeFromLocalStorage ( )
38
+ )
36
39
37
- const self = this
40
+ const currentLanguageOption = getCurrentLanguageOption ( )
38
41
39
- return (
40
- < ConfigProvider
41
- direction = { currentLanguageOption . rtl ? 'rtl' : 'ltr' }
42
- theme = { {
43
- algorithm : this . state . isDarkMode
44
- ? darkAlgorithm
45
- : defaultAlgorithm ,
46
- token : {
47
- colorPrimary : '#1b8ad3' ,
48
- colorLink : '#1b8ad3' ,
49
- fontFamily : `QuickSand, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
50
- 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
51
- 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'` ,
42
+ return (
43
+ < ConfigProvider
44
+ direction = { currentLanguageOption . rtl ? 'rtl' : 'ltr' }
45
+ theme = { {
46
+ algorithm : isDarkMode ? darkAlgorithm : defaultAlgorithm ,
47
+ token : {
48
+ colorPrimary : '#1b8ad3' ,
49
+ colorLink : '#1b8ad3' ,
50
+ fontFamily : `QuickSand, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
51
+ 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
52
+ 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'` ,
53
+ } ,
54
+ } }
55
+ locale = { currentLanguageOption . antdLocale }
56
+ >
57
+ < DarkModeContext . Provider
58
+ value = { {
59
+ isDarkMode,
60
+ setIsDarkMode : ( value ) => {
61
+ setIsDarkMode ( value )
62
+ StorageHelper . setDarkModeInLocalStorage ( value )
52
63
} ,
53
64
} }
54
- locale = { currentLanguageOption . antdLocale }
55
65
>
56
- < DarkModeContext . Provider
57
- value = { {
58
- isDarkMode : this . state . isDarkMode ,
59
- setIsDarkMode : ( value : boolean ) => {
60
- self . setState ( { isDarkMode : value } )
61
- StorageHelper . setDarkModeInLocalStorage ( value )
62
- } ,
63
- } }
64
- >
65
- < Provider store = { store } >
66
- < AntdApp className = "full-screen" >
67
- < HashRouter >
68
- < Switch >
69
- < Route path = "/login/" component = { Login } />
70
- < Route path = "/" component = { PageRoot } />
71
- </ Switch >
72
- </ HashRouter >
73
- </ AntdApp >
74
- </ Provider >
75
- </ DarkModeContext . Provider >
76
- </ ConfigProvider >
77
- )
78
- }
66
+ < Provider store = { store } >
67
+ < MainComponent />
68
+ </ Provider >
69
+ </ DarkModeContext . Provider >
70
+ </ ConfigProvider >
71
+ )
79
72
}
80
73
81
74
export default App
0 commit comments