import React from "react";

type FileData = {
  url: string;
  format: string;
  fileName?: string;
};

interface FileThumbnailProps {
  file: FileData;
}

const FileTextThumbnail: React.FC<FileThumbnailProps> = ({ file }) => {
  const format = file.format.toLowerCase();

  if ([".jpg", ".jpeg", ".png", ".webp"].includes(format)) {
    return (
      <img
        className="object-cover h-[60px] w-[80px] rounded-md"
        src={file.url}
        alt={file.fileName}
      />
    );
  }

  return (
    <div className="h-[60px] w-[80px] flex items-center justify-center bg-gray-200 text-sm text-center text-gray-700 rounded-md">
      {format.replace(".", "").toUpperCase()}
    </div>
  );
};

export default FileTextThumbnail;