onedrive/components/previews/TextPreview.tsx
2021-09-04 15:15:09 +01:00

38 lines
1 KiB
TypeScript

import { FunctionComponent } from 'react'
import FourOhFour from '../FourOhFour'
import Loading from '../Loading'
import DownloadBtn from '../DownloadBtn'
import { useStaleSWR } from '../../utils/tools'
const TextPreview: FunctionComponent<{ file: any }> = ({ file }) => {
const { data, error } = useStaleSWR(file['@microsoft.graph.downloadUrl'])
if (error) {
return (
<div className="dark:bg-gray-900 p-3 bg-white rounded shadow">
<FourOhFour errorMsg={error.message} />
</div>
)
}
if (!data) {
return (
<div className="dark:bg-gray-900 p-3 bg-white rounded shadow">
<Loading loadingText="Loading file content..." />
</div>
)
}
return (
<>
<div className="dark:bg-gray-900 dark:text-gray-100 p-3 bg-white rounded shadow">
<pre className="md:p-3 p-0 overflow-scroll">{data}</pre>
</div>
<div className="mt-4">
<DownloadBtn downloadUrl={file['@microsoft.graph.downloadUrl']} />
</div>
</>
)
}
export default TextPreview