import React from 'react';
import { describe, expect, beforeEach, afterEach, it, vi } from 'vitest';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import WelcomeLandingPage from '../pages/WelcomeLandingPage';
import { OnboardingProgressProvider } from '..';
import {
  ADMIN_EVENTS_PATH,
  ADMIN_WELCOME_PACKAGES_PATH,
} from '../../constants';

const navigateMock = vi.fn();

vi.mock('react-router-dom', async () => {
  const actual = await vi.importActual<typeof import('react-router-dom')>('react-router-dom');
  return {
    ...actual,
    useNavigate: () => navigateMock,
    useLocation: () => ({ pathname: '/event-admin', search: '', hash: '', state: null, key: 'test' }),
  };
});

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

vi.mock('../../auth/context', () => ({
  useAuth: () => ({ status: 'authenticated', user: { name: 'Test User' } }),
}));

vi.mock('../../api', () => ({
  fetchOnboardingStatus: vi.fn().mockResolvedValue(null),
  trackOnboarding: vi.fn(),
}));

describe('WelcomeLandingPage', () => {
  beforeEach(() => {
    localStorage.clear();
    navigateMock.mockReset();
  });

  afterEach(() => {
    vi.clearAllMocks();
  });

  function renderPage() {
    return render(
      <OnboardingProgressProvider>
        <WelcomeLandingPage />
      </OnboardingProgressProvider>
    );
  }

  it('marks the welcome step as seen on mount', () => {
    renderPage();
    const stored = localStorage.getItem('tenant-admin:onboarding-progress');
    expect(stored).toBeTruthy();
    expect(stored).toContain('"welcomeSeen":true');
    expect(stored).toContain('"lastStep":"landing"');
  });

  it('navigates to package selection when the primary CTA is clicked', async () => {
    renderPage();
    const user = userEvent.setup();
    await user.click(screen.getByRole('button', { name: /hero.primary.label/i }));
    expect(navigateMock).toHaveBeenCalledWith(ADMIN_WELCOME_PACKAGES_PATH);
  });

  it('navigates to events when secondary CTA in hero or footer is used', async () => {
    renderPage();
    const user = userEvent.setup();
    await user.click(screen.getByRole('button', { name: /hero.secondary.label/i }));
    expect(navigateMock).toHaveBeenCalledWith(ADMIN_EVENTS_PATH);

    navigateMock.mockClear();
    await user.click(screen.getByRole('button', { name: /layout.jumpToDashboard/i }));
    expect(navigateMock).toHaveBeenCalledWith(ADMIN_EVENTS_PATH);
  });
});