PrivateRoute

frontend/src/components/PrivateRoute/index.tsx

@@ -0,0 +1,25 @@
+import { Redirect, Route } from 'react-router-dom';
+import { isAuthenticated } from 'util/requests';
+
+
+type Props = {
+  children: React.ReactNode;
+  path: string;
+};
+
+
+const PrivateRoute = ({ children, path }: Props) => {
+
+
+  return (
+    <Route
+      path={path}
+      render={() =>
+        isAuthenticated() ? children : <Redirect to="/admin/auth/login" />
+      }
+    />
+  );
+};
+
+
+export default PrivateRoute;

frontend/src/pages/Admin/index.tsx

@@ -1,23 +1,24 @@
-import { Route, Switch } from "react-router-dom";
+import { Switch } from "react-router-dom";
 import Navbar from "./Navbar";
 import './styles.css'
 import User from "./User";
+import PrivateRoute from "components/PrivateRoute";
 
 const Admin = () => {
   return (
     <div className="admin-container">
       <Navbar />
       <div className="admin-content">
         <Switch>
-          <Route path="/admin/products">
+          <PrivateRoute path="/admin/products">
             <h1>Product CRUD</h1>
-          </Route>
-          <Route path="/admin/categories">
+          </PrivateRoute>
+          <PrivateRoute path="/admin/categories">
             <h1>Product CRUD</h1>
-          </Route>
-          <Route path="/admin/users">
+          </PrivateRoute>
+          <PrivateRoute path="/admin/users">
             <User />
-          </Route>
+          </PrivateRoute>
         </Switch>
       </div>
     </div>