app first commit

app/src/hooks/useTheme.tsx

@@ -0,0 +1,28 @@
+// src/hooks/useTheme.ts
+import { useEffect } from "react";
+import { useAtom } from "jotai";
+import { themeAtom } from "../atoms";
+
+const ALL_THEMES = ["light", "dark", "red"];
+
+export function useTheme() {
+  const [theme, setTheme] = useAtom(themeAtom);
+
+  useEffect(() => {
+    const body = document.body;
+    ALL_THEMES.forEach((t) => body.classList.remove(t));
+    body.classList.add(theme);
+    console.log('set ', theme)
+  }, [theme]);
+
+  const toggleTheme = () => {
+    setTheme((prev) => (prev === "light" ? "dark" : "light"));
+  };
+
+  return {
+    theme,
+    setTheme,
+    toggleTheme,
+    themes: ALL_THEMES,
+  };
+}