63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
import { FilesController } from '@/Controllers/FilesController'
|
|
import { NoPreviewIllustration } from '@standardnotes/icons'
|
|
import { FileItem } from '@standardnotes/snjs'
|
|
import Button from '../Button/Button'
|
|
|
|
type Props = {
|
|
file: FileItem
|
|
filesController: FilesController
|
|
isFilePreviewable: boolean
|
|
tryAgainCallback: () => void
|
|
}
|
|
|
|
const FilePreviewError = ({ file, filesController, isFilePreviewable, tryAgainCallback }: Props) => {
|
|
return (
|
|
<div className="flex flex-col justify-center items-center flex-grow">
|
|
<NoPreviewIllustration className="w-30 h-30 mb-4" />
|
|
<div className="font-bold text-base mb-2">This file can't be previewed.</div>
|
|
{isFilePreviewable ? (
|
|
<>
|
|
<div className="text-sm text-center color-passive-0 mb-4 max-w-35ch">
|
|
There was an error loading the file. Try again, or download the file and open it using another application.
|
|
</div>
|
|
<div className="flex items-center">
|
|
<Button
|
|
variant="primary"
|
|
className="mr-3"
|
|
onClick={() => {
|
|
tryAgainCallback()
|
|
}}
|
|
>
|
|
Try again
|
|
</Button>
|
|
<Button
|
|
variant="normal"
|
|
onClick={() => {
|
|
filesController.downloadFile(file).catch(console.error)
|
|
}}
|
|
>
|
|
Download
|
|
</Button>
|
|
</div>
|
|
</>
|
|
) : (
|
|
<>
|
|
<div className="text-sm text-center color-passive-0 mb-4 max-w-35ch">
|
|
To view this file, download it and open it using another application.
|
|
</div>
|
|
<Button
|
|
variant="primary"
|
|
onClick={() => {
|
|
filesController.downloadFile(file).catch(console.error)
|
|
}}
|
|
>
|
|
Download
|
|
</Button>
|
|
</>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default FilePreviewError
|