import { FileText, Film, Image, Sheet } from 'lucide-react';

import { cn } from '@/lib/utils';

interface FileIconProps {
  mimeType: string | null;
  className?: string;
}

/**
 * Shared file-type icon mapping. Same colour/glyph palette across FileGrid
 * and EntityFolderView so rows in the two surfaces read identically.
 */
export function FileIcon({ mimeType, className }: FileIconProps) {
  const base = cn('shrink-0', className ?? 'h-3.5 w-3.5');

  if (!mimeType) return <FileText className={cn(base, 'text-muted-foreground')} />;
  // eslint-disable-next-line jsx-a11y/alt-text
  if (mimeType.startsWith('image/')) return <Image className={cn(base, 'text-blue-500')} />;
  if (mimeType === 'application/pdf') return <FileText className={cn(base, 'text-red-500')} />;
  if (
    mimeType === 'application/vnd.ms-excel' ||
    mimeType === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' ||
    mimeType === 'text/csv'
  ) {
    return <Sheet className={cn(base, 'text-green-600')} />;
  }
  if (mimeType.startsWith('video/')) return <Film className={cn(base, 'text-purple-500')} />;
  return <FileText className={cn(base, 'text-muted-foreground')} />;
}
