/**
 * Staff Login Authentication Tests
 * Tests the staff/admin login system with username/password
 */

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

test.describe('Staff Login Authentication', () => {
  test.beforeEach(async ({ page }) => {
    // Navigate to staff login page
    await page.goto('/staff/login');
  });

  test('should display staff login page correctly', async ({ page }) => {
    // Verify page elements
    await expect(page).toHaveTitle(/Staff/i);
    await expect(page.locator('h1')).toContainText('Mawidi');
    await expect(page.locator('h2')).toContainText('Staff Login');

    // Verify form fields exist
    await expect(page.locator('input[type="text"]')).toBeVisible();
    await expect(page.locator('input[type="password"]')).toBeVisible();
    await expect(page.locator('button[type="submit"]')).toBeVisible();

    // Verify customer login link
    await expect(page.locator('text=Looking for customer login?')).toBeVisible();
    const customerLink = page.locator('a[href="/login"]');
    await expect(customerLink).toBeVisible();
  });

  test('should login successfully with valid credentials', async ({ page }) => {
    // Fill in login form
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'AsimMawidi2025!');

    // Submit form
    await page.click('button[type="submit"]');

    // Should redirect to staff dashboard
    await page.waitForURL('/staff/dashboard', { timeout: 10000 });

    // Verify dashboard loaded
    await expect(page.locator('h1')).toContainText('Dashboard Overview');
    await expect(page.locator('text=Welcome back')).toBeVisible();
  });

  test('should show error with invalid username', async ({ page }) => {
    await page.fill('input[type="text"]', 'wronguser');
    await page.fill('input[type="password"]', 'WrongPass123!');

    await page.click('button[type="submit"]');

    // Should show error message
    await expect(page.locator('text=/Invalid username or password/i')).toBeVisible({
      timeout: 5000,
    });

    // Should not redirect
    await expect(page).toHaveURL(/\/staff\/login/);
  });

  test('should show error with invalid password', async ({ page }) => {
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'WrongPassword');

    await page.click('button[type="submit"]');

    // Should show error
    await expect(page.locator('text=/Invalid username or password/i')).toBeVisible({
      timeout: 5000,
    });
  });

  test('should lock account after 3 failed attempts', async ({ page }) => {
    // Attempt 1
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'wrong1');
    await page.click('button[type="submit"]');
    await page.waitForTimeout(1000);

    // Attempt 2
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'wrong2');
    await page.click('button[type="submit"]');
    await page.waitForTimeout(1000);

    // Attempt 3
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'wrong3');
    await page.click('button[type="submit"]');

    // Should show account locked message
    await expect(page.locator('text=/locked|too many/i')).toBeVisible({
      timeout: 5000,
    });
  });

  test('should require both username and password', async ({ page }) => {
    // Try to submit without filling form
    await page.click('button[type="submit"]');

    // HTML5 validation should prevent submission
    const usernameInput = page.locator('input[type="text"]');
    await expect(usernameInput).toHaveAttribute('required', '');
  });

  test('should disable button while logging in', async ({ page }) => {
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'AsimMawidi2025!');

    const submitButton = page.locator('button[type="submit"]');

    // Click and check button is disabled
    await submitButton.click();

    // Button should show loading state
    await expect(submitButton).toContainText(/signing in/i);
    await expect(submitButton).toBeDisabled();
  });

  test('customer login link should redirect to customer login page', async ({ page }) => {
    const customerLink = page.locator('a[href="/login"]');
    await customerLink.click();

    // Should redirect to customer login (with language prefix)
    await expect(page).toHaveURL(/\/(ar|en)\/login/);
  });
});

test.describe('Staff Dashboard Access Control', () => {
  test('unauthenticated users should be redirected to login', async ({ page }) => {
    // Try to access dashboard without login
    await page.goto('/staff/dashboard');

    // Should redirect to login page
    await expect(page).toHaveURL('/staff/login', { timeout: 5000 });
  });

  test('authenticated staff can access dashboard', async ({ page }) => {
    // Login first
    await page.goto('/staff/login');
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'AsimMawidi2025!');
    await page.click('button[type="submit"]');
    await page.waitForURL('/staff/dashboard');

    // Should see dashboard
    await expect(page.locator('h1')).toContainText('Dashboard Overview');

    // Should see navigation
    await expect(page.locator('text=Demo Bookings')).toBeVisible();
    await expect(page.locator('text=Contacts')).toBeVisible();
    await expect(page.locator('text=Users')).toBeVisible();
    await expect(page.locator('text=Analytics')).toBeVisible();
  });

  test('staff can logout successfully', async ({ page }) => {
    // Login
    await page.goto('/staff/login');
    await page.fill('input[type="text"]', 'asim');
    await page.fill('input[type="password"]', 'AsimMawidi2025!');
    await page.click('button[type="submit"]');
    await page.waitForURL('/staff/dashboard');

    // Click profile dropdown
    await page.click('button:has-text("Asim")');

    // Click logout
    await page.click('text=Sign Out');

    // Should redirect to staff login
    await expect(page).toHaveURL('/staff/login', { timeout: 5000 });

    // Try to access dashboard again - should redirect back to login
    await page.goto('/staff/dashboard');
    await expect(page).toHaveURL('/staff/login');
  });
});
