// @vitest-environment jsdom
import { act } from 'react';
import { createRoot } from 'react-dom/client';
import { afterEach, expect, it, vi } from 'vitest';
import { useApp } from '../../src/app/AppProvider';
import { SheetAndSearchControls } from '../../src/features/search-filter/SearchFilterBar';
import { makeSheet } from '../../src/importers/sheet-factory';

vi.mock('../../src/app/AppProvider', () => ({ useApp: vi.fn() }));
afterEach(() => { vi.restoreAllMocks(); vi.unstubAllGlobals(); });

it('mounts only the selected sheet until focus, then offers every sheet and preserves the selection', async () => {
  vi.stubGlobal('IS_REACT_ACT_ENVIRONMENT', true);
  const template = makeSheet('Synthetic', [['Title'], ['One']], '', 'synthetic.csv');
  const sheets = Array.from({ length: 2537 }, (_, index) => ({ ...template, id: `sheet-${index}`, name: `Synthetic sheet ${index}` }));
  const state = { dataset: { sheets }, activeSheetId: sheets[4].id, status: '', setActiveSheet: vi.fn() } as unknown as ReturnType<typeof useApp>;
  vi.mocked(useApp).mockReturnValue(state);
  const container = document.createElement('div');
  document.body.append(container);
  const root = createRoot(container);
  try {
    await act(async () => root.render(<SheetAndSearchControls/>));
    const select = container.querySelector('select')!;
    expect(select.options).toHaveLength(1);
    expect(select.value).toBe(sheets[4].id);
    await act(async () => select.focus());
    expect(select.options).toHaveLength(2537);
    await act(async () => { select.value = sheets[2500].id; select.dispatchEvent(new Event('change', { bubbles: true })); });
    expect(state.setActiveSheet).toHaveBeenCalledWith(sheets[2500].id);
    state.activeSheetId = sheets[2500].id;
    await act(async () => { select.blur(); root.render(<SheetAndSearchControls/>); });
    expect(select.options).toHaveLength(1);
    expect(select.value).toBe(sheets[2500].id);
    await act(async () => select.dispatchEvent(new Event('pointerdown', { bubbles: true })));
    expect(select.options).toHaveLength(2537);
  } finally { await act(async () => root.unmount()); container.remove(); }
});