diff --git a/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/Overlay.js b/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/Overlay.js index 099bec2ae9..079eeb9ce3 100644 --- a/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/Overlay.js +++ b/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/Overlay.js @@ -6,7 +6,7 @@ const Overlay = styled.div` right: 0; bottom: 0; left: 0; - z-index: 1040; + z-index: 1140; &:before { content: ''; position: fixed; diff --git a/packages/strapi-plugin-upload/admin/src/components/EditForm/index.js b/packages/strapi-plugin-upload/admin/src/components/EditForm/index.js index 90a83e717a..37fa2595e3 100644 --- a/packages/strapi-plugin-upload/admin/src/components/EditForm/index.js +++ b/packages/strapi-plugin-upload/admin/src/components/EditForm/index.js @@ -79,7 +79,9 @@ const EditForm = forwardRef( useEffect(() => { if (isImg || isVideo) { if (prefixedFileURL) { - setSrc(prefixedFileURL); + // Adding performance.now forces the browser no to cache the img + // https://stackoverflow.com/questions/126772/how-to-force-a-web-browser-not-to-cache-images + setSrc(`${prefixedFileURL}?${performance.now()}`); } else { const reader = new FileReader(); diff --git a/packages/strapi-plugin-upload/admin/src/containers/HomePage/index.js b/packages/strapi-plugin-upload/admin/src/containers/HomePage/index.js index 6d242df288..89ff087cab 100644 --- a/packages/strapi-plugin-upload/admin/src/containers/HomePage/index.js +++ b/packages/strapi-plugin-upload/admin/src/containers/HomePage/index.js @@ -212,11 +212,8 @@ const HomePage = () => { const handleDeleteMediaFromModal = async id => { handleClickToggleModal(); - const overlayblockerParams = { - children:
, - noGradient: true, - }; - strapi.lockApp(overlayblockerParams); + + lockAppWithOverlay(); try { await deleteMedia(id); @@ -235,14 +232,22 @@ const HomePage = () => { }; const handleDeleteMedias = async () => { - await Promise.all(dataToDelete.map(item => deleteMedia(item.id))); - - dispatch({ - type: 'CLEAR_DATA_TO_DELETE', - }); - setIsPopupOpen(false); - fetchListData(); + + lockAppWithOverlay(); + + await Promise.all(dataToDelete.map(item => deleteMedia(item.id))) + .then(() => { + dispatch({ + type: 'CLEAR_DATA_TO_DELETE', + }); + + fetchListData(); + strapi.unlockApp(); + }) + .catch(() => { + strapi.unlockApp(); + }); }; const handleModalClose = () => { @@ -260,6 +265,15 @@ const HomePage = () => { }); }; + const lockAppWithOverlay = () => { + const overlayblockerParams = { + children:
, + noGradient: true, + }; + + strapi.lockApp(overlayblockerParams); + }; + const resetModalState = () => { setModalInitialStep('browse'); setFileToEdit(null);