ADD: Brightness functionality

frontend/src/context/BrightnessContext.tsx

@@ -0,0 +1,31 @@
+import React, { createContext, useContext, useEffect, useState } from "react";
+
+interface BrightnessContextType {
+  brightness: number;
+  setBrightness: (value: number) => void;
+}
+
+const BrightnessContext = createContext<BrightnessContextType | undefined>(undefined);
+
+export const Brightness: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const [brightness, setBrightness] = useState<number>(100);
+
+  useEffect(() => {
+    // Apply brightness to the entire page
+    document.body.style.filter = `brightness(${brightness}%)`;
+  }, [brightness]);
+
+  return (
+    <BrightnessContext.Provider value={{ brightness, setBrightness }}>
+      {children}
+    </BrightnessContext.Provider>
+  );
+};
+
+export const useBrightness = (): BrightnessContextType => {
+  const context = useContext(BrightnessContext);
+  if (!context) {
+    throw new Error("useBrightness must be used within a BrightnessProvider");
+  }
+  return context;
+};