Added React global state + role based security sample app

1 files changed, 36 insertions, 0 deletions

diff --git a/react/08-auth-with-context/src/App.jsx b/react/08-auth-with-context/src/App.jsx
new file mode 100644
index 0000000..aedd87e
--- /dev/null
+++ b/react/08-auth-with-context/src/App.jsx
@@ -0,0 +1,36 @@
+import { Routes, Route, Navigate } from "react-router";
+
+import Navbar from "./components/Navbar";
+import HomePage from "./pages/HomePage"
+import AboutPage from "./pages/AboutPage"
+import AuthLayout from "./features/auth/layouts/AuthLayout"
+import Login from "./features/auth/components/Login"
+import Register from "./features/auth/components/Register"
+import PostList from "./features/posts/components/PostList"
+import AdminPage from "./pages/AdminPage";
+import { useAuth } from "./contexts/AuthContext";
+
+function App() {
+  const { isAdmin } = useAuth();
+
+  return (
+    <div className="app">
+      <Navbar/>
+
+      <Routes>
+        <Route index element={<HomePage />} />
+        <Route path="about" element={<AboutPage />} />
+        <Route path="posts" element={<PostList />} />
+
+        <Route path="admin" element={isAdmin() ? <AdminPage /> : <Navigate to="/" />} />
+
+        <Route element={<AuthLayout />}>
+          <Route path="login" element={<Login />} />
+          <Route path="register" element={<Register />} />
+        </Route>
+      </Routes>
+    </div>
+  )
+}
+
+export default App