import { render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { describe, it, expect, vi, beforeEach } from 'vitest';

import BulkPublishModal from './BulkPublishModal';

const { mockPost } = vi.hoisted(() => ({ mockPost: vi.fn() }));

vi.mock('@inertiajs/react', async () => {
  const actual = await vi.importActual('@inertiajs/react');
  return {
    ...actual,
    useForm: vi.fn(() => ({
      data: { draft_ids: [], publish_type: 'draft' },
      setData: vi.fn(),
      post: mockPost,
      processing: false,
      errors: {},
    })),
  };
});

vi.mock('@/lib/analytics', () => ({
  trackEvent: vi.fn(),
  trackProductEvent: vi.fn(),
}));

const baseProps = {
  open: true,
  onOpenChange: vi.fn(),
  siteId: '1',
  draftIds: ['d1', 'd2'],
};

describe('BulkPublishModal', () => {
  beforeEach(() => {
    vi.clearAllMocks();
  });

  it('renders with correct draft count', () => {
    render(<BulkPublishModal {...baseProps} />);
    // Verify the modal header mentions 2 drafts — use getAllByText since "2" appears in multiple places
    expect(screen.getAllByText(/2/).length).toBeGreaterThan(0);
  });

  it('shows Publish button', () => {
    render(<BulkPublishModal {...baseProps} />);
    expect(screen.getByRole('button', { name: /publish/i })).toBeInTheDocument();
  });
});

// FE-002: Regression — BulkPublishModal must resync draft_ids on open
describe('FE-002: BulkPublishModal stale draft_ids regression', () => {
  it('calls post() after syncing current draftIds via setData on open', async () => {
    const user = userEvent.setup();

    const mockSetData = vi.fn();
    const mockPostFn = vi.fn();

    const { useForm } = await import('@inertiajs/react');
    vi.mocked(useForm).mockReturnValue({
      data: { draft_ids: [] as string[], publish_type: 'draft' as const },
      setData: mockSetData,
      post: mockPostFn,
      processing: false,
      errors: {},
    } as unknown as ReturnType<typeof useForm>);

    const { rerender } = render(
      <BulkPublishModal {...baseProps} draftIds={[]} />,
    );

    // Simulate selection: rerender with fresh ids and modal open
    rerender(<BulkPublishModal {...baseProps} draftIds={['d1', 'd2']} open={true} />);

    // The useEffect should have called setData with the new ids
    await waitFor(() => {
      expect(mockSetData).toHaveBeenCalledWith('draft_ids', ['d1', 'd2']);
    });

    const submitBtn = screen.getByRole('button', { name: /publish/i });
    await user.click(submitBtn);

    expect(mockPostFn).toHaveBeenCalled();
  });
});