/**
 * @ai-summary Tests for StationCard component
 */

import { render, screen, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom';
import { StationCard } from '../../components/StationCard';
import { Station } from '../../types/stations.types';

jest.mock('@/core/api/client', () => ({
  apiClient: {
    get: jest.fn(() => Promise.resolve({ data: new Blob(['photo'], { type: 'image/jpeg' }) }))
  }
}));

const mockStation: Station = {
  placeId: 'test-place-id',
  name: 'Shell Gas Station',
  address: '123 Main St, San Francisco, CA 94105',
  latitude: 37.7749,
  longitude: -122.4194,
  rating: 4.2,
  distance: 250,
  photoReference: 'mock-photo-reference'
};

describe('StationCard', () => {
  beforeEach(() => {
    jest.clearAllMocks();
    window.open = jest.fn();

    // JSDOM may not implement these; mock for blob URL handling
    if (!global.URL.createObjectURL) {
      global.URL.createObjectURL = jest.fn(() => 'blob:mock-url');
    }
    if (!global.URL.revokeObjectURL) {
      global.URL.revokeObjectURL = jest.fn();
    }
  });

  describe('Rendering', () => {
    it('should render station name and address', () => {
      render(<StationCard station={mockStation} isSaved={false} />);

      expect(screen.getByText('Shell Gas Station')).toBeInTheDocument();
      expect(screen.getByText('123 Main St, San Francisco, CA 94105')).toBeInTheDocument();
    });

    it('should render station photo if available', async () => {
      render(<StationCard station={mockStation} isSaved={false} />);

      const photo = await screen.findByAltText('Shell Gas Station');
      expect(photo).toBeInTheDocument();
      expect(photo).toHaveAttribute('src', expect.stringContaining('blob:'));
    });

    it('should render rating when available', () => {
      render(<StationCard station={mockStation} isSaved={false} />);

      expect(screen.getByText('4.2')).toBeInTheDocument();
    });

    it('should render distance chip', () => {
      render(<StationCard station={mockStation} isSaved={false} />);

      expect(screen.getByText(/mi/)).toBeInTheDocument();
    });

    it('should not crash when photo is missing', () => {
      const stationWithoutPhoto = { ...mockStation, photoReference: undefined };
      render(<StationCard station={stationWithoutPhoto} isSaved={false} />);

      expect(screen.getByText('Shell Gas Station')).toBeInTheDocument();
    });
  });

  describe('Save/Delete Actions', () => {
    it('should call onSave when bookmark button clicked (not saved)', () => {
      const onSave = jest.fn();
      render(<StationCard station={mockStation} isSaved={false} onSave={onSave} />);

      const bookmarkButton = screen.getByTitle('Add to favorites');
      fireEvent.click(bookmarkButton);

      expect(onSave).toHaveBeenCalledWith(mockStation);
    });

    it('should call onDelete when bookmark button clicked (saved)', () => {
      const onDelete = jest.fn();
      render(<StationCard station={mockStation} isSaved={true} onDelete={onDelete} />);

      const bookmarkButton = screen.getByTitle('Remove from favorites');
      fireEvent.click(bookmarkButton);

      expect(onDelete).toHaveBeenCalledWith(mockStation.placeId);
    });

    it('should show filled bookmark icon when saved', () => {
      render(<StationCard station={mockStation} isSaved={true} />);

      const bookmarkButton = screen.getByTitle('Remove from favorites');
      expect(bookmarkButton).toBeInTheDocument();
    });

    it('should show outline bookmark icon when not saved', () => {
      render(<StationCard station={mockStation} isSaved={false} />);

      const bookmarkButton = screen.getByTitle('Add to favorites');
      expect(bookmarkButton).toBeInTheDocument();
    });
  });

  describe('Directions Link', () => {
    it('should open Google Maps when directions button clicked', () => {
      render(<StationCard station={mockStation} isSaved={false} />);

      const directionsButton = screen.getByTitle('Get directions');
      fireEvent.click(directionsButton);

      expect(window.open).toHaveBeenCalledWith(
        expect.stringContaining('google.com/maps'),
        '_blank'
      );
    });

    it('should encode address in directions URL', () => {
      render(<StationCard station={mockStation} isSaved={false} />);

      const directionsButton = screen.getByTitle('Get directions');
      fireEvent.click(directionsButton);

      expect(window.open).toHaveBeenCalledWith(
        expect.stringContaining(encodeURIComponent(mockStation.address)),
        '_blank'
      );
    });
  });

  describe('Touch Targets', () => {
    it('should have minimum 44px button heights', () => {
      const { container } = render(<StationCard station={mockStation} isSaved={false} />);

      const buttons = container.querySelectorAll('button');
      buttons.forEach((button) => {
        const styles = window.getComputedStyle(button);
        const minHeight = parseInt(styles.minHeight);
        expect(minHeight).toBeGreaterThanOrEqual(44);
      });
    });
  });

  describe('Card Selection', () => {
    it('should call onSelect when card is clicked', () => {
      const onSelect = jest.fn();
      render(<StationCard station={mockStation} isSaved={false} onSelect={onSelect} />);

      const card = screen.getByText('Shell Gas Station').closest('.MuiCard-root');
      if (card) {
        fireEvent.click(card);
        expect(onSelect).toHaveBeenCalledWith(mockStation);
      }
    });

    it('should not call onSelect when button is clicked', () => {
      const onSelect = jest.fn();
      render(<StationCard station={mockStation} isSaved={false} onSelect={onSelect} />);

      const directionsButton = screen.getByTitle('Get directions');
      fireEvent.click(directionsButton);

      expect(onSelect).not.toHaveBeenCalled();
    });
  });
});
