import type { MatchCardViewModel, MatchCardVariant } from './MatchCardViewModel'
import { MatchCardCompact } from './MatchCardCompact'
import { MatchCardExpanded } from './MatchCardExpanded'
import { MatchCardReview } from './MatchCardReview'
import { MatchCardCompareMini } from './MatchCardCompareMini'
import { MatchCardSkeleton } from './MatchCardSkeleton'
import { MatchCardRestrictedState } from './MatchCardRestrictedState'

interface Props {
  viewModel: MatchCardViewModel
  variant?: MatchCardVariant
  isLoading?: boolean
  onRemoveCompare?: () => void
}

export function MatchCard({ viewModel, variant = 'compact', isLoading, onRemoveCompare }: Props) {
  if (isLoading) {
    return (
      <MatchCardSkeleton
        variant={variant === 'compare-mini' ? 'compare-mini' : variant === 'expanded' ? 'expanded' : 'compact'}
      />
    )
  }

  if (viewModel.isRestricted) return <MatchCardRestrictedState />

  switch (variant) {
    case 'expanded':
      return <MatchCardExpanded vm={viewModel} />
    case 'review':
      return <MatchCardReview vm={viewModel} />
    case 'compare-mini':
      return <MatchCardCompareMini vm={viewModel} onRemove={onRemoveCompare} />
    default:
      return <MatchCardCompact vm={viewModel} />
  }
}
