Add Dark Mode, Password Hashing for better security , Settings Page, Policy PDF in Policy section,UI Changes

frontend/src/App.jsx

@@ -1,5 +1,6 @@
 import { createBrowserRouter, RouterProvider } from "react-router-dom";
 import React, { Suspense } from "react";
+import { ThemeProvider } from "./context/ThemeContext";
 import "./App.css";
 import { ToastContainer } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
@@ -15,7 +16,10 @@ const Applications = React.lazy(() => import("./pages/Applications/Applications"
 const Report = React.lazy(() => import("./pages/Report/Report"));
 const LoginRoot = React.lazy(() => import("./components/LoginRoot/LoginRoot"));
 const ContactUs = React.lazy(() => import("./pages/ContactUs/ContactUs"));
-const ApplicationView = React.lazy(() => import("./pages/ApplicationView/ApplicationView"));
+const ApplicationView = React.lazy(() =>
+  import("./pages/ApplicationView/ApplicationView")
+);
+const Settings = React.lazy(() => import("./pages/Settings/Settings"));
 
 import userDataLoader from "./services/userDataLoader";
 import { upsertApplicationAction } from "./services/upsertApplicationAction";
@@ -41,9 +45,14 @@ const router = createBrowserRouter([
     children: [
       { path: "dashboard", element: <Dashboard /> },
       { path: "dashboard/:status", element: <Applications /> },
-      { path: "dashboard/:status/:applicationId", element: <ApplicationView />, action: upsertApplicationAction },
+      {
+        path: "dashboard/:status/:applicationId",
+        element: <ApplicationView />,
+        action: upsertApplicationAction,
+      },
       { path: "form", element: <Form />, action: upsertApplicationAction },
       { path: "contact-us", element: <ContactUs /> },
+      { path: "settings", element: <Settings /> },
       { path: "policy", element: <Policy /> },
     ],
   },
@@ -55,8 +64,13 @@ const router = createBrowserRouter([
     children: [
       { path: "dashboard", element: <Dashboard /> },
       { path: "dashboard/:status", element: <Applications /> },
-      { path: "dashboard/:status/:applicationId", element: <ApplicationView />, action: applicationStatusAction },
+      {
+        path: "dashboard/:status/:applicationId",
+        element: <ApplicationView />,
+        action: applicationStatusAction,
+      },
       { path: "report", element: <Report /> },
+      { path: "settings", element: <Settings /> },
       { path: "policy", element: <Policy /> },
     ],
   },
@@ -64,12 +78,12 @@ const router = createBrowserRouter([
 
 function App() {
   return (
-    <>
+    <ThemeProvider>
       <ToastContainer position="top-center" />
       <Suspense fallback={<Loading/>}>
         <RouterProvider router={router} />
       </Suspense>
-    </>
+    </ThemeProvider>
   );
 }