use second request for paging instead of expand children
This commit is contained in:
parent
97f4250a57
commit
091e97f211
2 changed files with 31 additions and 21 deletions
|
@ -123,7 +123,6 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const resp = data.data
|
|
||||||
const fileIsImage = (fileName: string) => {
|
const fileIsImage = (fileName: string) => {
|
||||||
const fileExtension = getExtension(fileName)
|
const fileExtension = getExtension(fileName)
|
||||||
if (hasKey(extensions, fileExtension)) {
|
if (hasKey(extensions, fileExtension)) {
|
||||||
|
@ -134,8 +133,8 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
if ('folder' in resp) {
|
if ('folderData' in data) {
|
||||||
const { children } = resp
|
const { value } = data.folderData
|
||||||
|
|
||||||
// Image preview rendering preparations
|
// Image preview rendering preparations
|
||||||
const imagesInFolder: ImageDecorator[] = []
|
const imagesInFolder: ImageDecorator[] = []
|
||||||
|
@ -146,7 +145,7 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
let renderReadme = false
|
let renderReadme = false
|
||||||
let readmeFile = null
|
let readmeFile = null
|
||||||
|
|
||||||
children.forEach((c: any) => {
|
value.forEach((c: any) => {
|
||||||
if (fileIsImage(c.name)) {
|
if (fileIsImage(c.name)) {
|
||||||
imagesInFolder.push({
|
imagesInFolder.push({
|
||||||
src: c['@microsoft.graph.downloadUrl'],
|
src: c['@microsoft.graph.downloadUrl'],
|
||||||
|
@ -218,7 +217,7 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{children.map((c: any) => (
|
{value.map((c: any) => (
|
||||||
<div className="hover:bg-gray-100 dark:hover:bg-gray-850 grid grid-cols-12" key={c.id}>
|
<div className="hover:bg-gray-100 dark:hover:bg-gray-850 grid grid-cols-12" key={c.id}>
|
||||||
<div
|
<div
|
||||||
className="col-span-11"
|
className="col-span-11"
|
||||||
|
@ -281,9 +280,10 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
if ('file' in resp) {
|
if ('identityData' in data) {
|
||||||
const downloadUrl = resp['@microsoft.graph.downloadUrl']
|
const { identityData } = data
|
||||||
const fileName = resp.name
|
const downloadUrl = identityData['@microsoft.graph.downloadUrl']
|
||||||
|
const fileName = data.identityData.name
|
||||||
const fileExtension = fileName.slice(((fileName.lastIndexOf('.') - 1) >>> 0) + 2).toLowerCase()
|
const fileExtension = fileName.slice(((fileName.lastIndexOf('.') - 1) >>> 0) + 2).toLowerCase()
|
||||||
|
|
||||||
if (hasKey(extensions, fileExtension)) {
|
if (hasKey(extensions, fileExtension)) {
|
||||||
|
@ -297,25 +297,25 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
)
|
)
|
||||||
|
|
||||||
case preview.text:
|
case preview.text:
|
||||||
return <TextPreview file={resp} />
|
return <TextPreview file={identityData} />
|
||||||
|
|
||||||
case preview.code:
|
case preview.code:
|
||||||
return <CodePreview file={resp} />
|
return <CodePreview file={identityData} />
|
||||||
|
|
||||||
case preview.markdown:
|
case preview.markdown:
|
||||||
return <MarkdownPreview file={resp} path={path} />
|
return <MarkdownPreview file={identityData} path={path} />
|
||||||
|
|
||||||
case preview.video:
|
case preview.video:
|
||||||
return <VideoPreview file={resp} />
|
return <VideoPreview file={identityData} />
|
||||||
|
|
||||||
case preview.audio:
|
case preview.audio:
|
||||||
return <AudioPreview file={resp} />
|
return <AudioPreview file={identityData} />
|
||||||
|
|
||||||
case preview.pdf:
|
case preview.pdf:
|
||||||
return <PDFPreview file={resp} />
|
return <PDFPreview file={identityData} />
|
||||||
|
|
||||||
case preview.office:
|
case preview.office:
|
||||||
return <OfficePreview file={resp} />
|
return <OfficePreview file={identityData} />
|
||||||
|
|
||||||
default:
|
default:
|
||||||
return <div className="dark:bg-gray-900 bg-white rounded shadow">{fileName}</div>
|
return <div className="dark:bg-gray-900 bg-white rounded shadow">{fileName}</div>
|
||||||
|
@ -326,7 +326,7 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
<>
|
<>
|
||||||
<div className="dark:bg-gray-900 p-3 bg-white rounded shadow">
|
<div className="dark:bg-gray-900 p-3 bg-white rounded shadow">
|
||||||
<FourOhFour
|
<FourOhFour
|
||||||
errorMsg={`Preview for file ${resp.name} is not available, download directly with the button below.`}
|
errorMsg={`Preview for file ${identityData.name} is not available, download directly with the button below.`}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="mt-4">
|
<div className="mt-4">
|
||||||
|
@ -338,7 +338,7 @@ const FileListing: FunctionComponent<{ query?: ParsedUrlQuery }> = ({ query }) =
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="dark:bg-gray-900 p-3 bg-white rounded shadow">
|
<div className="dark:bg-gray-900 p-3 bg-white rounded shadow">
|
||||||
<FourOhFour errorMsg={`Cannot preview ${resp.name}.`} />
|
<FourOhFour errorMsg={`Cannot preview ${path}.`} />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -112,15 +112,25 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Normal query selecting and expanding every children in current directory
|
// Querying current path identity (file or folder) and follow up query childrens in folder
|
||||||
const { data } = await axios.get(requestUrl, {
|
const { data: identityData } = await axios.get(requestUrl, {
|
||||||
headers: { Authorization: `Bearer ${accessToken}` },
|
headers: { Authorization: `Bearer ${accessToken}` },
|
||||||
params: {
|
params: {
|
||||||
select: '@microsoft.graph.downloadUrl,name,size,id,lastModifiedDateTime,folder,file',
|
select: '@microsoft.graph.downloadUrl,name,size,id,lastModifiedDateTime,folder,file',
|
||||||
expand: 'children(select=@content.downloadUrl,name,lastModifiedDateTime,eTag,size,id,folder,file)',
|
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
res.status(200).json({ path, data })
|
|
||||||
|
if ('folder' in identityData) {
|
||||||
|
const { data: folderData } = await axios.get(`${requestUrl}:/children`, {
|
||||||
|
headers: { Authorization: `Bearer ${accessToken}` },
|
||||||
|
params: {
|
||||||
|
select: '@microsoft.graph.downloadUrl,name,size,id,lastModifiedDateTime,folder,file',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
res.status(200).json({ path, identityData, folderData })
|
||||||
|
return
|
||||||
|
}
|
||||||
|
res.status(200).json({ path, identityData })
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue