File "default-file-preview.tsx"
Full Path: /home/markqprx/iniasli.pro/client/uploads/preview/file-preview/default-file-preview.tsx
File size: 1.38 KB
MIME-type: text/plain
Charset: utf-8
import {ReactNode, useContext} from 'react';
import clsx from 'clsx';
import {Button} from '../../../ui/buttons/button';
import {downloadFileFromUrl} from '../../utils/download-file-from-url';
import {FilePreviewContext} from '../file-preview-context';
import {Trans} from '../../../i18n/trans';
import {FilePreviewProps} from './file-preview-props';
import {useFileEntryUrls} from '../../hooks/file-entry-urls';
interface Props extends FilePreviewProps {
message?: ReactNode;
}
export function DefaultFilePreview({message, className, allowDownload}: Props) {
const {entries, activeIndex} = useContext(FilePreviewContext);
const activeEntry = entries[activeIndex];
const content = message || <Trans message="No file preview available" />;
const {downloadUrl} = useFileEntryUrls(activeEntry);
return (
<div
className={clsx(
className,
'shadow bg-paper max-w-400 w-[calc(100%-40px)] text-center p-40 rounded'
)}
>
<div className="text-lg">{content}</div>
{allowDownload && (
<div className="block mt-20 text-center">
<Button
variant="flat"
color="primary"
onClick={() => {
if (downloadUrl) {
downloadFileFromUrl(downloadUrl);
}
}}
>
<Trans message="Download" />
</Button>
</div>
)}
</div>
);
}