import { test, expect } from '@playwright/test';

/**
 * Roles Management Tests
 *
 * Tests the Roles page functionality including:
 * - Viewing roles list (card layout)
 * - Opening add role offcanvas
 * - Viewing role form fields
 * - Editing existing role
 * - Delete role confirmation
 */

// Helper function to login as admin
async function loginAsAdmin(page) {
  await page.goto('/auth/login', { waitUntil: 'networkidle' });
  await page.locator('#email').fill('admin@demo.com');
  await page.locator('#password').fill('password123');
  await page.locator('button[type="submit"]').click();
  await page.waitForURL('**/dashboard', { timeout: 15000 });
}

test.describe('Roles Management', () => {
  test.beforeEach(async ({ page }) => {
    await loginAsAdmin(page);
  });

  test('should display roles page', async ({ page }) => {
    // Navigate to roles page
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Verify page elements
    await expect(page.locator('.card').first()).toBeVisible();

    // Verify add role button exists
    await expect(page.locator('button[data-bs-target="#addOrUpdateRoleOffcanvas"]').first()).toBeVisible();
  });

  test('should display role cards', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Wait for role cards to load
    await page.waitForTimeout(1000);

    // Verify role cards exist (should have at least admin role)
    const roleCards = page.locator('.card .card-body .role-heading h5');
    await expect(roleCards.first()).toBeVisible();
  });

  test('should open add role offcanvas', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Click Add New Role button
    await page.click('button[data-bs-target="#addOrUpdateRoleOffcanvas"]');
    await page.waitForTimeout(500);

    // Verify offcanvas is visible
    await expect(page.locator('#addOrUpdateRoleOffcanvas')).toBeVisible();
  });

  test('should display role form fields', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Open offcanvas
    await page.click('button[data-bs-target="#addOrUpdateRoleOffcanvas"]');
    await page.waitForTimeout(500);

    // Verify form fields
    await expect(page.locator('#addRoleForm')).toBeVisible();
    await expect(page.locator('#name')).toBeVisible();
    await expect(page.locator('#isMultiCheckInEnabled')).toBeVisible();
    await expect(page.locator('#mobileAppAccess')).toBeVisible();
    await expect(page.locator('#webAppAccess')).toBeVisible();
    await expect(page.locator('#locationActivityTracking')).toBeVisible();
  });

  test('should close role offcanvas on cancel', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Open offcanvas
    await page.click('button[data-bs-target="#addOrUpdateRoleOffcanvas"]');
    await page.waitForTimeout(500);
    await expect(page.locator('#addOrUpdateRoleOffcanvas')).toBeVisible();

    // Click cancel button
    await page.locator('#addOrUpdateRoleOffcanvas button[data-bs-dismiss="offcanvas"]').first().click();
    await page.waitForTimeout(500);

    // Verify offcanvas is hidden
    await expect(page.locator('#addOrUpdateRoleOffcanvas')).toBeHidden();
  });

  test('should have edit button on role cards', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Wait for role cards to load
    await page.waitForTimeout(1000);

    // Verify edit button exists on role cards
    const editButton = page.locator('.card .card-body .edit').first();
    if (await editButton.count() > 0) {
      await expect(editButton).toBeVisible();
    }
  });

  test('should open edit offcanvas when clicking edit', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Wait for role cards to load
    await page.waitForTimeout(1000);

    // Find and click edit button
    const editButton = page.locator('.card .card-body .edit').first();
    if (await editButton.count() > 0) {
      await editButton.click();
      await page.waitForTimeout(500);

      // Verify offcanvas opens
      await expect(page.locator('#addOrUpdateRoleOffcanvas')).toBeVisible();

      // Close offcanvas
      await page.locator('#addOrUpdateRoleOffcanvas button[data-bs-dismiss="offcanvas"]').first().click();
    }
  });

  test('should show delete confirmation dialog', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Wait for role cards to load
    await page.waitForTimeout(1000);

    // Find and click delete button (trash icon)
    const deleteButton = page.locator('.card .card-body a:has(.bx-trash)').first();
    if (await deleteButton.count() > 0) {
      await deleteButton.click();

      // Wait for SweetAlert2 confirmation dialog
      await page.waitForSelector('.swal2-popup', { state: 'visible', timeout: 5000 });

      // Verify SweetAlert2 dialog is shown
      await expect(page.locator('.swal2-popup')).toBeVisible();

      // Click Cancel to dismiss without deleting
      await page.locator('.swal2-cancel').click();
      await page.waitForTimeout(500);

      // Verify SweetAlert2 is closed
      await expect(page.locator('.swal2-popup')).toBeHidden();
    }
  });

  test('should display role user count', async ({ page }) => {
    await page.goto('/roles', { waitUntil: 'networkidle' });

    // Wait for role cards to load
    await page.waitForTimeout(1000);

    // Verify user count is displayed on role cards
    const userCount = page.locator('.card .card-body h6.fw-normal');
    if (await userCount.count() > 0) {
      await expect(userCount.first()).toContainText('Users');
    }
  });
});
