diff --git a/packages/ui/src/elements/BulkUpload/index.tsx b/packages/ui/src/elements/BulkUpload/index.tsx index 7941bb98b82..dce6b4d2df1 100644 --- a/packages/ui/src/elements/BulkUpload/index.tsx +++ b/packages/ui/src/elements/BulkUpload/index.tsx @@ -83,26 +83,30 @@ export function BulkUploadDrawer() { type BulkUploadContext = { collectionSlug: string + currentActivePath: string drawerSlug: string initialFiles: FileList maxFiles: number onCancel: () => void onSuccess: (newDocs: JsonObject[], errorCount: number) => void setCollectionSlug: (slug: string) => void + setCurrentActivePath: (path: string) => void setInitialFiles: (files: FileList) => void setMaxFiles: (maxFiles: number) => void setOnCancel: (onCancel: BulkUploadContext['onCancel']) => void - setOnSuccess: (onSuccess: BulkUploadContext['onSuccess']) => void + setOnSuccess: (path: string, onSuccess: BulkUploadContext['onSuccess']) => void } const Context = React.createContext({ collectionSlug: '', + currentActivePath: undefined, drawerSlug: '', initialFiles: undefined, maxFiles: undefined, onCancel: () => null, onSuccess: () => null, setCollectionSlug: () => null, + setCurrentActivePath: () => null, setInitialFiles: () => null, setMaxFiles: () => null, setOnCancel: () => null, @@ -110,24 +114,30 @@ const Context = React.createContext({ }) export function BulkUploadProvider({ children }: { readonly children: React.ReactNode }) { const [collection, setCollection] = React.useState() - const [onSuccessFunction, setOnSuccessFunction] = React.useState() + const [onSuccessFunctionMap, setOnSuccessFunctionMap] = + React.useState>() const [onCancelFunction, setOnCancelFunction] = React.useState() const [initialFiles, setInitialFiles] = React.useState(undefined) const [maxFiles, setMaxFiles] = React.useState(undefined) + const [currentActivePath, setCurrentActivePath] = React.useState(undefined) const drawerSlug = useBulkUploadDrawerSlug() const setCollectionSlug: BulkUploadContext['setCollectionSlug'] = (slug) => { setCollection(slug) } - const setOnSuccess: BulkUploadContext['setOnSuccess'] = (onSuccess) => { - setOnSuccessFunction(() => onSuccess) - } + const setOnSuccess: BulkUploadContext['setOnSuccess'] = React.useCallback((path, onSuccess) => { + setOnSuccessFunctionMap((prev) => ({ + ...prev, + [path]: onSuccess, + })) + }, []) return ( { - if (typeof onSuccessFunction === 'function') { + if (onSuccessFunctionMap && Object.hasOwn(onSuccessFunctionMap, currentActivePath)) { + const onSuccessFunction = onSuccessFunctionMap[currentActivePath] onSuccessFunction(docIDs, errorCount) } }, setCollectionSlug, + setCurrentActivePath, setInitialFiles, setMaxFiles, setOnCancel: setOnCancelFunction, diff --git a/packages/ui/src/fields/Upload/Input.tsx b/packages/ui/src/fields/Upload/Input.tsx index a4ff5b434fd..b9d3b212b36 100644 --- a/packages/ui/src/fields/Upload/Input.tsx +++ b/packages/ui/src/fields/Upload/Input.tsx @@ -115,8 +115,14 @@ export function UploadInput(props: UploadInputProps) { ) const { openModal } = useModal() - const { drawerSlug, setCollectionSlug, setInitialFiles, setMaxFiles, setOnSuccess } = - useBulkUpload() + const { + drawerSlug, + setCollectionSlug, + setCurrentActivePath, + setInitialFiles, + setMaxFiles, + setOnSuccess, + } = useBulkUpload() const { permissions } = useAuth() const { code } = useLocale() const { i18n, t } = useTranslation() @@ -269,6 +275,7 @@ export function UploadInput(props: UploadInputProps) { if (typeof maxRows === 'number') { setMaxFiles(maxRows) } + setCurrentActivePath(path) openModal(drawerSlug) }, [ @@ -280,6 +287,8 @@ export function UploadInput(props: UploadInputProps) { setInitialFiles, maxRows, setMaxFiles, + path, + setCurrentActivePath, ], ) @@ -426,8 +435,8 @@ export function UploadInput(props: UploadInputProps) { }, [populateDocs, activeRelationTo, value]) useEffect(() => { - setOnSuccess(onUploadSuccess) - }, [value, onUploadSuccess, setOnSuccess]) + setOnSuccess(path, onUploadSuccess) + }, [value, path, onUploadSuccess, setOnSuccess]) const showDropzone = !value || diff --git a/packages/ui/src/views/List/index.tsx b/packages/ui/src/views/List/index.tsx index 7f3cc1edcfa..9688c3738aa 100644 --- a/packages/ui/src/views/List/index.tsx +++ b/packages/ui/src/views/List/index.tsx @@ -110,7 +110,7 @@ export const DefaultListView: React.FC = (props) => { query, } = useListQuery() const { openModal } = useModal() - const { setCollectionSlug, setOnSuccess } = useBulkUpload() + const { setCollectionSlug, setCurrentActivePath, setOnSuccess } = useBulkUpload() const { drawerSlug: bulkUploadDrawerSlug } = useBulkUpload() const collectionConfig = getEntityConfig({ collectionSlug }) as ClientCollectionConfig @@ -148,9 +148,18 @@ export const DefaultListView: React.FC = (props) => { const openBulkUpload = React.useCallback(() => { setCollectionSlug(collectionSlug) + setCurrentActivePath(collectionSlug) openModal(bulkUploadDrawerSlug) - setOnSuccess(() => router.refresh()) - }, [router, collectionSlug, bulkUploadDrawerSlug, openModal, setCollectionSlug, setOnSuccess]) + setOnSuccess(collectionSlug, () => router.refresh()) + }, [ + router, + collectionSlug, + bulkUploadDrawerSlug, + openModal, + setCollectionSlug, + setCurrentActivePath, + setOnSuccess, + ]) useEffect(() => { if (drawerDepth <= 1) {