frontend/src/components/generation-card.test.tsx

import { describe, it, expect, vi } from 'vitest';
import { render, screen } from '@testing-library/react';
import { GenerationCard } from './generation-card';
import { GenerationResponse } from '@/lib/api';

// Mock the WebSocket hook
vi.mock('@/hooks/use-websocket', () => ({
  useGenerationWebSocket: () => ({
    lastMessage: null,
    status: 'connected'
  })
}));

// Mock AudioPlayer to check if it receives correct props
vi.mock('@/components/audio-player', () => ({
  AudioPlayer: ({ src }: { src: string }) => <div data-testid="audio-player" data-src={src}>Audio Player Mock</div>
}));

describe('GenerationCard', () => {
  const mockGeneration: GenerationResponse = {
    id: '123',
    status: 'completed',
    audio_path: '/music/test.wav',
    metadata: {
      prompt: 'Test prompt',
      analysis: {
        style: 'Rock',
        tempo: '120',
        mood: 'Energetic'
      }
    },
    processing_time_seconds: 10,
    created_at: new Date().toISOString()
  };

  it('renders audio player when status is completed', () => {
    render(<GenerationCard generation={mockGeneration} />);
    
    expect(screen.getByText('Completed')).toBeInTheDocument();
    
    const audioPlayer = screen.getByTestId('audio-player');
    expect(audioPlayer).toBeInTheDocument();
    
    // Check URL construction logic (default API URL when env not set)
    expect(audioPlayer).toHaveAttribute('data-src', 'http://localhost:8000/music/test.wav');
  });

  it('does not render audio player when processing', () => {
    const processingGen = { ...mockGeneration, status: 'processing', audio_path: null };
    render(<GenerationCard generation={processingGen} />);
    
    expect(screen.queryByTestId('audio-player')).not.toBeInTheDocument();
    expect(screen.getByText('Generating...')).toBeInTheDocument();
  });

  it('renders error message when failed', () => {
    const failedGen = { ...mockGeneration, status: 'failed', error_message: 'GPU Error', audio_path: null };
    render(<GenerationCard generation={failedGen} />);
    
    expect(screen.getByText('Failed')).toBeInTheDocument();
    expect(screen.getByText('GPU Error')).toBeInTheDocument();
    expect(screen.queryByTestId('audio-player')).not.toBeInTheDocument();
  });
});