improvement: start moving routes to custom route

frontend/src/routes/Route.js

@@ -0,0 +1,45 @@
+import React from "react";
+import { BrowserRouter, Route, Switch, Redirect } from "react-router-dom";
+
+import Backdrop from "@material-ui/core/Backdrop";
+import CircularProgress from "@material-ui/core/CircularProgress";
+import { makeStyles } from "@material-ui/core/styles";
+
+import { AuthContext, AuthProvider } from "../context/Auth/AuthContext";
+
+const useStyles = makeStyles(theme => ({
+	backdrop: {
+		zIndex: theme.zIndex.drawer + 1,
+		color: "#fff",
+	},
+}));
+
+const RouteWrapper = ({ component: Component, isPrivate = false, ...rest }) => {
+	const classes = useStyles();
+	const { isAuth, loading } = useContext(AuthContext);
+
+	if (loading)
+		return (
+			<Backdrop className={classes.backdrop} open={loading}>
+				<CircularProgress color="inherit" />
+			</Backdrop>
+		);
+
+	if (!isAuth && isPrivate) {
+		return (
+			<Redirect to={{ pathname: "/login", state: { from: rest.location } }} />
+		);
+	}
+
+	if (isAuth && !isPrivate) {
+		return (
+			<Redirect
+				to={{ pathname: "/dashboard", state: { from: rest.location } }}
+			/>
+		);
+	}
+
+	return <Route {...rest} component={Component} />;
+};
+
+export default RouteWrapper;