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

test.describe('Dashboard Event Statistics After Author Fix', () => {
  test('events should now appear on trainer dashboard', 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!');
    // Use the correct submit button selector
    await page.click('input[type="submit"]');
    await page.waitForTimeout(3000);

    // Go to dashboard
    await page.goto(`${staging_url}/hvac-dashboard`);
    await page.waitForLoadState('networkidle');

    // Check event statistics
    const totalEventsElement = await page.locator('.metric-value').first();
    const totalEventsText = await totalEventsElement.textContent();
    console.log('Total events shown on dashboard:', totalEventsText);
    
    // Verify the event count is greater than 0  
    const eventCount = parseInt(totalEventsText || '0');
    console.log('Event count on dashboard:', eventCount);
    
    // Create a test event to verify author assignment is working
    await page.goto(`${staging_url}/manage-event`);
    await page.waitForLoadState('networkidle');

    // Fill basic event details
    const eventName = `Author Test ${Date.now()}`;
    await page.fill('input[id="title"]', eventName);
    
    // Fill description - check if TinyMCE exists
    const tinyMceExists = await page.locator('#wp-tcepostcontent-editor-container iframe').count() > 0;
    if (tinyMceExists) {
      const iframe = page.frameLocator('#wp-tcepostcontent-editor-container iframe');
      await iframe.locator('body').fill('Test event description with author fix');
    } else {
      // Try regular textarea
      await page.fill('textarea[id="tcepostcontent"]', 'Test event description with author fix');
    }

    // Set event date
    const tomorrow = new Date();
    tomorrow.setDate(tomorrow.getDate() + 1);
    const dateStr = `${String(tomorrow.getMonth() + 1).padStart(2, '0')}/${String(tomorrow.getDate()).padStart(2, '0')}/${tomorrow.getFullYear()}`;
    await page.fill('#EventStartDate', dateStr);
    await page.fill('#EventEndDate', dateStr);

    // Fill minimal venue details
    await page.fill('#venue', 'Test Venue');
    await page.fill('#venue-address', '123 Test St');
    await page.fill('#venue-city', 'Miami');
    await page.selectOption('#venue-state-province', 'FL');
    await page.fill('#venue-zip', '33101');

    // Submit the event
    await page.click('button[type="submit"]');
    await page.waitForTimeout(5000);

    // Go back to dashboard to check if event count increased
    await page.goto(`${staging_url}/hvac-dashboard`);
    await page.waitForLoadState('networkidle');
    
    const newTotalEventsText = await page.locator('.metric-value').first().textContent();
    const newEventCount = parseInt(newTotalEventsText || '0');
    console.log('New event count on dashboard:', newEventCount);
    
    // Should have increased
    expect(newEventCount).toBeGreaterThan(eventCount);
    
    // Verify the event appears in My Events
    await page.goto(`${staging_url}/my-events`);
    await page.waitForLoadState('networkidle');
    
    // Check if our event is listed
    const eventListed = await page.locator(`text=${eventName}`).count() > 0;
    expect(eventListed).toBe(true);
    console.log(`Event "${eventName}" found in My Events: ${eventListed}`);
  });
});