Added a way to change the primary color in the App.jsx

client/src/App.jsx

@@ -4,19 +4,28 @@ import "@/common/styles/main.sass";
 import {BrowserRouter} from "react-router-dom";
 import Header from "@/common/components/Header";
 import Content from "@/common/components/Content";
-import {useState} from "react";
+import {useEffect, useState} from "react";
 import {StatusProvider} from "@/common/contexts/Status";
+import {ToastNotificationProvider} from "@/common/contexts/ToastNotification";
 
 const App = () => {
     const [sidebarOpen, setSidebarOpen] = useState(window.innerWidth >= 1024);
 
+    const [primaryColor, setPrimaryColor] = useState(localStorage.getItem("primary-color") || "#E3703F");
+
+    useEffect(() => {
+        document.documentElement.style.setProperty("--primary", primaryColor);
+    }, [primaryColor]);
+
     return (
         <>
             <BrowserRouter>
                 <StatusProvider>
+                    <ToastNotificationProvider>
                         <Sidebar open={sidebarOpen} setOpen={setSidebarOpen}/>
                         <Header open={sidebarOpen} setOpen={setSidebarOpen} />
                         <Content/>
+                    </ToastNotificationProvider>
                 </StatusProvider>
             </BrowserRouter>
         </>