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

test.describe('Authentication', () => {
    test('Public pages should be accessible without login', async ({ page }) => {
        await page.goto('/');
        await expect(page).toHaveTitle(/Hördle/);
        await expect(page.getByRole('button', { name: 'Start' })).toBeVisible();
    });

    test('Admin page should be protected', async ({ page }) => {
        await page.goto('/en/admin');
        // We expect to see the Login form, NOT the dashboard content
        await expect(page.getByPlaceholder('Password')).toBeVisible();
        await expect(page.getByText('Manage Specials')).not.toBeVisible();
    });

    test('Admin login flow', async ({ page }) => {
        // Navigate to admin login
        await page.goto('/en/admin');
        await page.addStyleTag({ content: 'nextjs-portal, #nextjs-dev-overlay, [data-nextjs-dev-overlay] { display: none !important; }' });

        const passwordInput = page.getByPlaceholder('Password');
        const usernameInput = page.getByPlaceholder('Username');

        // Admin page should have password input (and maybe username if curator logic is shared, but usually just password)
        // Adjust based on actual UI. admin/page.tsx has only password.

        page.on('dialog', dialog => console.log(`Dialog message: ${dialog.message()}`));

        await expect(passwordInput).toBeVisible();
        await passwordInput.fill('admin123');
        await page.getByRole('button', { name: 'Login' }).dispatchEvent('click');
        await expect(page).toHaveURL(/\/(admin|en\/admin)/);

        // Should now be on admin page
        await expect(page.getByRole('heading', { name: 'Hördle Admin Dashboard' })).toBeVisible();
    });
});