diff options
Diffstat (limited to 'subprojects/frontend/src/App.tsx')
-rw-r--r-- | subprojects/frontend/src/App.tsx | 44 |
1 files changed, 28 insertions, 16 deletions
diff --git a/subprojects/frontend/src/App.tsx b/subprojects/frontend/src/App.tsx index 90514044..a471690b 100644 --- a/subprojects/frontend/src/App.tsx +++ b/subprojects/frontend/src/App.tsx | |||
@@ -1,21 +1,33 @@ | |||
1 | import Grow from '@mui/material/Grow'; | 1 | import Box from '@mui/material/Box'; |
2 | import Stack from '@mui/material/Stack'; | 2 | import CssBaseline from '@mui/material/CssBaseline'; |
3 | import { SnackbarProvider } from 'notistack'; | 3 | import React, { StrictMode, Suspense, lazy } from 'react'; |
4 | import React from 'react'; | ||
5 | 4 | ||
6 | import TopBar from './TopBar'; | 5 | import Loading from './Loading'; |
7 | import UpdateNotification from './UpdateNotification'; | 6 | import type RootStore from './RootStore'; |
8 | import EditorPane from './editor/EditorPane'; | 7 | import RootStoreProvider from './RootStoreProvider'; |
8 | import WindowControlsOverlayColor from './WindowControlsOverlayColor'; | ||
9 | import ThemeProvider from './theme/ThemeProvider'; | ||
9 | 10 | ||
10 | export default function App(): JSX.Element { | 11 | const Refinery = lazy(() => import('./Refinery.js')); |
12 | |||
13 | export default function App({ | ||
14 | rootStore, | ||
15 | }: { | ||
16 | rootStore: RootStore; | ||
17 | }): JSX.Element { | ||
11 | return ( | 18 | return ( |
12 | // @ts-expect-error -- notistack has problems with `exactOptionalPropertyTypes | 19 | <StrictMode> |
13 | <SnackbarProvider TransitionComponent={Grow}> | 20 | <RootStoreProvider rootStore={rootStore}> |
14 | <UpdateNotification /> | 21 | <ThemeProvider> |
15 | <Stack direction="column" height="100vh" overflow="auto"> | 22 | <CssBaseline enableColorScheme /> |
16 | <TopBar /> | 23 | <WindowControlsOverlayColor /> |
17 | <EditorPane /> | 24 | <Box height="100vh" overflow="auto"> |
18 | </Stack> | 25 | <Suspense fallback={<Loading />}> |
19 | </SnackbarProvider> | 26 | <Refinery /> |
27 | </Suspense> | ||
28 | </Box> | ||
29 | </ThemeProvider> | ||
30 | </RootStoreProvider> | ||
31 | </StrictMode> | ||
20 | ); | 32 | ); |
21 | } | 33 | } |