rename useAxiosFetch hook for universal fetch usage
This commit is contained in:
parent
bfbe4eb042
commit
0b55fe5fc7
|
@ -2,14 +2,14 @@ import { useEffect, FC } from 'react'
|
|||
import Prism from 'prismjs'
|
||||
|
||||
import { getExtension } from '../../utils/getFileIcon'
|
||||
import useFileContent from '../../utils/fetchOnMount'
|
||||
import useAxiosGet from '../../utils/fetchOnMount'
|
||||
import FourOhFour from '../FourOhFour'
|
||||
import Loading from '../Loading'
|
||||
import DownloadButtonGroup from '../DownloadBtnGtoup'
|
||||
import { DownloadBtnContainer, PreviewContainer } from './Containers'
|
||||
|
||||
const CodePreview: FC<{ file: any }> = ({ file }) => {
|
||||
const { content, error, validating } = useFileContent(file['@microsoft.graph.downloadUrl'])
|
||||
const { content, error, validating } = useAxiosGet(file['@microsoft.graph.downloadUrl'])
|
||||
|
||||
useEffect(() => {
|
||||
if (typeof window !== 'undefined') {
|
||||
|
|
|
@ -11,7 +11,7 @@ import 'katex/dist/katex.min.css'
|
|||
import FourOhFour from '../FourOhFour'
|
||||
import Loading from '../Loading'
|
||||
import DownloadButtonGroup from '../DownloadBtnGtoup'
|
||||
import useFileContent from '../../utils/fetchOnMount'
|
||||
import useAxiosGet from '../../utils/fetchOnMount'
|
||||
import { DownloadBtnContainer, PreviewContainer } from './Containers'
|
||||
|
||||
const MarkdownPreview: FC<{ file: any; path: string; standalone?: boolean }> = ({
|
||||
|
@ -19,7 +19,7 @@ const MarkdownPreview: FC<{ file: any; path: string; standalone?: boolean }> = (
|
|||
path,
|
||||
standalone = true,
|
||||
}) => {
|
||||
const { content, error, validating } = useFileContent(file['@microsoft.graph.downloadUrl'])
|
||||
const { content, error, validating } = useAxiosGet(file['@microsoft.graph.downloadUrl'])
|
||||
|
||||
// The parent folder of the markdown file, which is also the relative image folder
|
||||
const parentPath = path.substring(0, path.lastIndexOf('/'))
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
import FourOhFour from '../FourOhFour'
|
||||
import Loading from '../Loading'
|
||||
import DownloadButtonGroup from '../DownloadBtnGtoup'
|
||||
import useFileContent from '../../utils/fetchOnMount'
|
||||
import useAxiosGet from '../../utils/fetchOnMount'
|
||||
import { DownloadBtnContainer, PreviewContainer } from './Containers'
|
||||
|
||||
const TextPreview = ({ file }) => {
|
||||
const { content, error, validating } = useFileContent(file['@microsoft.graph.downloadUrl'])
|
||||
const { content, error, validating } = useAxiosGet(file['@microsoft.graph.downloadUrl'])
|
||||
if (error) {
|
||||
return (
|
||||
<PreviewContainer>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import FourOhFour from '../FourOhFour'
|
||||
import Loading from '../Loading'
|
||||
import { DownloadButton } from '../DownloadBtnGtoup'
|
||||
import useFileContent from '../../utils/fetchOnMount'
|
||||
import useAxiosGet from '../../utils/fetchOnMount'
|
||||
import { DownloadBtnContainer, PreviewContainer } from './Containers'
|
||||
|
||||
const parseDotUrl = (content: string): string | undefined => {
|
||||
|
@ -12,7 +12,7 @@ const parseDotUrl = (content: string): string | undefined => {
|
|||
}
|
||||
|
||||
const TextPreview = ({ file }) => {
|
||||
const { content, error, validating } = useFileContent(file['@microsoft.graph.downloadUrl'])
|
||||
const { content, error, validating } = useAxiosGet(file['@microsoft.graph.downloadUrl'])
|
||||
if (error) {
|
||||
return (
|
||||
<PreviewContainer>
|
||||
|
|
|
@ -2,19 +2,19 @@ import axios from 'axios'
|
|||
import { useEffect, useState } from 'react'
|
||||
|
||||
// Custom hook to fetch raw file content on mount
|
||||
export default function useFileContent(odRawUrl: string): { content: string; error: string; validating: boolean } {
|
||||
export default function useAxiosGet(fetchUrl: string): { content: string; error: string; validating: boolean } {
|
||||
const [content, setContent] = useState('')
|
||||
const [validating, setValidating] = useState(true)
|
||||
const [error, setError] = useState('')
|
||||
|
||||
useEffect(() => {
|
||||
axios
|
||||
.get(odRawUrl)
|
||||
.get(fetchUrl)
|
||||
.then(res => setContent(res.data))
|
||||
.catch(e => setError(e.message))
|
||||
.finally(() => {
|
||||
setValidating(false)
|
||||
})
|
||||
}, [odRawUrl])
|
||||
}, [fetchUrl])
|
||||
return { content, error, validating }
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue