feat(nav): implement tab-based navigation system

src/App.tsx

@@ -1,28 +1,67 @@
-import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";
-import { Login } from "./pages/login";
-import { StudentDashboard } from "./pages/StudentDashboard";
+import {
+  createBrowserRouter,
+  Navigate,
+  RouterProvider,
+} from "react-router-dom";
+import { Login } from "./pages/auth/Login";
+import { Home } from "./pages/student/Home";
+import { Practice } from "./pages/student/Practice";
+import { Rewards } from "./pages/student/Rewards";
+import { Profile } from "./pages/student/Profile";
+import { Progress } from "./pages/student/Progress";
 import { ProtectedRoute } from "./components/ProtectedRoute";
+import { StudentLayout } from "./pages/student/StudentLayout";
 
 function App() {
-  return (
-    <BrowserRouter>
-      <Routes>
-        <Route path="/login" element={<Login />} />
+  const router = createBrowserRouter([
+    {
+      path: "/login",
+      element: <Login />,
+    },
+    {
+      path: "/student",
+      element: <ProtectedRoute />,
+      children: [
+        {
+          element: <StudentLayout />,
+          children: [
+            {
+              path: "home",
+              element: <Home />,
+            },
+            {
+              path: "practice",
+              element: <Practice />,
+            },
+            {
+              path: "progress",
+              element: <Progress />,
+            },
+            {
+              path: "rewards",
+              element: <Rewards />,
+            },
+            {
+              path: "profile",
+              element: <Profile />,
+            },
+            // more student subroutes here
+          ],
+        },
+        // Add more subroutes here as needed
+      ],
+    },
+    {
+      path: "/",
+      element: <Navigate to="/student" replace />,
+    },
+    {
+      path: "*",
+      element: <Navigate to="/student" replace />,
+    },
+  ]);
 
-        {/* Protected Routes */}
-        <Route path="/student" element={<ProtectedRoute />}>
-          <Route index element={<StudentDashboard />} />
-          {/* Add more subroutes here as needed */}
-        </Route>
-
-        {/* Redirect root to student */}
-        <Route path="/" element={<Navigate to="/student" replace />} />
-
-        {/* Catch all - redirect to student */}
-        <Route path="*" element={<Navigate to="/student" replace />} />
-      </Routes>
-    </BrowserRouter>
-  );
+  return <RouterProvider router={router} />;
 }
 
 export default App;