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

vi.mock('./api/dashboardApi', () => ({
  loadDashboard: vi.fn()
}));

import { loadDashboard } from './api/dashboardApi';
import App from './App';

describe('App', () => {
  it('renders baseline page', () => {
    render(<App />);

    expect(screen.getByRole('heading', { name: 'Restaurant Admin Web' })).toBeInTheDocument();
    expect(screen.getByRole('button', { name: 'Load' })).toBeInTheDocument();
  });

  it('loads dashboard data when user clicks load', async () => {
    vi.mocked(loadDashboard).mockResolvedValue({ summary: 'ok' });
    render(<App />);

    fireEvent.change(screen.getByRole('textbox'), { target: { value: 'ctx stage28' } });
    fireEvent.click(screen.getByRole('button', { name: 'Load' }));

    await waitFor(() => {
      expect(loadDashboard).toHaveBeenCalledWith('ctx stage28');
      expect(screen.getByText(/summary/)).toBeInTheDocument();
    });
  });
});