import { useEffect, useState } from "react";

const FilePreview = ({
  file,
  fallbackUrl,
}: {
  file?: File;
  fallbackUrl?: string;
}) => {
  const [src, setSrc] = useState<string | null>(fallbackUrl ?? null);

  useEffect(() => {
    if (!file) {
      setSrc(fallbackUrl ?? null);
      return;
    }

    const reader = new FileReader();
    reader.onload = () => setSrc(reader.result as string);
    reader.readAsDataURL(file);
  }, [file, fallbackUrl]);

  if (!src) return null;
  return (
    <img
      src={src}
      alt="Preview"
      className="w-full max-h-40 object-contain mt-2 rounded-md border"
    />
  );
};

export default FilePreview;
