import * as React from 'react';
import { TextFilePreview } from '../TextFilePreview';
import { ImageFilePreview } from '../ImageFilePreview';
import { AudioFilePreview } from '../AudioFilePreview';
import { VideoFilePreview } from '../VideoFilePreview';
import { BinaryFilePreview } from '../BinaryFilePreview';
import { ContentType, getContentType } from '@/utils/blob';

const FILE_PREVIEW_COMPONENTS: Record<ContentType, React.ElementType> = {
  [ContentType.TEXT]: TextFilePreview,
  [ContentType.IMAGE]: ImageFilePreview,
  [ContentType.AUDIO]: AudioFilePreview,
  [ContentType.VIDEO]: VideoFilePreview,
  [ContentType.BINARY]: BinaryFilePreview,
};

export interface FilePreviewProps {
  fileList?: FileList;
  className?: string;
}

export const FilePreview: React.FC<FilePreviewProps> = ({
  fileList,
  className,
}) => {
  if ((fileList?.length ?? 0) < 1) {
    return null;
  }

  const f = fileList?.[0];
  const contentType = getContentType(f?.type, f?.name);
  const FilePreviewComponent = FILE_PREVIEW_COMPONENTS[contentType] ?? BinaryFilePreview;

  return (
    <FilePreviewComponent
      key={contentType}
      file={f}
      className={className}
      enhanced
    />
  );
};
