|
@@ -3,7 +3,6 @@ import {
|
|
|
useCallback,
|
|
|
useState,
|
|
|
} from 'react'
|
|
|
-import useSWR from 'swr'
|
|
|
import { useParams } from 'next/navigation'
|
|
|
import produce from 'immer'
|
|
|
import { v4 as uuid4 } from 'uuid'
|
|
@@ -15,113 +14,19 @@ import {
|
|
|
getSupportFileType,
|
|
|
isAllowedFileExtension,
|
|
|
} from './utils'
|
|
|
-import {
|
|
|
- AUDIO_SIZE_LIMIT,
|
|
|
- FILE_SIZE_LIMIT,
|
|
|
- IMG_SIZE_LIMIT,
|
|
|
- VIDEO_SIZE_LIMIT,
|
|
|
-} from '@/app/components/base/file-uploader/constants'
|
|
|
+import { FILE_SIZE_LIMIT } from './constants'
|
|
|
import { useToastContext } from '@/app/components/base/toast'
|
|
|
import { TransferMethod } from '@/types/app'
|
|
|
import { SupportUploadFileTypes } from '@/app/components/workflow/types'
|
|
|
import type { FileUpload } from '@/app/components/base/features/types'
|
|
|
import { formatFileSize } from '@/utils/format'
|
|
|
-import { fetchFileUploadConfig, fetchRemoteFileInfo } from '@/service/common'
|
|
|
-
|
|
|
-export const useFileSizeLimit = () => {
|
|
|
- const { data: fileUploadConfigResponse } = useSWR({ url: '/files/upload' }, fetchFileUploadConfig)
|
|
|
- const imgSizeLimit = Number(fileUploadConfigResponse?.image_file_size_limit) * 1024 * 1024 || IMG_SIZE_LIMIT
|
|
|
- const docSizeLimit = Number(fileUploadConfigResponse?.file_size_limit) * 1024 * 1024 || FILE_SIZE_LIMIT
|
|
|
- const audioSizeLimit = Number(fileUploadConfigResponse?.audio_file_size_limit) * 1024 * 1024 || AUDIO_SIZE_LIMIT
|
|
|
- const videoSizeLimit = Number(fileUploadConfigResponse?.video_file_size_limit) * 1024 * 1024 || VIDEO_SIZE_LIMIT
|
|
|
-
|
|
|
- return {
|
|
|
- imgSizeLimit,
|
|
|
- docSizeLimit,
|
|
|
- audioSizeLimit,
|
|
|
- videoSizeLimit,
|
|
|
- }
|
|
|
-}
|
|
|
+import { fetchRemoteFileInfo } from '@/service/common'
|
|
|
|
|
|
export const useFile = (fileConfig: FileUpload) => {
|
|
|
const { t } = useTranslation()
|
|
|
const { notify } = useToastContext()
|
|
|
const fileStore = useFileStore()
|
|
|
const params = useParams()
|
|
|
- const { imgSizeLimit, docSizeLimit, audioSizeLimit, videoSizeLimit } = useFileSizeLimit()
|
|
|
-
|
|
|
- const checkSizeLimit = (fileType: string, fileSize: number) => {
|
|
|
- switch (fileType) {
|
|
|
- case SupportUploadFileTypes.image: {
|
|
|
- if (fileSize > imgSizeLimit) {
|
|
|
- notify({
|
|
|
- type: 'error',
|
|
|
- message: t('common.fileUploader.uploadFromComputerLimit', {
|
|
|
- type: SupportUploadFileTypes.image,
|
|
|
- size: formatFileSize(imgSizeLimit),
|
|
|
- }),
|
|
|
- })
|
|
|
- return false
|
|
|
- }
|
|
|
- return true
|
|
|
- }
|
|
|
- case SupportUploadFileTypes.document: {
|
|
|
- if (fileSize > docSizeLimit) {
|
|
|
- notify({
|
|
|
- type: 'error',
|
|
|
- message: t('common.fileUploader.uploadFromComputerLimit', {
|
|
|
- type: SupportUploadFileTypes.document,
|
|
|
- size: formatFileSize(docSizeLimit),
|
|
|
- }),
|
|
|
- })
|
|
|
- return false
|
|
|
- }
|
|
|
- return true
|
|
|
- }
|
|
|
- case SupportUploadFileTypes.audio: {
|
|
|
- if (fileSize > audioSizeLimit) {
|
|
|
- notify({
|
|
|
- type: 'error',
|
|
|
- message: t('common.fileUploader.uploadFromComputerLimit', {
|
|
|
- type: SupportUploadFileTypes.audio,
|
|
|
- size: formatFileSize(audioSizeLimit),
|
|
|
- }),
|
|
|
- })
|
|
|
- return false
|
|
|
- }
|
|
|
- return true
|
|
|
- }
|
|
|
- case SupportUploadFileTypes.video: {
|
|
|
- if (fileSize > videoSizeLimit) {
|
|
|
- notify({
|
|
|
- type: 'error',
|
|
|
- message: t('common.fileUploader.uploadFromComputerLimit', {
|
|
|
- type: SupportUploadFileTypes.video,
|
|
|
- size: formatFileSize(videoSizeLimit),
|
|
|
- }),
|
|
|
- })
|
|
|
- return false
|
|
|
- }
|
|
|
- return true
|
|
|
- }
|
|
|
- case SupportUploadFileTypes.custom: {
|
|
|
- if (fileSize > docSizeLimit) {
|
|
|
- notify({
|
|
|
- type: 'error',
|
|
|
- message: t('common.fileUploader.uploadFromComputerLimit', {
|
|
|
- type: SupportUploadFileTypes.document,
|
|
|
- size: formatFileSize(docSizeLimit),
|
|
|
- }),
|
|
|
- })
|
|
|
- return false
|
|
|
- }
|
|
|
- return true
|
|
|
- }
|
|
|
- default: {
|
|
|
- return true
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
|
|
|
const handleAddFile = useCallback((newFile: FileEntity) => {
|
|
|
const {
|
|
@@ -212,15 +117,12 @@ export const useFile = (fileConfig: FileUpload) => {
|
|
|
progress: 100,
|
|
|
supportFileType: getSupportFileType(url, res.file_type, allowedFileTypes?.includes(SupportUploadFileTypes.custom)),
|
|
|
}
|
|
|
- if (!checkSizeLimit(newFile.supportFileType, newFile.size))
|
|
|
- handleRemoveFile(uploadingFile.id)
|
|
|
- else
|
|
|
- handleUpdateFile(newFile)
|
|
|
+ handleUpdateFile(newFile)
|
|
|
}).catch(() => {
|
|
|
notify({ type: 'error', message: t('common.fileUploader.pasteFileLinkInvalid') })
|
|
|
handleRemoveFile(uploadingFile.id)
|
|
|
})
|
|
|
- }, [checkSizeLimit, handleAddFile, handleUpdateFile, notify, t, handleRemoveFile, fileConfig?.allowed_file_types])
|
|
|
+ }, [handleAddFile, handleUpdateFile, notify, t, handleRemoveFile, fileConfig?.allowed_file_types])
|
|
|
|
|
|
const handleLoadFileFromLinkSuccess = useCallback(() => { }, [])
|
|
|
|
|
@@ -238,13 +140,13 @@ export const useFile = (fileConfig: FileUpload) => {
|
|
|
notify({ type: 'error', message: t('common.fileUploader.fileExtensionNotSupport') })
|
|
|
return
|
|
|
}
|
|
|
- const allowedFileTypes = fileConfig.allowed_file_types
|
|
|
- const fileType = getSupportFileType(file.name, file.type, allowedFileTypes?.includes(SupportUploadFileTypes.custom))
|
|
|
- if (!checkSizeLimit(fileType, file.size))
|
|
|
+ if (file.size > FILE_SIZE_LIMIT) {
|
|
|
+ notify({ type: 'error', message: t('common.fileUploader.uploadFromComputerLimit', { size: formatFileSize(FILE_SIZE_LIMIT) }) })
|
|
|
return
|
|
|
-
|
|
|
+ }
|
|
|
const reader = new FileReader()
|
|
|
const isImage = file.type.startsWith('image')
|
|
|
+ const allowedFileTypes = fileConfig.allowed_file_types
|
|
|
|
|
|
reader.addEventListener(
|
|
|
'load',
|
|
@@ -285,7 +187,7 @@ export const useFile = (fileConfig: FileUpload) => {
|
|
|
false,
|
|
|
)
|
|
|
reader.readAsDataURL(file)
|
|
|
- }, [checkSizeLimit, notify, t, handleAddFile, handleUpdateFile, params.token, fileConfig?.allowed_file_types, fileConfig?.allowed_file_extensions])
|
|
|
+ }, [notify, t, handleAddFile, handleUpdateFile, params.token, fileConfig?.allowed_file_types, fileConfig?.allowed_file_extensions])
|
|
|
|
|
|
const handleClipboardPasteFile = useCallback((e: ClipboardEvent<HTMLTextAreaElement>) => {
|
|
|
const file = e.clipboardData?.files[0]
|