updated rendering of the router

Signed-off-by: Anneshu Nag <[email protected]>
Bitbox-Connect · Nov 6, 2024 · bb7e0e4 · bb7e0e4
1 parent 4291092
commit bb7e0e4
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 38 deletions.
diff --git a/client/src/App.jsx b/client/src/App.jsx
@@ -3,7 +3,7 @@ import { modeAtom } from "./atom/Atom";
 import { useEffect, useState } from "react";
 import "./App.css";
 import "./index.css";
-import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
+import { Routes, Route } from "react-router-dom";
 import PropTypes from "prop-types";
 import LoadingBar from "react-top-loading-bar";
 import About from "./component/About";
@@ -40,7 +40,6 @@ import Collab from "./component/Collab";
 import FAQ from "./component/Faq";
 import CreateBlog from "./component/CreateBlog";
 
-// Main Layout Component
 const Layout = ({ children, mode, setProgress, toggleMode, showAlert }) => {
   return (
     <div className="h-full w-full">
@@ -121,39 +120,37 @@ function App() {
       <Cursor />
       <ProjectState>
         <ProfileState>
-          <Router>
-            <LoadingBar color="blue" progress={progress} onLoaderFinished={() => setProgress(0)} />
-            <div className="alert-container"> <Alert alert={alert} /> </div>
-            <ProgressBar mode={mode} />
-            <ScrollTop />
-            <Layout mode={mode} setProgress={setProgress} toggleMode={toggleMode} showAlert={showAlert} >
-              <Routes>
-                <Route exact path="/" element={<Home mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/contributors" element={<Contributors mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/discussion" element={<Discussion mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/community" element={<Community mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/about" element={<About mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/feedback" element={<Feedback mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/blog" element={<BlogPage mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/faq" element={<Faq mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/collab" element={<Collab mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/myprofile' element={<MyProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/editprofile' element={<EditProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path="/login" element={<Login mode={mode} setProgress={setProgress} showAlert={showAlert} loggedin={islogged} setloggedin={setloggedin} />} />
-                <Route exact path='/signup' element={<Signup mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/forgot-password' element={<ForgotPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/reset-password' element={<ResetPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/codeofconduct' element={<CodeOfConduct mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/contactus' element={<ContactUs mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/privacypolicy' element={<PrivacyPolicy mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/termofuse' element={<TermOfUse mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/FAQ' element={<FAQ mode={mode} />} />
-                <Route exact path='/createBlogPost' element={<CreateBlog />} />
-                <Route exact path='/read-more-blog/:id' element={<ReadMoreBlog mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
-                <Route exact path='/*' element={<NotFound />} />
-              </Routes>
-            </Layout>
-          </Router>
+          <LoadingBar color="blue" progress={progress} onLoaderFinished={() => setProgress(0)} />
+          <div className="alert-container"> <Alert alert={alert} /> </div>
+          <ProgressBar mode={mode} />
+          <ScrollTop />
+          <Layout mode={mode} setProgress={setProgress} toggleMode={toggleMode} showAlert={showAlert} >
+            <Routes>
+              <Route exact path="/" element={<Home mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/contributors" element={<Contributors mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/discussion" element={<Discussion mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/community" element={<Community mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/about" element={<About mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/feedback" element={<Feedback mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/blog" element={<BlogPage mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/faq" element={<Faq mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/collab" element={<Collab mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/myprofile' element={<MyProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/editprofile' element={<EditProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path="/login" element={<Login mode={mode} setProgress={setProgress} showAlert={showAlert} loggedin={islogged} setloggedin={setloggedin} />} />
+              <Route exact path='/signup' element={<Signup mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/forgot-password' element={<ForgotPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/reset-password' element={<ResetPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/codeofconduct' element={<CodeOfConduct mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/contactus' element={<ContactUs mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/privacypolicy' element={<PrivacyPolicy mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/termofuse' element={<TermOfUse mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/FAQ' element={<FAQ mode={mode} />} />
+              <Route exact path='/createBlogPost' element={<CreateBlog />} />
+              <Route exact path='/read-more-blog/:id' element={<ReadMoreBlog mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
+              <Route exact path='/*' element={<NotFound />} />
+            </Routes>
+          </Layout>
         </ProfileState>
       </ProjectState>
     </div>

diff --git a/client/src/main.jsx b/client/src/main.jsx
@@ -1,5 +1,5 @@
 /** @format */
-
+import { BrowserRouter } from "react-router-dom";
 import ReactDOM from "react-dom/client";
 import App from "./App.jsx";
 import "./index.css";
@@ -8,10 +8,10 @@ import { AuthProvider } from "./contexts/authContext/index.jsx";
 // import Alert from "./component/Alert";
 
 ReactDOM.createRoot(document.getElementById("root")).render(
-  <>
+  <BrowserRouter>
     <AuthProvider>
       <App />
       <Toaster />
     </AuthProvider>
-  </>
+    </BrowserRouter>
 );