File size: 2,818 Bytes
0e5f52f 598911f 0e5f52f 598911f 0e5f52f 598911f 29ee1c2 0e5f52f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 |
import { useState, useCallback } from 'react'
import Button from '@/components/ui/Button'
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
DialogTrigger
} from '@/components/ui/Dialog'
import FileUploader from '@/components/ui/FileUploader'
import { toast } from 'sonner'
import { errorMessage } from '@/lib/utils'
import { uploadDocument } from '@/api/lightrag'
import { UploadIcon } from 'lucide-react'
export default function UploadDocumentsDialog() {
const [open, setOpen] = useState(false)
const [isUploading, setIsUploading] = useState(false)
const [progresses, setProgresses] = useState<Record<string, number>>({})
const handleDocumentsUpload = useCallback(
async (filesToUpload: File[]) => {
setIsUploading(true)
try {
await Promise.all(
filesToUpload.map(async (file) => {
try {
const result = await uploadDocument(file, (percentCompleted: number) => {
console.debug(`Uploading ${file.name}: ${percentCompleted}%`)
setProgresses((pre) => ({
...pre,
[file.name]: percentCompleted
}))
})
if (result.status === 'success') {
toast.success(`Upload Success:\n${file.name} uploaded successfully`)
} else {
toast.error(`Upload Failed:\n${file.name}\n${result.message}`)
}
} catch (err) {
toast.error(`Upload Failed:\n${file.name}\n${errorMessage(err)}`)
}
})
)
} catch (err) {
toast.error('Upload Failed\n' + errorMessage(err))
} finally {
setIsUploading(false)
// setOpen(false)
}
},
[setIsUploading, setProgresses]
)
return (
<Dialog
open={open}
onOpenChange={(open) => {
if (isUploading && !open) {
return
}
setOpen(open)
}}
>
<DialogTrigger asChild>
<Button variant="default" side="bottom" tooltip="Upload documents" size="sm">
<UploadIcon /> Upload
</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-xl" onCloseAutoFocus={(e) => e.preventDefault()}>
<DialogHeader>
<DialogTitle>Upload documents</DialogTitle>
<DialogDescription>
Drag and drop your documents here or click to browse.
</DialogDescription>
</DialogHeader>
<FileUploader
maxFileCount={Infinity}
maxSize={200 * 1024 * 1024}
description="supported types: TXT, MD, DOC, PDF, PPTX"
onUpload={handleDocumentsUpload}
progresses={progresses}
disabled={isUploading}
/>
</DialogContent>
</Dialog>
)
}
|