// @vitest-environment jsdom
/**
 * Component tests for EmptyState's three render branches:
 *  1. compact → title + optional hint + optional action (no steps list)
 *  2. hint-only (hint, no description, no onCreateTask) → centered title+hint
 *  3. default → title + optional description + the 3-step onboarding list +
 *     optional "create task" button.
 * Uses the real i18n instance (auto-initialized on import) for the layout ns.
 */
import '../../test/dom-setup';
import '../../i18n'; // initializes i18next so useTranslation('layout') resolves
import { describe, it, expect, vi } from 'vitest';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { EmptyState } from './EmptyState';

describe('EmptyState', () => {
  it('compact branch: shows title + hint + action, no steps list', () => {
    render(
      <EmptyState compact title="Nothing here" hint="add something" action={<span>act</span>} />,
    );
    expect(screen.getByText('Nothing here')).toBeInTheDocument();
    expect(screen.getByText('add something')).toBeInTheDocument();
    expect(screen.getByText('act')).toBeInTheDocument();
    // compact branch never renders the numbered onboarding list
    expect(screen.queryByRole('listitem')).toBeNull();
  });

  it('hint-only branch: title + hint, still no steps list', () => {
    render(<EmptyState title="Pick a thread" hint="choose from the left" />);
    expect(screen.getByText('Pick a thread')).toBeInTheDocument();
    expect(screen.getByText('choose from the left')).toBeInTheDocument();
    expect(screen.queryByRole('listitem')).toBeNull();
  });

  it('default branch: renders title, description, and the 3 onboarding steps', () => {
    render(<EmptyState title="Welcome" description="this is the description" />);
    expect(screen.getByText('Welcome')).toBeInTheDocument();
    expect(screen.getByText('this is the description')).toBeInTheDocument();
    // 3 numbered steps from the layout i18n namespace
    expect(screen.getAllByRole('listitem')).toHaveLength(3);
  });

  it('default branch: renders + wires the create button when onCreateTask given', async () => {
    const onCreateTask = vi.fn();
    const user = userEvent.setup();
    render(<EmptyState title="Welcome" onCreateTask={onCreateTask} />);
    const btn = screen.getByRole('button');
    await user.click(btn);
    expect(onCreateTask).toHaveBeenCalledTimes(1);
  });

  it('default branch: no create button when onCreateTask omitted', () => {
    render(<EmptyState title="Welcome" description="d" />);
    expect(screen.queryByRole('button')).toBeNull();
  });
});
