import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { FuelLogForm } from '../../src/features/fuel-logs/components/FuelLogForm';
import { UnitsProvider } from '../../src/core/units/UnitsContext';

jest.mock('../../src/features/fuel-logs/hooks/useFuelLogs', () => ({
  useFuelLogs: () => ({ createFuelLog: jest.fn().mockResolvedValue({}), isLoading: false })
}));

const qc = new QueryClient();

describe('FuelLogForm', () => {
  it('shows validation error when no distance provided', async () => {
    render(
      <QueryClientProvider client={qc}>
        <UnitsProvider>
          <FuelLogForm />
        </UnitsProvider>
      </QueryClientProvider>
    );

    // Attempt submit without distance
    const submit = screen.getByRole('button', { name: /add fuel log/i });
    fireEvent.click(submit);

    expect(await screen.findByText(/Either odometer reading or trip distance is required/i)).toBeInTheDocument();
  });
});