'use client';

import { Card, CardContent } from '@/components/ui/card';

import { TicketDetectionPreview } from './TicketDetectionPreview';

interface TicketDetectionPreviewCardProps {
  ticketId: string;
  videoId?: string | null;
  assignmentId: number;
}

export function TicketDetectionPreviewCard({
  ticketId,
  videoId,
  assignmentId,
}: TicketDetectionPreviewCardProps) {
  if (!videoId) return null;

  return (
    <Card className="w-full">
      <CardContent className="p-5">
        <div className="min-w-0">
          <TicketDetectionPreview
            key={`${videoId}:${assignmentId}`}
            ticketId={ticketId}
            videoId={videoId}
            assignmentId={assignmentId}
          />
        </div>
      </CardContent>
    </Card>
  );
}