import { renderHook, act } from '@testing-library/react';
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { ThemeProvider, useTheme } from './ThemeContext';
import { ReactNode } from 'react';
import { ThemeVariant } from '@/types';

const wrapper = ({ children }: { children: ReactNode }) => (
  <ThemeProvider>{children}</ThemeProvider>
);

describe('ThemeContext', () => {
  beforeEach(() => {
    vi.clearAllMocks();
    localStorage.clear();
  });

  it('should provide theme context', () => {
    const { result } = renderHook(() => useTheme(), { wrapper });

    expect(result.current).toBeDefined();
    expect(result.current).toHaveProperty('theme');
    expect(result.current).toHaveProperty('setTheme');
  });

  it('should have default theme', () => {
    const { result } = renderHook(() => useTheme(), { wrapper });

    expect(result.current.theme).toBeDefined();
  });

  it('should change theme', () => {
    const { result } = renderHook(() => useTheme(), { wrapper });

    const initialTheme = result.current.theme;

    act(() => {
      result.current.setTheme(ThemeVariant.GAMING);
    });

    expect(result.current.theme).toBe(ThemeVariant.GAMING);
    expect(result.current.theme).not.toBe(initialTheme);
  });

  it('should toggle theme', () => {
    const { result } = renderHook(() => useTheme(), { wrapper });

    const initialTheme = result.current.theme;

    act(() => {
      if (result.current.toggleTheme) {
        result.current.toggleTheme();
      }
    });

    // Le thème devrait changer si toggleTheme existe
    if (result.current.toggleTheme) {
      expect(result.current.theme).not.toBe(initialTheme);
    }
  });
});