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

vi.mock('$app/forms', () => ({ enhance: () => () => {} }));

const makeGroup = (overrides = {}) => ({
	id: 'g1',
	name: 'Editoren',
	permissions: ['WRITE_ALL'],
	...overrides
});

const makeUser = (overrides = {}) => ({
	id: 'u1',
	username: 'max',
	firstName: 'Max',
	lastName: 'Mustermann',
	email: 'max@example.com',
	birthDate: undefined,
	contact: undefined,
	enabled: true,
	groups: [makeGroup()],
	createdAt: '2024-01-01T00:00:00Z',
	...overrides
});

const baseData = {
	user: undefined,
	canWrite: true,
	users: [makeUser()],
	groups: [makeGroup()],
	tags: []
};

afterEach(cleanup);

// ─── Users tab ────────────────────────────────────────────────────────────────

describe('Admin page – users tab', () => {
	it('shows the username in the table', async () => {
		render(Page, { data: baseData, form: null });
		await expect.element(page.getByRole('cell', { name: 'max', exact: true })).toBeInTheDocument();
	});

	it('shows the full name in the table', async () => {
		render(Page, { data: baseData, form: null });
		await expect.element(page.getByText(/Max Mustermann/)).toBeInTheDocument();
	});

	it('shows a dash when user has no name set', async () => {
		const data = { ...baseData, users: [makeUser({ firstName: undefined, lastName: undefined })] };
		render(Page, { data, form: null });
		await expect.element(page.getByText('–')).toBeInTheDocument();
	});

	it('shows group badges for the user', async () => {
		render(Page, { data: baseData, form: null });
		await expect.element(page.getByText('Editoren')).toBeInTheDocument();
	});

	it('edit link points to /admin/users/[id]', async () => {
		render(Page, { data: baseData, form: null });
		await expect
			.element(page.getByRole('link', { name: /Bearbeiten/i }))
			.toHaveAttribute('href', '/admin/users/u1');
	});

	it('new user button links to /admin/users/new', async () => {
		render(Page, { data: baseData, form: null });
		await expect
			.element(page.getByRole('link', { name: /Neuer Benutzer/i }))
			.toHaveAttribute('href', '/admin/users/new');
	});

	it('shows "no groups" label when user has no groups', async () => {
		const data = { ...baseData, users: [makeUser({ groups: [] })] };
		render(Page, { data, form: null });
		await expect.element(page.getByText(/Keine Gruppen/i)).toBeInTheDocument();
	});
});