'use client';

import React, { useEffect } from 'react';
import { useAuthContext } from './AuthProvider';

export function ThemeProvider({ children }: { children: React.ReactNode }) {
    const { user } = useAuthContext();

    useEffect(() => {
        if (!user) return;

        const theme = user.preferences?.theme || 'light';
        const root = document.documentElement;

        root.classList.remove('theme-light', 'theme-dark', 'theme-sepia');
        root.classList.add(`theme-${theme}`);
    }, [user?.preferences?.theme]);

    return <>{children}</>;
}
