Découpage du code et extraction des sourcemaps
This commit is contained in:
parent
85008d3265
commit
f752865d33
@ -1,10 +1,5 @@
|
||||
import React, { FunctionComponent, useState, useEffect } from 'react';
|
||||
import React, { FunctionComponent, useState, useEffect, Suspense } from 'react';
|
||||
import { BrowserRouter, Route, Redirect, Switch } from "react-router-dom";
|
||||
import { HomePage } from './HomePage/HomePage';
|
||||
import { ProfilePage } from './ProfilePage/ProfilePage';
|
||||
import { WorkgroupPage } from './WorkgroupPage/WorkgroupPage';
|
||||
import { DecisionSupportFilePage } from './DecisionSupportFilePage/DecisionSupportFilePage';
|
||||
import { DashboardPage } from './DashboardPage/DashboardPage';
|
||||
import { useUserProfile } from '../gql/queries/profile';
|
||||
import { LoggedInContext, getSavedLoggedIn, saveLoggedIn } from '../hooks/useLoggedIn';
|
||||
import { PrivateRoute } from './PrivateRoute';
|
||||
@ -12,16 +7,21 @@ import { useKonamiCode } from '../hooks/useKonamiCode';
|
||||
import { Modal } from './Modal';
|
||||
import { createClient } from '../util/apollo';
|
||||
import { ApolloProvider } from '@apollo/client';
|
||||
import { LogoutPage } from './LogoutPage';
|
||||
import { UnauthorizedPage } from './UnauthorizedPage/UnauthorizedPage';
|
||||
import { ConferencePage } from './ConferencePage/ConferencePage';
|
||||
import { AppLoader } from './AppLoader';
|
||||
|
||||
const LazyHomePage = React.lazy(() => import('./HomePage/HomePage'));
|
||||
const LazyDashboardPage = React.lazy(() => import('./DashboardPage/DashboardPage'));
|
||||
const LazyUnauthorizedPage = React.lazy(() => import('./UnauthorizedPage/UnauthorizedPage'));
|
||||
const LazyConferencePage = React.lazy(() => import('./ConferencePage/ConferencePage'));
|
||||
const LazyDecisionSupportFilePage = React.lazy(() => import('./DecisionSupportFilePage/DecisionSupportFilePage'));
|
||||
const LazyProfilePage = React.lazy(() => import('./ProfilePage/ProfilePage'));
|
||||
const LazyWorkgroupPage = React.lazy(() => import('./WorkgroupPage/WorkgroupPage'));
|
||||
const LazyLogoutPage = React.lazy(() => import('./LogoutPage'));
|
||||
|
||||
export interface AppProps {
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
export const App: FunctionComponent<AppProps> = () => {
|
||||
const [ loggedIn, setLoggedIn ] = useState(getSavedLoggedIn());
|
||||
|
||||
@ -37,35 +37,37 @@ export const App: FunctionComponent<AppProps> = () => {
|
||||
useKonamiCode(() => setShowBoneyM(true));
|
||||
|
||||
return (
|
||||
<ApolloProvider client={client}>
|
||||
<LoggedInContext.Provider value={loggedIn}>
|
||||
<UserSessionCheck setLoggedIn={setLoggedIn} />
|
||||
<BrowserRouter>
|
||||
<Switch>
|
||||
<Route path="/" exact component={HomePage} />
|
||||
<Route path="/unauthorized" exact component={UnauthorizedPage} />
|
||||
<PrivateRoute path="/profile" exact component={ProfilePage} />
|
||||
<PrivateRoute path="/conference" exact component={ConferencePage} />
|
||||
<PrivateRoute path="/workgroups/:id" exact component={WorkgroupPage} />
|
||||
<PrivateRoute path="/decisions/:id" component={DecisionSupportFilePage} />
|
||||
<PrivateRoute path="/dashboard" exact component={DashboardPage} />
|
||||
<PrivateRoute path="/logout" exact component={LogoutPage} />
|
||||
<Route component={() => <Redirect to="/" />} />
|
||||
</Switch>
|
||||
</BrowserRouter>
|
||||
{
|
||||
showBoneyM ?
|
||||
<Modal active={true} showCloseButton={true} onClose={() => setShowBoneyM(false)}>
|
||||
<iframe width={560} height={315}
|
||||
frameBorder={0}
|
||||
allowFullScreen={true}
|
||||
src="https://www.youtube.com/embed/uVzT5QEEQ2c?autoplay=1" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture">
|
||||
</iframe>
|
||||
</Modal> :
|
||||
null
|
||||
}
|
||||
</LoggedInContext.Provider>
|
||||
</ApolloProvider>
|
||||
<Suspense fallback={<AppLoader />}>
|
||||
<ApolloProvider client={client}>
|
||||
<LoggedInContext.Provider value={loggedIn}>
|
||||
<UserSessionCheck setLoggedIn={setLoggedIn} />
|
||||
<BrowserRouter>
|
||||
<Switch>
|
||||
<Route path="/" exact component={LazyHomePage} />
|
||||
<Route path="/unauthorized" exact component={LazyUnauthorizedPage} />
|
||||
<PrivateRoute path="/profile" exact component={LazyProfilePage} />
|
||||
<PrivateRoute path="/conference" exact component={LazyConferencePage} />
|
||||
<PrivateRoute path="/workgroups/:id" exact component={LazyWorkgroupPage} />
|
||||
<PrivateRoute path="/decisions/:id" component={LazyDecisionSupportFilePage} />
|
||||
<PrivateRoute path="/dashboard" exact component={LazyDashboardPage} />
|
||||
<PrivateRoute path="/logout" exact component={LazyLogoutPage} />
|
||||
<Route component={() => <Redirect to="/" />} />
|
||||
</Switch>
|
||||
</BrowserRouter>
|
||||
{
|
||||
showBoneyM ?
|
||||
<Modal active={true} showCloseButton={true} onClose={() => setShowBoneyM(false)}>
|
||||
<iframe width={560} height={315}
|
||||
frameBorder={0}
|
||||
allowFullScreen={true}
|
||||
src="https://www.youtube.com/embed/uVzT5QEEQ2c?autoplay=1" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture">
|
||||
</iframe>
|
||||
</Modal> :
|
||||
null
|
||||
}
|
||||
</LoggedInContext.Provider>
|
||||
</ApolloProvider>
|
||||
</Suspense>
|
||||
);
|
||||
}
|
||||
|
||||
|
7
client/src/components/AppLoader.tsx
Normal file
7
client/src/components/AppLoader.tsx
Normal file
@ -0,0 +1,7 @@
|
||||
import React, { FunctionComponent } from "react";
|
||||
|
||||
export const AppLoader:FunctionComponent = () => {
|
||||
return (
|
||||
<div className="loader"></div>
|
||||
)
|
||||
}
|
@ -110,6 +110,8 @@ export const ConferencePage:FunctionComponent<ConferencePageProps> = () => {
|
||||
);
|
||||
}
|
||||
|
||||
export default ConferencePage;
|
||||
|
||||
export interface UserCardProps {
|
||||
nickname: string
|
||||
email: string
|
||||
|
@ -12,4 +12,6 @@ export function DashboardPage() {
|
||||
</div>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default DashboardPage;
|
@ -159,4 +159,6 @@ export const DecisionSupportFilePage: FunctionComponent<DecisionSupportFilePageP
|
||||
</div>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
export default DecisionSupportFilePage;
|
@ -18,4 +18,6 @@ export function HomePage() {
|
||||
<WelcomeContent />
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default HomePage;
|
@ -12,4 +12,6 @@ export const LogoutPage: FunctionComponent<LogoutPageProps> = () => {
|
||||
window.location.replace(Config.logoutURL);
|
||||
}, []);
|
||||
return null;
|
||||
};
|
||||
};
|
||||
|
||||
export default LogoutPage;
|
@ -39,4 +39,6 @@ export function ProfilePage() {
|
||||
</div>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default ProfilePage;
|
@ -34,4 +34,6 @@ export const UnauthorizedPage:FunctionComponent<UnauthorizedPageProps> = () => {
|
||||
</div>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default UnauthorizedPage;
|
@ -150,4 +150,6 @@ export function WorkgroupPage() {
|
||||
</div>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default WorkgroupPage;
|
@ -1,7 +1,7 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"module": "es6",
|
||||
"module": "es2020",
|
||||
"lib": ["dom", "es6"],
|
||||
"moduleResolution": "node",
|
||||
"jsx": "react",
|
||||
|
@ -11,7 +11,7 @@ const env = process.env;
|
||||
module.exports = {
|
||||
mode: `${env.NODE_ENV ? env.NODE_ENV : 'production'}`,
|
||||
entry: './src/index.tsx',
|
||||
devtool: 'inline-source-map',
|
||||
devtool: env.NODE_ENV === 'production' ? 'source-map' : 'eval-source-map',
|
||||
output: {
|
||||
filename: '[name].[contenthash].js',
|
||||
path: path.join(__dirname, 'dist')
|
||||
|
Loading…
Reference in New Issue
Block a user