import { useLanguage } from '../../../contexts/LanguageContext';
import styles from '../FilePreview.module.css';

interface UnsupportedRendererProps {
  previewUrl: string;
  fileName: string;
}

export function UnsupportedRenderer({ previewUrl, fileName }: UnsupportedRendererProps) {
  const { t } = useLanguage();

  return (
    <div className={styles.unsupportedContainer}>
      <div className={styles.unsupportedIcon}>📄</div>
      <p>{t('files.preview.unsupported', 'Preview not available for this file type')}</p>
      <p className={styles.fileName}>{fileName}</p>
      <a 
        href={previewUrl} 
        download={fileName}
        className={styles.downloadButton}
      >
        {t('files.action.download', 'Download')}
      </a>
    </div>
  );
}
