import type { ComponentType } from 'react';

import type { AllFieldsEnum } from '@/api/types';

import type { ItemDataProps } from '../types';
import { FileDataAudio } from './FileDataAudio/FileDataAudio';
import { FileDataDocument } from './FileDataDocument/FileDataDocument';
import { FileDataImage } from './FileDataImage/FileDataImage';
import { FileDataVideo } from './FileDataVideo/FileDataVideo';

const FILE_DATA_BY_TYPE: Partial<Record<AllFieldsEnum, ComponentType<ItemDataProps>>> = {
  fileImage: FileDataImage,
  fileImageID: FileDataImage,
  fileImageLink: FileDataImage,
  fileAudio: FileDataAudio,
  fileAudioID: FileDataAudio,
  fileAudioLink: FileDataAudio,
  fileVideo: FileDataVideo,
  fileVideoID: FileDataVideo,
  fileDocument: FileDataDocument,
  fileDocumentID: FileDataDocument,
  fileDocumentLink: FileDataDocument,
};

export const FileData = (props: ItemDataProps) => {
  const Component = FILE_DATA_BY_TYPE[props.structure.type as AllFieldsEnum];
  if (!Component) {
    return null;
  }
  return <Component {...props} />;
};
