import { STAGING_URL, PATHS, TIMEOUTS } from './config/staging-config';
import { test, expect } from '@playwright/test';

test.describe('Refactored Dashboard Test', () => {
  test('verify refactored dashboard displays correctly', async ({ page }) => {
    const staging_url = 'https://upskill-staging.measurequick.com';
    
    // Login as test trainer
    await page.goto(`${staging_url}/community-login`);
    await page.fill('#user_login', 'test_trainer');
    await page.fill('#user_pass', 'password123!');
    await page.click('input[type="submit"]');
    await page.waitForLoadState('networkidle');
    await page.waitForTimeout(2000);

    // Go to dashboard
    console.log('Navigating to dashboard...');
    await page.goto(`${staging_url}/hvac-dashboard`);
    await page.waitForLoadState('networkidle');
    
    // Take a screenshot
    await page.screenshot({ path: 'refactored-dashboard.png', fullPage: true });
    
    // Check if dashboard is loading properly
    const content = await page.content();
    
    console.log('\n=== Dashboard Refactor Check ===');
    
    // Check for new dashboard wrapper
    const hasDashboardWrapper = content.includes('hvac-dashboard-wrapper');
    console.log('Has dashboard wrapper:', hasDashboardWrapper);
    
    // Check for stats section
    const hasStatsSection = content.includes('hvac-dashboard-stats');
    console.log('Has stats section:', hasStatsSection);
    
    // Check for stat cards
    const hasStatCards = content.includes('hvac-stat-card');
    console.log('Has stat cards:', hasStatCards);
    
    // Check for specific stats
    const stats = ['Total Events', 'Upcoming Events', 'Past Events', 'Tickets Sold', 'Total Revenue'];
    for (const stat of stats) {
      const hasStat = content.includes(stat);
      console.log(`Has ${stat}:`, hasStat);
    }
    
    // Check for navigation buttons
    const hasCreateEventButton = content.includes('Create Event');
    console.log('Has Create Event button:', hasCreateEventButton);
    
    const hasMyEventsButton = content.includes('My Events');
    console.log('Has My Events button:', hasMyEventsButton);
    
    // Count stat cards
    const statCardCount = await page.locator('.hvac-stat-card').count();
    console.log('Number of stat cards:', statCardCount);
    expect(statCardCount).toBe(5); // Should have 5 stat cards
    
    // Get event count from dashboard
    const totalEventsValue = await page.locator('.hvac-stat-card:has-text("Total Events") .metric-value').textContent();
    console.log('Total events value:', totalEventsValue);
    
    // Check events table
    const hasEventsTable = content.includes('hvac-events-table');
    console.log('Has events table:', hasEventsTable);
    
    // Check filters
    const hasFilters = content.includes('hvac-event-filters');
    console.log('Has event filters:', hasFilters);
    
    console.log('=== End Dashboard Refactor Check ===\n');
    
    // Create a quick event to test if dashboard updates
    console.log('Creating test event...');
    await page.goto(`${staging_url}/manage-event`);
    
    // Wait for form to load
    await page.waitForLoadState('networkidle');
    await page.waitForTimeout(2000);
    
    // Save page content for debugging
    const formContent = await page.content();
    const fs = require('fs');
    fs.writeFileSync('manage-event-form.html', formContent);
    
    // Try to find title field
    const titleSelectors = ['#title', 'input[name="post_title"]', 'input[name="title"]', 'input[name="EventTitle"]'];
    let titleFilled = false;
    
    for (const selector of titleSelectors) {
      const titleField = await page.locator(selector).count();
      if (titleField > 0) {
        console.log(`Found title field with selector: ${selector}`);
        await page.fill(selector, `Dashboard Test Event ${Date.now()}`);
        titleFilled = true;
        break;
      }
    }
    
    if (!titleFilled) {
      console.log('Could not find title field, skipping event creation');
    }
    
    // Return to dashboard
    await page.goto(`${staging_url}/hvac-dashboard`);
    await page.waitForLoadState('networkidle');
    
    // Take final screenshot
    await page.screenshot({ path: 'refactored-dashboard-final.png', fullPage: true });
  });
});