From 7d5e2d664c75a9c2593d35843e48a5c72d3d7f42 Mon Sep 17 00:00:00 2001
From: Harsh Wardhan <harshkashyap1221@gmail.com>
Date: Wed, 17 Jun 2026 23:01:57 +0530
Subject: [PATCH] Refactor routing and component imports in App.js

---
 client/src/App.js | 154 ++++++++++++++++++++++++----------------------
 1 file changed, 80 insertions(+), 74 deletions(-)

diff --git a/client/src/App.js b/client/src/App.js
index b1205b0..f0d08ce 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -1,8 +1,16 @@
 import React from "react";
 import { ThemeProvider } from "./theme/ThemeProvider";
-import { BrowserRouter as Router, Routes, Route, useLocation } from "react-router-dom";
+import {
+  BrowserRouter as Router,
+  Routes,
+  Route,
+  useLocation,
+} from "react-router-dom";
+
 import { AuthProvider } from "./context/AuthContext";
 import Navbar from "./components/Navbar";
+import ScrollToTop from "./components/scrolltotop";
+import ProtectedRoute from "./components/ProtectedRoute";
 import Home from "./pages/Home";
 import Syllabus from "./pages/Syllabus";
 import Notes from "./pages/Notes";
@@ -14,92 +22,85 @@ import Contact from "./pages/Contact";
 import Analytics from "./pages/Analytics";
 import Faq from "./pages/Faq";
 import Contribute from "./pages/Contribute";
-import ScrollToTop from "./components/scrolltotop";
 import MindMapEditor from "./pages/MindMapEditor";
-import Profile from "./pages/Profile.js";
+import Profile from "./pages/Profile";
 import SubmitFeedback from "./pages/SubmitFeedback";
 import Todo from "./pages/Todo";
 import Login from "./pages/Login";
 import Register from "./pages/Register";
-import ProtectedRoute from "./components/ProtectedRoute";
+import NotFound from "./pages/NotFound";
+
+const PageLayout = ({ children }) => (
+  <div style={{ padding: "2rem" }}>
+    {children}
+  </div>
+);
+
+const ProtectedPage = ({ children }) => (
+  <ProtectedRoute>
+    <PageLayout>{children}</PageLayout>
+  </ProtectedRoute>
+);
+
+const protectedRoutes = [
+  { path: "/tasks", element: <Todo /> },
+  { path: "/syllabus", element: <Syllabus /> },
+  { path: "/notes", element: <Notes /> },
+  { path: "/pyqs", element: <PYQs /> },
+  { path: "/analytics", element: <Analytics /> },
+  { path: "/faq", element: <Faq /> },
+  { path: "/feedback", element: <Feedback /> },
+  { path: "/contribute", element: <Contribute /> },
+  { path: "/mindmap", element: <MindMapEditor /> },
+  { path: "/contact", element: <Contact /> },
+  { path: "/profile", element: <Profile /> },
+  { path: "/feedback/submit", element: <SubmitFeedback /> },
+];
 
 const App = () => {
   return (
     <ThemeProvider>
       <AuthProvider>
         <Router>
-          {/* Navbar is hidden on login/register via CSS — it checks the route */}
           <NavbarWrapper />
           <ScrollToTop />
+
           <Routes>
-            {/* ── Public routes ── */}
-            <Route path="/login"    element={<Login />}    />
+            <Route path="/" element={<Home />} />
+            <Route path="/login" element={<Login />} />
             <Route path="/register" element={<Register />} />
-            <Route path="/privacy"  element={<><div style={{ padding: "2rem" }}><Privacy /></div></>} />
-            <Route path="/about"    element={<><div style={{ padding: "2rem" }}><About /></div></>} />
 
-            {/* ── Public landing page ── */}
-            <Route path="/" element={<Home />} />
-            <Route path="/tasks" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Todo /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/syllabus" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Syllabus /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/notes" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Notes /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/pyqs" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><PYQs /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/analytics" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Analytics /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/faq" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Faq /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/feedback" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Feedback /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/contribute" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Contribute /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/mindmap" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><MindMapEditor /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/contact" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Contact /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/profile" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><Profile /></div>
-              </ProtectedRoute>
-            } />
-            <Route path="/feedback/submit" element={
-              <ProtectedRoute>
-                <div style={{ padding: "2rem" }}><SubmitFeedback /></div>
-              </ProtectedRoute>
-            } />
+            <Route
+              path="/privacy"
+              element={
+                <PageLayout>
+                  <Privacy />
+                </PageLayout>
+              }
+            />
+
+            <Route
+              path="/about"
+              element={
+                <PageLayout>
+                  <About />
+                </PageLayout>
+              }
+            />
+
+            {protectedRoutes.map((route) => (
+              <Route
+                key={route.path}
+                path={route.path}
+                element={
+                  <ProtectedPage>
+                    {route.element}
+                  </ProtectedPage>
+                }
+              />
+            ))}
+
+            <Route path="*" element={<NotFound />} />
           </Routes>
         </Router>
       </AuthProvider>
@@ -107,11 +108,16 @@ const App = () => {
   );
 };
 
-// Hide Navbar on login/register pages
 const NavbarWrapper = () => {
   const { pathname } = useLocation();
-  if (pathname === "/login" || pathname === "/register") return null;
+
+  const hiddenRoutes = ["/login", "/register"];
+
+  if (hiddenRoutes.includes(pathname)) {
+    return null;
+  }
+
   return <Navbar />;
 };
 
-export default App;
\ No newline at end of file
+export default App;