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

// Test 1: Dashboard page renders after login
test('dashboard page renders after login', async ({ page }) => {
    await page.goto('/dashboard');
    await page.waitForLoadState('networkidle');
    
    // Verify we're on dashboard
    await expect(page).toHaveURL(/.*dashboard/);
    
    // Verify dashboard heading is visible (German text)
    await expect(page.getByText('Übersicht')).toBeVisible();
    
    // Verify welcome message is visible
    await expect(page.getByTestId('dashboard-welcome-text')).toBeVisible();
});

// Test 2: Top navigation shows correct links
test('top navigation shows correct links', async ({ page }) => {
    await page.goto('/dashboard');
    await page.waitForLoadState('networkidle');
    
    // Verify Services link is visible
    await expect(page.getByTestId('auth-layout-nav-services')).toBeVisible();
    
    // Verify Song-Datenbank link is visible
    await expect(page.getByTestId('auth-layout-nav-songs')).toBeVisible();
    
    // Verify text content of links
    await expect(page.getByTestId('auth-layout-nav-services')).toContainText('Services');
    await expect(page.getByTestId('auth-layout-nav-songs')).toContainText('Song-Datenbank');
});

// Test 3: Top navigation shows logged-in user
test('top navigation shows logged-in user', async ({ page }) => {
    await page.goto('/dashboard');
    await page.waitForLoadState('networkidle');
    
    // Verify user dropdown trigger is visible
    await expect(page.getByTestId('auth-layout-user-dropdown-trigger')).toBeVisible();
    
    // Verify user name is displayed in dropdown trigger
    const userDropdown = page.getByTestId('auth-layout-user-dropdown-trigger');
    await expect(userDropdown).toContainText(/./); // At least some text (user name)
});

// Test 4: Sync button visible with timestamp
test('sync button visible with timestamp', async ({ page }) => {
    await page.goto('/dashboard');
    await page.waitForLoadState('networkidle');
    
    // Verify sync button is visible
    await expect(page.getByTestId('auth-layout-sync-button')).toBeVisible();
    
    // Verify sync button contains German text
    await expect(page.getByTestId('auth-layout-sync-button')).toContainText('Daten aktualisieren');
    
    // Verify sync timestamp is visible
    await expect(page.getByTestId('auth-layout-sync-timestamp')).toBeVisible();
    
    // Verify timestamp contains German text
    await expect(page.getByTestId('auth-layout-sync-timestamp')).toContainText('Zuletzt aktualisiert');
});

// Test 5: Clicking Gottesdienste navigates to services
test('clicking Services navigates to services list', async ({ page }) => {
    await page.goto('/dashboard');
    await page.waitForLoadState('networkidle');
    
    // Click on Services link
    await page.getByTestId('auth-layout-nav-services').click();
    
    // Wait for navigation
    await page.waitForLoadState('networkidle');
    
    // Verify we're on services page
    await expect(page).toHaveURL(/.*services/);
});

// Test 6: Clicking Song-Datenbank navigates to songs
test('clicking Song-Datenbank navigates to songs list', async ({ page }) => {
    await page.goto('/dashboard');
    await page.waitForLoadState('networkidle');
    
    // Click on Song-Datenbank link
    await page.getByTestId('auth-layout-nav-songs').click();
    
    // Wait for navigation
    await page.waitForLoadState('networkidle');
    
    // Verify we're on songs page
    await expect(page).toHaveURL(/.*songs/);
});

// Test 7: Logo links back to dashboard
test('logo links back to dashboard', async ({ page }) => {
    // Navigate to services first
    await page.goto('/services');
    await page.waitForLoadState('networkidle');
    
    // Click logo
    await page.getByTestId('auth-layout-logo').click();
    
    // Wait for navigation
    await page.waitForLoadState('networkidle');
    
    // Verify we're back on dashboard
    await expect(page).toHaveURL(/.*dashboard/);
});

// Test 8: User dropdown trigger is clickable
test('user dropdown trigger is clickable', async ({ page }) => {
    await page.goto('/dashboard');
    await page.waitForLoadState('networkidle');
    
    // Click user dropdown
    await page.getByTestId('auth-layout-user-dropdown-trigger').click();
    
    // Verify logout link appears
    await expect(page.getByTestId('auth-layout-logout-link')).toBeVisible();
    
    // Verify logout link contains German text
    await expect(page.getByTestId('auth-layout-logout-link')).toContainText('Abmelden');
});
