import { test, expect } from '@playwright/test';
import { loginAsAdmin, waitForBlazor } from '../helpers/auth.helper';
import { ROUTES, TEST_SHOP_ID, TEST_TABLE_ID } from '../helpers/test-data';

/**
 * EN: Restaurant POS workflow E2E tests.
 * VI: E2E tests cho luong POS Nha hang.
 *
 * Routes:
 *   /pos/{ShopId}/restaurant                      — RestaurantDesktop
 *   /pos/{ShopId}/restaurant/table-map             — Table layout map
 *   /pos/{ShopId}/restaurant/table-detail/{TableId} — Table detail / order
 *   /pos/{ShopId}/restaurant/kitchen-display       — KDS (Kitchen Display System)
 *   /pos/{ShopId}/restaurant/eod-report            — End-of-Day report
 */
test.describe('POS — Restaurant', () => {
  test.beforeEach(async ({ page }) => {
    await loginAsAdmin(page);
  });

  // -----------------------------------------------------------------------
  // 1. Restaurant POS page loads
  // -----------------------------------------------------------------------
  test('should load restaurant POS page', async ({ page }) => {
    await page.goto(ROUTES.posRestaurant());
    await waitForBlazor(page);

    await expect(page).toHaveURL(new RegExp(`/pos/${TEST_SHOP_ID}/restaurant`));

    const content = page.locator(
      '.mud-main-content, .mud-layout-content, [class*="restaurant"], [class*="pos"]',
    ).first();
    await expect(content).toBeVisible({ timeout: 15_000 });
  });

  // -----------------------------------------------------------------------
  // 2. Table layout map displays
  // -----------------------------------------------------------------------
  test('should display table layout map', async ({ page }) => {
    await page.goto(ROUTES.posRestaurantTableMap());
    await waitForBlazor(page);

    await expect(page).toHaveURL(new RegExp(`/restaurant/table-map`));

    // Table map renders tables as cards, grid items, or custom elements
    const tableContainer = page.locator(
      '.mud-card, .mud-grid, .mud-paper, [class*="table"], [class*="map"]',
    ).first();
    await expect(tableContainer).toBeVisible({ timeout: 15_000 });
  });

  // -----------------------------------------------------------------------
  // 3. Table detail / create order from table
  // -----------------------------------------------------------------------
  test('should load table detail page for creating orders', async ({ page }) => {
    await page.goto(ROUTES.posRestaurantTableDetail());
    await waitForBlazor(page);

    await expect(page).toHaveURL(new RegExp(`/restaurant/table-detail/${TEST_TABLE_ID}`));

    const detail = page.locator(
      '.mud-main-content, .mud-layout-content, [class*="table"], [class*="order"], [class*="detail"]',
    ).first();
    await expect(detail).toBeVisible({ timeout: 15_000 });
  });

  // -----------------------------------------------------------------------
  // 4. Kitchen Display System (KDS)
  // -----------------------------------------------------------------------
  test('should load kitchen display system', async ({ page }) => {
    await page.goto(ROUTES.posRestaurantKitchenDisplay());
    await waitForBlazor(page);

    await expect(page).toHaveURL(new RegExp(`/restaurant/kitchen-display`));

    const kdsContent = page.locator(
      '.mud-main-content, .mud-layout-content, [class*="kitchen"], [class*="kds"], [class*="display"]',
    ).first();
    await expect(kdsContent).toBeVisible({ timeout: 15_000 });
  });

  // -----------------------------------------------------------------------
  // 5. End-of-Day report
  // -----------------------------------------------------------------------
  test('should load restaurant EOD report', async ({ page }) => {
    await page.goto(ROUTES.posRestaurantEodReport());
    await waitForBlazor(page);

    await expect(page).toHaveURL(new RegExp(`/restaurant/eod-report`));

    const reportContent = page.locator(
      '.mud-main-content, .mud-layout-content, [class*="report"], [class*="eod"]',
    ).first();
    await expect(reportContent).toBeVisible({ timeout: 15_000 });
  });
});
