diff options
| author | crupest <crupest@outlook.com> | 2020-07-26 15:02:55 +0800 |
|---|---|---|
| committer | crupest <crupest@outlook.com> | 2020-07-26 15:02:55 +0800 |
| commit | f5d10683a1edeba4dabe148ff7aa682c044f7496 (patch) | |
| tree | d8f7edae96baa26823dee80ccc9329a23ac04c3c /Timeline/ClientApp/src/app/App.tsx | |
| parent | 7753c9cad23b06c2acdd908a5a7cc3863bfa6b61 (diff) | |
| download | timeline-f5d10683a1edeba4dabe148ff7aa682c044f7496.tar.gz timeline-f5d10683a1edeba4dabe148ff7aa682c044f7496.tar.bz2 timeline-f5d10683a1edeba4dabe148ff7aa682c044f7496.zip | |
Merge front end repo
Diffstat (limited to 'Timeline/ClientApp/src/app/App.tsx')
| -rw-r--r-- | Timeline/ClientApp/src/app/App.tsx | 84 |
1 files changed, 84 insertions, 0 deletions
diff --git a/Timeline/ClientApp/src/app/App.tsx b/Timeline/ClientApp/src/app/App.tsx new file mode 100644 index 00000000..03775275 --- /dev/null +++ b/Timeline/ClientApp/src/app/App.tsx @@ -0,0 +1,84 @@ +import React from 'react';
+import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
+import { hot } from 'react-hot-loader/root';
+
+import AppBar from './common/AppBar';
+import LoadingPage from './common/LoadingPage';
+import Home from './home/Home';
+import Login from './user/Login';
+import Settings from './settings/Settings';
+import About from './about/About';
+import User from './user/User';
+import TimelinePage from './timeline/TimelinePage';
+import AlertHost from './common/AlertHost';
+
+import { userService, useRawUser } from './data/user';
+
+const NoMatch: React.FC = () => {
+ return (
+ <>
+ <AppBar />
+ <div style={{ height: 56 }} />
+ <div>Ah-oh, 404!</div>
+ </>
+ );
+};
+
+const LazyAdmin = React.lazy(() =>
+ import(/* webpackChunkName: "admin" */ './admin/Admin')
+);
+
+const App: React.FC = () => {
+ const user = useRawUser();
+
+ React.useEffect(() => {
+ void userService.checkLoginState();
+ }, []);
+
+ let body;
+ if (user === undefined) {
+ body = <LoadingPage />;
+ } else {
+ body = (
+ <Router>
+ <Switch>
+ <Route exact path="/">
+ <Home />
+ </Route>
+ <Route exact path="/login">
+ <Login />
+ </Route>
+ <Route path="/settings">
+ <Settings />
+ </Route>
+ <Route path="/about">
+ <About />
+ </Route>
+ <Route path="/timelines/:name">
+ <TimelinePage />
+ </Route>
+ <Route path="/users/:username">
+ <User />
+ </Route>
+ {user && user.administrator && (
+ <Route path="/admin">
+ <LazyAdmin user={user} />
+ </Route>
+ )}
+ <Route>
+ <NoMatch />
+ </Route>
+ </Switch>
+ </Router>
+ );
+ }
+
+ return (
+ <React.Suspense fallback={<LoadingPage />}>
+ {body}
+ <AlertHost />
+ </React.Suspense>
+ );
+};
+
+export default hot(App);
|