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

test.describe('Auth — Settings Page', () => {
  test('settings page shows auth form when not logged in', async ({ page }) => {
    await page.goto('/settings');
    await page.waitForLoadState('networkidle');
    await expect(page.getByText('Account & Sync')).toBeVisible({ timeout: 30_000 });
    await expect(page.getByText(/sign in to sync/i)).toBeVisible();
  });

  test('shows Sign In and Create Account toggle buttons', async ({ page }) => {
    await page.goto('/settings');
    await page.waitForLoadState('networkidle');
    await expect(page.getByText('Account & Sync')).toBeVisible({ timeout: 30_000 });
    await expect(page.getByRole('button', { name: 'Sign In' })).toBeVisible();
    await expect(page.getByRole('button', { name: 'Create Account' })).toBeVisible();
  });

  test('shows email and password fields in login mode', async ({ page }) => {
    await page.goto('/settings');
    await page.waitForLoadState('networkidle');
    await expect(page.getByText('Account & Sync')).toBeVisible({ timeout: 30_000 });
    await expect(page.getByPlaceholder('Email')).toBeVisible();
    await expect(page.getByPlaceholder(/password/i).first()).toBeVisible();
  });

  test('switching to register mode shows name field', async ({ page }) => {
    await page.goto('/settings');
    await page.waitForLoadState('networkidle');
    await expect(page.getByText('Account & Sync')).toBeVisible({ timeout: 30_000 });
    await page.getByRole('button', { name: 'Create Account' }).click();
    await expect(page.getByPlaceholder('Display name')).toBeVisible();
  });

  test('forgot password link switches to reset mode', async ({ page }) => {
    await page.goto('/settings');
    await page.waitForLoadState('networkidle');
    await expect(page.getByText('Account & Sync')).toBeVisible({ timeout: 30_000 });
    await page.getByText('Forgot password?').click();
    await expect(page.getByRole('button', { name: 'Send Reset Link' })).toBeVisible();
    await expect(page.getByText('Back to sign in')).toBeVisible();
  });
});