Create home and 404 route

src/ui/routes/HomeRoute.tsx

@@ -0,0 +1,3 @@
+export function HomeRoute() {
+	return <p style={{ color: "white" }}>Welcome to Comunic Console!</p>;
+}

src/ui/routes/MainRoute.tsx

@@ -25,6 +25,9 @@ import React from "react";
 import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
 import { AccountHelper } from "../../helpers/AccountHelper";
 import CloseSharpIcon from "@material-ui/icons/CloseSharp";
+import { NotFoundRoute } from "./NotFoundRoute";
+import { HomeRoute } from "./HomeRoute";
+import { Home, Person } from "@material-ui/icons";
 
 const useStyles = makeStyles((theme) => ({
 	root: {
@@ -83,21 +86,15 @@ function Menu() {
 			<List component="nav" aria-label="main mailbox folders">
 				<ListItem button>
 					<ListItemIcon>
-						<InboxIcon />
+						<Home />
 					</ListItemIcon>
-					<ListItemText primary="Inbox" />
+					<ListItemText primary="Home" />
 				</ListItem>
 				<ListItem button>
 					<ListItemIcon>
-						<DraftsIcon />
+						<Person />
 					</ListItemIcon>
-					<ListItemText primary="Drafts" />
-				</ListItem>
-			</List>
-			<Divider />
-			<List component="nav" aria-label="secondary mailbox folders">
-				<ListItem button>
-					<ListItemText primary="Trash" />
+					<ListItemText primary="My account" />
 				</ListItem>
 			</List>
 		</div>
@@ -153,14 +150,14 @@ export function MainRoute() {
 					<Menu></Menu>
 				</Paper>
 
-				<div>
+				<div style={{ flex: "1", padding: "50px" }}>
 					<Switch>
+						<Route exact path="/">
+							<HomeRoute></HomeRoute>
+						</Route>
+
 						<Route path="*">
-							<p>yes</p>
-							<p>yes</p>
-							<p>yes</p>
-							<p>yes</p>
-							<p>yes</p>Not found
+							<NotFoundRoute></NotFoundRoute>
 						</Route>
 					</Switch>
 				</div>

src/ui/routes/NotFoundRoute.tsx

@@ -0,0 +1,24 @@
+/**
+ * 404 Error page
+ *
+ * @author Pierre Hubert
+ */
+
+import { Typography } from "@material-ui/core";
+
+export function NotFoundRoute() {
+	return (
+		<div
+			style={{
+				height: "100%",
+				display: "flex",
+				justifyContent: "center",
+				alignItems: "center",
+			}}
+		>
+			<Typography variant="h3" color="primary">
+				404 Not found
+			</Typography>
+		</div>
+	);
+}