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

const baseStatus = {
  hostname: 'pikit',
  ready: true,
  uptime_seconds: 100,
  load: [0, 0, 0],
  memory_mb: { total: 1024, free: 512 },
  disk_mb: { total: 10240, free: 9000 },
  cpu_temp_c: 40,
  lan_ip: '10.0.0.10',
  os_version: 'DietPi',
  auto_updates_enabled: true,
  auto_updates: { enabled: true },
  services: [],
};
const defaultUpdatesConfig = {
  enabled: true,
  scope: 'all',
  update_time: '04:00',
  upgrade_time: '04:30',
  cleanup: true,
  bandwidth_limit_kbps: null,
  auto_reboot: false,
  reboot_time: '04:30',
  reboot_with_users: false,
};

test('busy overlay appears while adding a service', async ({ page }) => {
  let services = [];
  await page.route('**/api/updates/config', async (route) => {
    await route.fulfill({ json: defaultUpdatesConfig });
  });
  await page.route('**/api/status', async (route) => {
    await route.fulfill({ json: { ...baseStatus, services } });
  });

  await page.goto('/');

  // Trigger busy overlay via test hook
  await page.evaluate(() => {
    window.__pikitTest?.showBusy('Adding service', 'Opening firewall rules…');
    setTimeout(() => window.__pikitTest?.hideBusy(), 300);
  });

  const busy = page.locator('#busyOverlay');
  await expect(busy).toBeVisible();
  await expect(busy).toBeHidden({ timeout: 2000 });
});