// @ts-nocheck
import React from 'react';
import { describe, it, expect } from 'vitest';
import { render, screen } from '@testing-library/react';
import { SessionProgressMonitor } from '../../../../apps/companion/renderer/components/SessionProgressMonitor';

describe('SessionProgressMonitor', () => {
  describe('step display', () => {
    it('should display exactly 17 steps', () => {
      const progress = {
        sessionId: 'test-session-id',
        currentStep: 1,
        state: 'IN_PROGRESS',
        completedSteps: [],
        hasError: false,
        errorMessage: null
      };

      render(
        <SessionProgressMonitor 
          sessionId="test-session-id" 
          progress={progress} 
          isRunning={true} 
        />
      );

      // Should have exactly 17 step elements
      const stepElements = screen.getAllByText(/Navigate to Hosted Racing|Click Create a Race|Fill Race Information|Configure Server Details|Set Admins|Add Admin|Set Time Limits|Set Cars|Add Car|Set Car Classes|Set Track|Add Track|Configure Track Options|Set Time of Day|Configure Weather|Set Race Options|Set Track Conditions/);
      expect(stepElements).toHaveLength(17);
    });

    it('should NOT display "Configure Team Driving" step', () => {
      const progress = {
        sessionId: 'test-session-id',
        currentStep: 1,
        state: 'IN_PROGRESS',
        completedSteps: [],
        hasError: false,
        errorMessage: null
      };

      render(
        <SessionProgressMonitor 
          sessionId="test-session-id" 
          progress={progress} 
          isRunning={true} 
        />
      );

      // Should NOT find "Configure Team Driving"
      expect(screen.queryByText('Configure Team Driving')).toBeNull();
    });

    it('should display "Set Track Conditions" as step 17', () => {
      const progress = {
        sessionId: 'test-session-id',
        currentStep: 17,
        state: 'IN_PROGRESS',
        completedSteps: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16],
        hasError: false,
        errorMessage: null
      };

      render(
        <SessionProgressMonitor 
          sessionId="test-session-id" 
          progress={progress} 
          isRunning={true} 
        />
      );

      // Should find "Set Track Conditions" and it should be marked as current
      const trackConditionsElement = screen.getByText('Set Track Conditions');
      expect(trackConditionsElement).toBeTruthy();
      
      // Verify progress shows 16 / 17 (since we're on step 17 but haven't completed it yet)
      expect(screen.getByText(/Progress: 16 \/ 17 steps/)).toBeTruthy();
    });

    it('should show correct progress count with 17 total steps', () => {
      const progress = {
        sessionId: 'test-session-id',
        currentStep: 5,
        state: 'IN_PROGRESS',
        completedSteps: [1, 2, 3, 4],
        hasError: false,
        errorMessage: null
      };

      render(
        <SessionProgressMonitor 
          sessionId="test-session-id" 
          progress={progress} 
          isRunning={true} 
        />
      );

      // Should show "4 / 17 steps"
      expect(screen.getByText(/Progress: 4 \/ 17 steps/)).toBeTruthy();
    });
  });
});