import type { Page } from '@playwright/test';

import { dismissConsentBanner, expectFixture as expect, test } from '../helpers/test-fixtures';

const shouldRun = process.env.E2E_PADDLE_SANDBOX === '1';
const baseUrl = process.env.E2E_BASE_URL ?? 'https://test-y0k0.fotospiel.app';
const locale = process.env.E2E_LOCALE ?? 'de';
const checkoutSlug = locale === 'en' ? 'checkout' : 'bestellen';
const tenantEmail = buildTenantEmail();
const tenantPassword = process.env.E2E_TENANT_PASSWORD ?? null;
const sandboxCard = {
  number: process.env.E2E_PADDLE_CARD_NUMBER ?? '4242 4242 4242 4242',
  expiry: process.env.E2E_PADDLE_CARD_EXPIRY ?? '12/34',
  cvc: process.env.E2E_PADDLE_CARD_CVC ?? '123',
  name: process.env.E2E_PADDLE_CARD_NAME ?? 'Playwright Tester',
  postal: process.env.E2E_PADDLE_CARD_POSTAL ?? '10115',
};

test.describe('Paddle sandbox full flow (staging)', () => {
  test.skip(!shouldRun, 'Set E2E_PADDLE_SANDBOX=1 to run live sandbox checkout on staging.');
  test.skip(!tenantEmail || !tenantPassword, 'Set E2E_TENANT_EMAIL and E2E_TENANT_PASSWORD for sandbox flow.');

  test('register, pay via Paddle sandbox, and login to event admin', async ({ page, request }) => {
    // Jump directly into wizard for Standard package (2)
    await page.goto(`${baseUrl}/${locale}/${checkoutSlug}/2`);

    await dismissConsentBanner(page);

    // If login/register step is present, choose guest path or continue
    const continueButtons = page.getByRole('button', { name: /weiter|continue/i });
    if (await continueButtons.first().isVisible()) {
      await continueButtons.first().click();
    }

    await completeRegistrationOrLogin(page, {
      email: tenantEmail!,
      password: tenantPassword!,
    });

    const termsCheckbox = page.locator('#checkout-terms-hero');
    await expect(termsCheckbox).toBeVisible();
    await termsCheckbox.click();

    const checkoutCta = page.getByRole('button', { name: /Weiter mit Paddle|Continue with Paddle/i }).first();
    await expect(checkoutCta).toBeVisible({ timeout: 20000 });

    const [apiResponse] = await Promise.all([
      page.waitForResponse((resp) => resp.url().includes('/paddle/create-checkout') && resp.status() < 500),
      checkoutCta.click(),
    ]);

    const checkoutPayload = await apiResponse.json();
    const checkoutUrl: string = checkoutPayload.checkout_url ?? checkoutPayload.url ?? '';

    expect(checkoutUrl).toContain('paddle');

    // Navigate to Paddle hosted checkout and complete payment.
    await page.goto(checkoutUrl);
    await expect(page).toHaveURL(/paddle/);

    await completeHostedPaddleCheckout(page, sandboxCard);

    await expect
      .poll(
        async () => {
          const latestCompleted = await request.get('/api/_testing/checkout/sessions/latest', {
            params: { status: 'completed', email: tenantEmail },
          });
          if (!latestCompleted.ok()) {
            return null;
          }

          const json = await latestCompleted.json();
          return json?.data?.status ?? null;
        },
        { timeout: 120_000 }
      )
      .toBe('completed');

    await page.goto(`${baseUrl}/event-admin/login`);
    await dismissConsentBanner(page);

    await page.locator('input[name="identifier"]').fill(tenantEmail!);
    await page.locator('input[name="password"]').fill(tenantPassword!);
    await page.getByRole('button', { name: /Anmelden|Login/i }).click();

    await expect(page).toHaveURL(/\/event-admin\/mobile\/(dashboard|welcome)/i, { timeout: 30_000 });
    await expect(page.getByText(/Dashboard|Willkommen/i)).toBeVisible();
  });
});

async function completeRegistrationOrLogin(page: Page, credentials: { email: string; password: string }): Promise<void> {
  const identifierInput = page.locator('input[name="identifier"]');
  if (await identifierInput.isVisible()) {
    await identifierInput.fill(credentials.email);
    await page.locator('input[name="password"]').fill(credentials.password);
    await page.getByRole('button', { name: /^Anmelden$|Login/i }).last().click();
    await expect(page.getByPlaceholder(/Gutscheincode|Coupon/i)).toBeVisible({ timeout: 20_000 });
    return;
  }

  await page.fill('input[name="first_name"]', 'Play');
  await page.fill('input[name="last_name"]', 'Wright');
  await page.fill('input[name="email"]', credentials.email);
  await page.fill('input[name="address"]', 'Teststrasse 1, 12345 Berlin');
  await page.fill('input[name="phone"]', '+49123456789');

  const username = credentials.email.split('@')[0]?.replace(/[^a-z0-9]+/gi, '-') ?? `playwright-${Date.now()}`;
  await page.fill('input[name="username"]', username);

  await page.fill('input[name="password"]', credentials.password);
  await page.fill('input[name="password_confirmation"]', credentials.password);

  await page.check('input[name="privacy_consent"]');
  await page.getByRole('button', { name: /Registrieren|Register/i }).last().click();

  try {
    await expect(page.getByPlaceholder(/Gutscheincode|Coupon/i)).toBeVisible({ timeout: 20_000 });
    return;
  } catch {
    const loginButton = page.getByRole('button', { name: /^Anmelden$|Login/i }).first();
    if (await loginButton.isVisible()) {
      await loginButton.click();
    }
  }

  await expect(page.locator('input[name="identifier"]')).toBeVisible({ timeout: 10_000 });
  await page.locator('input[name="identifier"]').fill(credentials.email);
  await page.locator('input[name="password"]').fill(credentials.password);
  await page.getByRole('button', { name: /^Anmelden$|Login/i }).last().click();
  await expect(page.getByPlaceholder(/Gutscheincode|Coupon/i)).toBeVisible({ timeout: 20_000 });
}

async function completeHostedPaddleCheckout(
  page: Page,
  card: { number: string; expiry: string; cvc: string; name: string; postal: string }
): Promise<void> {
  const cardNumberSelectors = [
    'input[autocomplete="cc-number"]',
    'input[name="cardnumber"]',
    'input[name="card_number"]',
  ];
  const expirySelectors = [
    'input[autocomplete="cc-exp"]',
    'input[name="exp-date"]',
    'input[name="exp_date"]',
    'input[name="expiry"]',
  ];
  const cvcSelectors = [
    'input[autocomplete="cc-csc"]',
    'input[name="cvc"]',
    'input[name="security-code"]',
    'input[name="cvv"]',
  ];
  const nameSelectors = [
    'input[autocomplete="cc-name"]',
    'input[name="cardholder"]',
    'input[name="cardholder_name"]',
    'input[name="cardholder-name"]',
  ];
  const postalSelectors = [
    'input[autocomplete="postal-code"]',
    'input[name="postal"]',
    'input[name="postal_code"]',
    'input[name="zip"]',
  ];

  await maybeFillInAnyFrame(page, nameSelectors, card.name);
  await fillInAnyFrame(page, cardNumberSelectors, card.number);
  await fillInAnyFrame(page, expirySelectors, card.expiry);
  await fillInAnyFrame(page, cvcSelectors, card.cvc);
  await maybeFillInAnyFrame(page, postalSelectors, card.postal);

  const payButton = page.getByRole('button', {
    name: /Jetzt bezahlen|Pay now|Complete order|Order now|Kaufen|Bezahlen|Zahlung abschließen/i,
  }).first();
  await expect(payButton).toBeVisible({ timeout: 20_000 });
  await payButton.click();
}

function buildTenantEmail(): string | null {
  const rawEmail = process.env.E2E_TENANT_EMAIL ?? process.env.E2E_PADDLE_EMAIL ?? null;
  if (!rawEmail) {
    return null;
  }

  if (!rawEmail.includes('{timestamp}')) {
    return rawEmail;
  }

  const timestamp = Math.floor(Date.now() / 1000).toString();
  return rawEmail.replaceAll('{timestamp}', timestamp);
}

async function fillInAnyFrame(page: Page, selectors: string[], value: string): Promise<void> {
  const filled = await attemptFill(page, selectors, value);
  if (filled) {
    return;
  }

  const frames = page.frames();
  for (const frame of frames) {
    const frameFilled = await attemptFill(frame, selectors, value);
    if (frameFilled) {
      return;
    }
  }

  throw new Error(`Unable to find input for selectors: ${selectors.join(', ')}`);
}

async function maybeFillInAnyFrame(page: Page, selectors: string[], value: string): Promise<void> {
  const filled = await attemptFill(page, selectors, value);
  if (filled) {
    return;
  }

  const frames = page.frames();
  for (const frame of frames) {
    const frameFilled = await attemptFill(frame, selectors, value);
    if (frameFilled) {
      return;
    }
  }
}

async function attemptFill(
  scope: Page | import('@playwright/test').Frame,
  selectors: string[],
  value: string
): Promise<boolean> {
  for (const selector of selectors) {
    const locator = scope.locator(selector).first();
    if ((await locator.count()) === 0) {
      continue;
    }

    try {
      await locator.fill(value);
      return true;
    } catch {
      try {
        await locator.click();
        await locator.type(value, { delay: 25 });
        return true;
      } catch {
        continue;
      }
    }
  }

  return false;
}