import React from 'react';
import { describe, expect, it, afterEach, vi } from 'vitest';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import WelcomeTeaserPage from '../WelcomeTeaserPage';

const navigateMock = vi.fn();

vi.mock('../../components/LanguageSwitcher', () => ({
  LanguageSwitcher: () => <div data-testid="language-switcher" />,
}));

vi.mock('../../lib/navigation', () => ({
  navigateToHref: (href: string) => navigateMock(href),
}));

describe('WelcomeTeaserPage', () => {
  afterEach(() => {
    document.body.classList.remove('tenant-admin-theme', 'tenant-admin-welcome-theme');
    vi.clearAllMocks();
    navigateMock.mockReset();
  });

  it('applies the tenant admin theme classes while mounted', () => {
    const { unmount } = render(<WelcomeTeaserPage />);

    expect(document.body.classList.contains('tenant-admin-theme')).toBe(true);
    expect(document.body.classList.contains('tenant-admin-welcome-theme')).toBe(true);

    unmount();

    expect(document.body.classList.contains('tenant-admin-theme')).toBe(false);
    expect(document.body.classList.contains('tenant-admin-welcome-theme')).toBe(false);
  });

  it('shows the hero stats and triggers the login redirect CTA', async () => {
    render(<WelcomeTeaserPage />);

    expect(screen.getByText('Events begleitet')).toBeInTheDocument();

    const user = userEvent.setup();
    await user.click(screen.getByRole('button', { name: /event admin öffnen/i }));

    expect(navigateMock).toHaveBeenCalledWith(expect.stringContaining('/event-admin/login'));
  });

  it('allows switching between light and dark presentation modes', async () => {
    render(<WelcomeTeaserPage />);

    const user = userEvent.setup();
    const toggle = screen.getByRole('button', { name: /light mode/i });

    await user.click(toggle);

    expect(toggle).toHaveTextContent(/dark mode/i);
  });
});