53 lines
1.7 KiB
TypeScript
53 lines
1.7 KiB
TypeScript
import loadable from '@loadable/component';
|
|
import { ThemeProvider } from '@mui/material/styles';
|
|
import { History } from '@remix-run/router';
|
|
import React from 'react';
|
|
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
|
import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
|
|
|
|
import StableApp from 'apps/stable/App';
|
|
import AppHeader from 'components/AppHeader';
|
|
import Backdrop from 'components/Backdrop';
|
|
import { HistoryRouter } from 'components/router/HistoryRouter';
|
|
import { ApiProvider } from 'hooks/useApi';
|
|
import { WebConfigProvider } from 'hooks/useWebConfig';
|
|
import theme from 'themes/theme';
|
|
|
|
const ExperimentalApp = loadable(() => import('./apps/experimental/App'));
|
|
|
|
const queryClient = new QueryClient();
|
|
|
|
const RootAppLayout = () => {
|
|
const layoutMode = localStorage.getItem('layout');
|
|
const isExperimentalLayout = layoutMode === 'experimental';
|
|
|
|
return (
|
|
<>
|
|
<Backdrop />
|
|
<AppHeader isHidden={isExperimentalLayout} />
|
|
|
|
{
|
|
isExperimentalLayout ?
|
|
<ExperimentalApp /> :
|
|
<StableApp />
|
|
}
|
|
</>
|
|
);
|
|
};
|
|
|
|
const RootApp = ({ history }: { history: History }) => (
|
|
<QueryClientProvider client={queryClient}>
|
|
<ApiProvider>
|
|
<WebConfigProvider>
|
|
<ThemeProvider theme={theme}>
|
|
<HistoryRouter history={history}>
|
|
<RootAppLayout />
|
|
</HistoryRouter>
|
|
</ThemeProvider>
|
|
</WebConfigProvider>
|
|
</ApiProvider>
|
|
<ReactQueryDevtools initialIsOpen={false} />
|
|
</QueryClientProvider>
|
|
);
|
|
|
|
export default RootApp;
|