import { afterEach, describe, it, expect } from 'vitest';
import { cleanup, render } from 'vitest-browser-svelte';
import { page } from 'vitest/browser';
import OcrModelsTable from './OcrModelsTable.svelte';
import type { components } from '$lib/generated/api';

afterEach(cleanup);

type SenderModel = components['schemas']['SenderModel'];

const personId = '123e4567-e89b-12d3-a456-426614174000';
const model: SenderModel = {
	id: 'aaa00000-0000-0000-0000-000000000001',
	personId,
	correctedLinesAtTraining: 120,
	createdAt: '2024-01-01T00:00:00Z',
	updatedAt: '2024-06-01T00:00:00Z',
	cer: 0.04,
	accuracy: 0.96
};

describe('OcrModelsTable', () => {
	it('shows person name when provided', async () => {
		render(OcrModelsTable, {
			senderModels: [model],
			personNames: { [personId]: 'Anna Müller' }
		});
		await expect.element(page.getByText('Anna Müller')).toBeInTheDocument();
	});

	it('shows person ID when name is missing', async () => {
		render(OcrModelsTable, {
			senderModels: [model],
			personNames: {}
		});
		await expect.element(page.getByText(personId)).toBeInTheDocument();
	});

	it('shows empty state row when no models', async () => {
		render(OcrModelsTable, { senderModels: [], personNames: {} });
		const rows = document.querySelectorAll('tbody tr');
		expect(rows.length).toBe(1);
		expect(rows[0].querySelector('td[colspan="5"]')).not.toBeNull();
	});
});
