Completely added dark mode functionality

client/src/App.jsx

@@ -1,5 +1,6 @@
 import React from "react";
 import { UserContextProvider } from "./Context/UserContext";
+import { ThemeProvider } from "./Context/ThemeContext";
 import { Analytics } from "@vercel/analytics/react";
 import { SpeedInsights } from "@vercel/speed-insights/react";
 import { Routes, Route } from "react-router";
@@ -19,28 +20,33 @@ import MasterPage from "./MasterPage";
 
 function App() {
   return (
-    <UserContextProvider>
-          <Routes>
-            <Route path="/login" element={<Login />} />
-            <Route path="/signup" element={<Signup />} />
-            <Route path="/verifyOtp" element={<VerifyOtp />} />
-
-            <Route path="/" element={<MasterPage/>}>
-              <Route index element={<Dashboard />}/>
-              <Route path="/notifications" element={<Notifcation />} />
-              <Route path="/questionNotifications" element={<QuestionNotifcation />} />
-              <Route path="/upload/:requestId" element={<UploadPage />} />
-              <Route path="/answer/:requestId" element={<AnswerPage />} />
-              <Route path="/upload" element={<UploadPage />} />
-              <Route path="/question" element={<QuestionPage />} />  
-              <Route path="/request" element={<RequestPage />} />
-              <Route path="/leaderboard" element={<LeaderBoard />} />
-              <Route path="/settings" element={<Settings />} />
-            </Route>
-          </Routes>
-          <Analytics />
-          <SpeedInsights />
-    </UserContextProvider>
+    <ThemeProvider>
+      <UserContextProvider>
+        <Routes>
+          <Route path="/login" element={<Login />} />
+          <Route path="/signup" element={<Signup />} />
+          <Route path="/verifyOtp" element={<VerifyOtp />} />
+
+          <Route path="/" element={<MasterPage />}>
+            <Route index element={<Dashboard />} />
+            <Route path="/notifications" element={<Notifcation />} />
+            <Route
+              path="/questionNotifications"
+              element={<QuestionNotifcation />}
+            />
+            <Route path="/upload/:requestId" element={<UploadPage />} />
+            <Route path="/answer/:requestId" element={<AnswerPage />} />
+            <Route path="/upload" element={<UploadPage />} />
+            <Route path="/question" element={<QuestionPage />} />
+            <Route path="/request" element={<RequestPage />} />
+            <Route path="/leaderboard" element={<LeaderBoard />} />
+            <Route path="/settings" element={<Settings />} />
+          </Route>
+        </Routes>
+        <Analytics />
+        <SpeedInsights />
+      </UserContextProvider>
+    </ThemeProvider>
   );
 }
 

client/src/Context/ThemeContext.jsx

@@ -0,0 +1,20 @@
+import React, { createContext, useState, useContext } from 'react';
+
+const ThemeContext = createContext();
+
+export const useTheme = () => useContext(ThemeContext);
+
+export const ThemeProvider = ({ children }) => {
+  const [isDarkMode, setIsDarkMode] = useState(false);
+
+  const toggleTheme = () => {
+    setIsDarkMode(prevMode => !prevMode);
+    document.documentElement.classList.toggle('dark');
+  };
+
+  return (
+    <ThemeContext.Provider value={{ isDarkMode, toggleTheme }}>
+      {children}
+    </ThemeContext.Provider>
+  );
+};

client/src/Context/UserContext.jsx

@@ -1,18 +1,19 @@
 import { createContext, useEffect, useState } from "react";
 import axios from "axios";
 import { Loader } from "../components/Loader/Loader";
-import { useNavigate } from "react-router-dom";
+import { useLocation, useNavigate } from "react-router-dom";
 
 export const UserContext = createContext();
 
 export const UserContextProvider = ({ children }) => {
   const [user, setUser] = useState(null);
   const navigate = useNavigate();
   const [loading, setLoading] = useState(true);
+  const location = useLocation();
 
   const token = localStorage.getItem("token");
 
-  if (!token) {
+  if (!token && location.pathname !== "/signup") {
     navigate("/login");
   }