import { test, expect, Page } from '@playwright/test'
import mockGroupsAPI from './mocks/groups';
import mockGuestsAPI from './mocks/guests';

test('should allow CRUD on groups', async ({ page }) => {
  await mockGuestsAPI({ page });
  await mockGroupsAPI({ page });

  await page.goto('/default/dashboard/guests');
  await page.getByRole('tab', { name: 'Groups' }).click();

  await expect(page.getByRole('button', { name: 'Add new' })).toBeVisible();
  await expect(page.getByRole('button', { name: 'Reset affinities' })).toBeVisible();


  // List all groups
  await expect(page.getByRole('row')).toHaveCount(3); // 1 header row + 2 data rows

  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(0)).toHaveText('Name');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(1)).toHaveText('Color');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(2)).toHaveText('Confirmed');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(3)).toHaveText('Tentative');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(4)).toHaveText('Pending');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(5)).toHaveText('Declined');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(6)).toHaveText('Considered');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(7)).toHaveText('Total');
  await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(8)).toHaveText('Actions');

  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(0)).toContainText('Pam\'s family');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(2)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(3)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(4)).toHaveText('1');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(5)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(6)).toHaveText('2');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(7)).toHaveText('3');
  await expect(page.getByRole('row').nth(1).locator('svg:visible')).toHaveCount(3);

  await expect(page.getByRole('row').nth(2).getByRole('cell').nth(0)).toContainText('Pam\'s work');
  await expect(page.getByRole('row').nth(2).getByRole('cell').nth(2)).toHaveText('0');
  await expect(page.getByRole('row').nth(2).getByRole('cell').nth(3)).toHaveText('2');
  await expect(page.getByRole('row').nth(2).getByRole('cell').nth(4)).toHaveText('0');
  await expect(page.getByRole('row').nth(2).getByRole('cell').nth(5)).toHaveText('0');
  await expect(page.getByRole('row').nth(2).getByRole('cell').nth(6)).toHaveText('0');
  await expect(page.getByRole('row').nth(2).getByRole('cell').nth(7)).toHaveText('2');
  await expect(page.getByRole('row').nth(2).locator('svg:visible')).toHaveCount(3);

  // Add a new group
  await page.getByRole('button', { name: 'Add new' }).click();
  const dialog = page.getByRole('dialog');
  await expect(dialog).toBeVisible();

  await dialog.getByLabel('Name').fill("Pam's friends");
  await dialog.getByRole('button', { name: 'Create' }).click();

  await expect(dialog).not.toBeVisible();

  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(0)).toContainText('Pam\'s friends');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(2)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(3)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(4)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(5)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(6)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).getByRole('cell').nth(7)).toHaveText('0');
  await expect(page.getByRole('row').nth(1).locator('svg:visible')).toHaveCount(3);
});