import { useEffect } from "react";

import { getUserConfig } from "../api/settings";

export function useTheme() {
  useEffect(() => {
    void (async () => {
      try {
        const config = await getUserConfig();
        const theme = config.theme ?? "system";
        
        if (theme === "system") {
          // Remove any explicit theme class and let system decide
          document.documentElement.removeAttribute("data-theme");
        } else {
          document.documentElement.setAttribute("data-theme", theme);
        }
      } catch {
        // Silently fail - theme is not critical
      }
    })();
  }, []);
}