41 lines
1.3 KiB
TypeScript
41 lines
1.3 KiB
TypeScript
import React, { memo, useMemo } from 'react';
|
|
import ThemeCreate from '@Base/themes/ThemeCreate';
|
|
import ThemeProvider from '@Base/themes/ThemeProvider';
|
|
import ThemeStylesProvider from '@Base/themes/ThemeStylesProvider';
|
|
import useMappedState from '@Hooks/useMappedState';
|
|
import MainAppView from '@Components/Layer/MainAppView';
|
|
import MainAppCheckView from '@Components/Layer/MainAppCheckView';
|
|
import ModalDialog from '@Components/Common/Modals/ModalDialog';
|
|
import ModalConfirm from '@Components/Common/Modals/ModalConfirm';
|
|
import { AppProps } from './types';
|
|
|
|
const App: React.FC<AppProps> = ({
|
|
Router,
|
|
routerProps,
|
|
}): React.ReactElement => {
|
|
/* Global & Local State */
|
|
const storeUser = useMappedState((state) => state.user);
|
|
const storeGlobal = useMappedState((state) => state.global);
|
|
/* Views */
|
|
const RenderMainView = useMemo(() => {
|
|
if (storeUser.userAuthCheck) {
|
|
return <MainAppView />;
|
|
}
|
|
return <MainAppCheckView />;
|
|
}, [storeUser.userAuthCheck]);
|
|
/* Main */
|
|
return (
|
|
<ThemeStylesProvider injectFirst>
|
|
<ThemeProvider theme={ThemeCreate(storeGlobal.globalTheme)}>
|
|
<Router {...routerProps}>
|
|
{RenderMainView}
|
|
<ModalDialog />
|
|
<ModalConfirm />
|
|
</Router>
|
|
</ThemeProvider>
|
|
</ThemeStylesProvider>
|
|
);
|
|
};
|
|
|
|
export default memo(App);
|