import { describe, it, expect, afterEach } from 'vitest';
import { cleanup, render } from 'vitest-browser-svelte';
import { page } from 'vitest/browser';
import PersonsStatsBar from './PersonsStatsBar.svelte';

afterEach(cleanup);

describe('PersonsStatsBar', () => {
	it('renders both counts', async () => {
		render(PersonsStatsBar, { props: { totalPersons: 42, totalDocuments: 99 } });

		await expect.element(page.getByText('42')).toBeVisible();
		await expect.element(page.getByText('99')).toBeVisible();
	});

	it('uses the singular person label when totalPersons is 1', async () => {
		render(PersonsStatsBar, { props: { totalPersons: 1, totalDocuments: 5 } });

		await expect.element(page.getByText('Person', { exact: true })).toBeVisible();
	});

	it('uses the plural person label when totalPersons is not 1', async () => {
		render(PersonsStatsBar, { props: { totalPersons: 5, totalDocuments: 5 } });

		await expect.element(page.getByText('Personen', { exact: true })).toBeVisible();
	});

	it('uses the singular document label when totalDocuments is 1', async () => {
		render(PersonsStatsBar, { props: { totalPersons: 5, totalDocuments: 1 } });

		await expect.element(page.getByText('Dokument', { exact: true })).toBeVisible();
	});

	it('uses the plural document label when totalDocuments is not 1', async () => {
		render(PersonsStatsBar, { props: { totalPersons: 5, totalDocuments: 5 } });

		await expect.element(page.getByText('Dokumente', { exact: true })).toBeVisible();
	});

	it('handles zero counts with plural labels', async () => {
		render(PersonsStatsBar, { props: { totalPersons: 0, totalDocuments: 0 } });

		await expect.element(page.getByText('Personen', { exact: true })).toBeVisible();
		await expect.element(page.getByText('Dokumente', { exact: true })).toBeVisible();
	});
});
