import React, { useState } from 'react' import PropTypes from 'prop-types' import BinaryFileHeader from './binary-file-header' import BinaryFileImage from './binary-file-image' import BinaryFileText from './binary-file-text' import Icon from '../../../shared/components/icon' import { useTranslation } from 'react-i18next' const imageExtensions = ['png', 'jpg', 'jpeg', 'gif'] const textExtensions = [ 'tex', 'latex', 'sty', 'cls', 'bst', 'bib', 'bibtex', 'txt', 'tikz', 'mtx', 'rtex', 'md', 'asy', 'latexmkrc', 'lbx', 'bbx', 'cbx', 'm', 'lco', 'dtx', 'ins', 'ist', 'def', 'clo', 'ldf', 'rmd', 'lua', 'gv', ] export default function BinaryFile({ file, storeReferencesKeys }) { const extension = file.name.split('.').pop().toLowerCase() const [contentLoading, setContentLoading] = useState(true) const [hasError, setHasError] = useState(false) const { t } = useTranslation() const isUnpreviewableFile = !imageExtensions.includes(extension) && !textExtensions.includes(extension) function handleLoading() { if (contentLoading) { setContentLoading(false) } } function handleError() { if (!hasError) { setContentLoading(false) setHasError(true) } } const content = ( <> {imageExtensions.includes(extension) && ( )} {textExtensions.includes(extension) && ( )} ) return (
{!hasError && content} {!isUnpreviewableFile && contentLoading && } {(isUnpreviewableFile || hasError) && (

{t('no_preview_available')}

)}
) } function BinaryFileLoadingIndicator() { const { t } = useTranslation() return (
  {t('loading')}…
) } BinaryFile.propTypes = { file: PropTypes.shape({ id: PropTypes.string, name: PropTypes.string, }).isRequired, storeReferencesKeys: PropTypes.func.isRequired, }