diff --git a/packages/core/upload/admin/src/hooks/useBulkRemoveFolder.js b/packages/core/upload/admin/src/hooks/useBulkRemove.js similarity index 55% rename from packages/core/upload/admin/src/hooks/useBulkRemoveFolder.js rename to packages/core/upload/admin/src/hooks/useBulkRemove.js index cbd2c2e100..d0e6a3e307 100644 --- a/packages/core/upload/admin/src/hooks/useBulkRemoveFolder.js +++ b/packages/core/upload/admin/src/hooks/useBulkRemove.js @@ -4,19 +4,24 @@ import { useNotification } from '@strapi/helper-plugin'; import pluginId from '../pluginId'; import { removeAssetRequest } from '../utils/removeAssetQuery'; -const bulkRemoveQuery = folderIDs => { - const promises = folderIDs.map(folderID => removeAssetRequest(folderID)); - - return Promise.all(promises); -}; - -export const useBulkRemoveFolder = () => { +export const useBulkRemove = type => { const toggleNotification = useNotification(); const queryClient = useQueryClient(); + const bulkRemoveQuery = ids => { + const promises = ids.map(id => removeAssetRequest(id)); + + return Promise.all(promises); + }; + const mutation = useMutation(bulkRemoveQuery, { onSuccess: () => { - queryClient.refetchQueries([pluginId, 'folders'], { active: true }); + if (type === 'folders') { + queryClient.refetchQueries([pluginId, 'folders'], { active: true }); + } else if (type === 'assets') { + queryClient.refetchQueries([pluginId, 'assets'], { active: true }); + queryClient.refetchQueries([pluginId, 'asset-count'], { active: true }); + } toggleNotification({ type: 'success', @@ -31,7 +36,7 @@ export const useBulkRemoveFolder = () => { }, }); - const removeFolders = folderIDs => mutation.mutateAsync(folderIDs); + const remove = (...args) => mutation.mutateAsync(...args); - return { ...mutation, removeFolders }; + return { ...mutation, remove }; }; diff --git a/packages/core/upload/admin/src/hooks/useBulkRemoveAsset.js b/packages/core/upload/admin/src/hooks/useBulkRemoveAsset.js deleted file mode 100644 index b3dc0b7107..0000000000 --- a/packages/core/upload/admin/src/hooks/useBulkRemoveAsset.js +++ /dev/null @@ -1,38 +0,0 @@ -import { useMutation, useQueryClient } from 'react-query'; -import { useNotification } from '@strapi/helper-plugin'; - -import pluginId from '../pluginId'; -import { removeAssetRequest } from '../utils/removeAssetQuery'; - -const bulkRemoveQuery = assetIds => { - const promises = assetIds.map(assetId => removeAssetRequest(assetId)); - - return Promise.all(promises); -}; - -export const useBulkRemoveAsset = () => { - const toggleNotification = useNotification(); - const queryClient = useQueryClient(); - - const mutation = useMutation(bulkRemoveQuery, { - onSuccess: () => { - queryClient.refetchQueries([pluginId, 'assets'], { active: true }); - queryClient.refetchQueries([pluginId, 'asset-count'], { active: true }); - - toggleNotification({ - type: 'success', - message: { - id: 'modal.remove.success-label', - defaultMessage: 'The asset has been successfully removed.', - }, - }); - }, - onError: error => { - toggleNotification({ type: 'warning', message: error.message }); - }, - }); - - const removeAssets = assetIds => mutation.mutateAsync(assetIds); - - return { ...mutation, removeAssets }; -}; diff --git a/packages/core/upload/admin/src/pages/App/components/BulkDeleteButton.js b/packages/core/upload/admin/src/pages/App/components/BulkDeleteButton.js index e034870a18..db79a51ecc 100644 --- a/packages/core/upload/admin/src/pages/App/components/BulkDeleteButton.js +++ b/packages/core/upload/admin/src/pages/App/components/BulkDeleteButton.js @@ -7,24 +7,24 @@ import { Stack } from '@strapi/design-system/Stack'; import Trash from '@strapi/icons/Trash'; import { ConfirmDialog } from '@strapi/helper-plugin'; -import { useBulkRemoveAsset } from '../../../hooks/useBulkRemoveAsset'; -import { useBulkRemoveFolder } from '../../../hooks/useBulkRemoveFolder'; +import { useBulkRemove } from '../../../hooks/useBulkRemove'; import getTrad from '../../../utils/getTrad'; export const BulkDeleteButton = ({ selected, onSuccess }) => { const { formatMessage } = useIntl(); const [showConfirmDialog, setShowConfirmDialog] = useState(false); + const { isLoading: isLoadingAssets, remove: removeAssets } = useBulkRemove('assets'); + const { isLoading: isLoadingFolders, remove: removeFolders } = useBulkRemove('folders'); - const { isLoadingAssets, removeAssets } = useBulkRemoveAsset(); - const { isLoadingFolders, removeFolders } = useBulkRemoveFolder(); const isLoading = isLoadingAssets || isLoadingFolders; const handleConfirmRemove = async () => { + const assets = selected.filter(({ type }) => type === 'asset'); + const folders = selected.filter(({ type }) => type === 'folder'); + await Promise.all([ - removeAssets(selected.filter(({ type }) => type === 'asset').map(({ asset: { id } }) => id)), - removeFolders( - selected.filter(({ type }) => type === 'folder').map(({ folder: { id } }) => id) - ), + assets.length > 0 && removeAssets(assets.map(({ asset: { id } }) => id)), + folders.length > 0 && removeFolders(folders.map(({ folder: { id } }) => id)), ]); onSuccess();