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

const localeData = {
  en: {
    button: /Book a demo|Book a product demo/,
    title: 'Book a product demo',
    success: 'Demo request recorded',
  },
  fr: {
    button: /Réserver une démonstration/,
    title: 'Réserver une démonstration du produit',
    success: 'Demande de démonstration enregistrée',
  },
  ar: {
    button: /احجز عرضًا توضيحيًا|احجز عرض/,
    title: 'احجز عرضًا توضيحيًا للمنتج',
    success: 'تم تسجيل طلب العرض',
  },
} as const;

for (const locale of ['en', 'fr', 'ar'] as const) {
  test(`${locale} demo flow validates and succeeds through the local adapter`, async ({ page }) => {
    const labels = localeData[locale];
    await page.goto(`/${locale}`);
    await page.locator('main button[data-demo-source="hero"]').click();

    const dialog = page.getByRole('dialog', { name: labels.title });
    await expect(dialog).toBeVisible();
    await dialog
      .getByRole('button', { name: /Request my demo|Demander ma démonstration|إرسال طلب العرض/ })
      .click();
    await expect(dialog.locator('[role="alert"]')).toBeVisible();
    await expect(dialog.locator('#fullName')).toBeFocused();

    await dialog.locator('#fullName').fill('Avery Example');
    await dialog.locator('#workEmail').fill('avery@example.test');
    await dialog.locator('#company').fill('Example Rental Lab');
    await dialog.locator('#fleetSize').selectOption('10-24');
    await dialog
      .getByRole('button', { name: /Request my demo|Demander ma démonstration|إرسال طلب العرض/ })
      .click();

    await expect(dialog.getByRole('heading', { name: labels.success })).toBeVisible();
    await expect(page).toHaveURL(new RegExp(`/${locale}$`));
  });
}

test('duplicate clicks create only one request while submission is pending', async ({ page }) => {
  await page.goto('/en');
  await page.locator('main button[data-demo-source="hero"]').click();
  const dialog = page.getByRole('dialog', { name: 'Book a product demo' });
  await dialog.locator('#fullName').fill('Avery Example');
  await dialog.locator('#workEmail').fill('avery@example.test');
  await dialog.locator('#company').fill('Example Rental Lab');
  await dialog.locator('#fleetSize').selectOption('10-24');
  const submit = dialog.getByRole('button', { name: 'Request my demo' });
  await submit.dblclick();
  await expect(dialog.getByRole('heading', { name: 'Demo request recorded' })).toBeVisible();
});

test('demo form does not place personal data in the URL or analytics sink', async ({ page }) => {
  await page.goto('/en');
  await page.locator('main button[data-demo-source="hero"]').click();
  const dialog = page.getByRole('dialog', { name: 'Book a product demo' });
  await dialog.locator('#fullName').fill('Private Example');
  await dialog.locator('#workEmail').fill('private@example.test');
  await dialog.locator('#company').fill('Private Rentals');
  await dialog.locator('#fleetSize').selectOption('1-9');
  await dialog.getByRole('button', { name: 'Request my demo' }).click();
  await expect(dialog.getByRole('heading', { name: 'Demo request recorded' })).toBeVisible();
  expect(page.url()).not.toContain('private');
  const analytics = await page.evaluate(() => window.__rdgAnalyticsTestSink ?? []);
  expect(JSON.stringify(analytics)).not.toContain('private');
});