import {Dialog, DialogContent, DialogHeader, DialogTitle} from '@/components/ui/dialog';
import type {Artwork} from '@/types';

interface ArtworkDetailProps {
  artwork: Artwork | null;
  open: boolean;
  onOpenChange: (open: boolean) => void;
}

export const ArtworkDetail = ({artwork, open, onOpenChange}: ArtworkDetailProps) => {
  if (!artwork) return null;

  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
      <DialogContent className="max-w-4xl">
        <DialogHeader>
          <DialogTitle className="text-2xl">{artwork.title}</DialogTitle>
        </DialogHeader>
        <div className="mt-4">
          <img src={artwork.imageUrl} alt={artwork.title} className="w-full rounded-lg object-contain max-h-[60vh]" />
        </div>
      </DialogContent>
    </Dialog>
  );
};
