diff --git a/packages/core/upload/admin/src/components/EditAssetDialog/PreviewBox/index.js b/packages/core/upload/admin/src/components/EditAssetDialog/PreviewBox/index.js
index c94958a8d2..cbefc798c9 100644
--- a/packages/core/upload/admin/src/components/EditAssetDialog/PreviewBox/index.js
+++ b/packages/core/upload/admin/src/components/EditAssetDialog/PreviewBox/index.js
@@ -42,7 +42,7 @@ export const PreviewBox = ({
   const { trackUsage } = useTracking();
   const previewRef = useRef(null);
   const [isCropImageReady, setIsCropImageReady] = useState(false);
-  const [hasCropIntent, setHasCropIntent] = useState(false);
+  const [hasCropIntent, setHasCropIntent] = useState(null);
   const [assetUrl, setAssetUrl] = useState(createAssetUrl(asset, false));
   const [thumbnailUrl, setThumbnailUrl] = useState(createAssetUrl(asset, true));
   const { formatMessage } = useIntl();
@@ -75,11 +75,26 @@ export const PreviewBox = ({
       if (asset.isLocal) {
         asset.url = fileLocalUrl;
       }
+
       setAssetUrl(fileLocalUrl);
       setThumbnailUrl(fileLocalUrl);
     }
   }, [replacementFile, asset]);
 
+  useEffect(() => {
+    if (hasCropIntent === false) {
+      stopCropping();
+      onCropCancel();
+    }
+  }, [hasCropIntent, stopCropping, onCropCancel, onCropFinish]);
+
+  useEffect(() => {
+    if (hasCropIntent && isCropImageReady) {
+      crop(previewRef.current);
+      onCropStart();
+    }
+  }, [isCropImageReady, hasCropIntent, onCropStart, crop]);
+
   const handleCropping = async () => {
     const nextAsset = { ...asset, width, height };
     const file = await produceFile(nextAsset.name, nextAsset.mime, nextAsset.updatedAt);
@@ -104,10 +119,9 @@ export const PreviewBox = ({
       trackUsage('didCropFile', { duplicatedFile: false, location: trackedLocation });
     }
 
-    stopCropping();
-    onCropCancel();
     setAssetUrl(optimizedCachingImage);
     setThumbnailUrl(optimizedCachingThumbnailImage);
+    setHasCropIntent(false);
   };
 
   const isInCroppingMode = isCropping && !isLoading;
@@ -120,28 +134,18 @@ export const PreviewBox = ({
 
     trackUsage('didCropFile', { duplicatedFile: true, location: trackedLocation });
 
-    stopCropping();
+    setHasCropIntent(false);
     onCropFinish();
   };
 
   const handleCropCancel = () => {
     setHasCropIntent(false);
-    setIsCropImageReady(false);
-    stopCropping();
-    onCropCancel();
   };
 
   const handleCropStart = () => {
     setHasCropIntent(true);
   };
 
-  useEffect(() => {
-    if (hasCropIntent && isCropImageReady) {
-      crop(previewRef.current);
-      onCropStart();
-    }
-  }, [isCropImageReady, hasCropIntent, onCropStart, crop]);
-
   return (
     <>
       <RelativeBox hasRadius background="neutral150" borderColor="neutral200">
@@ -214,7 +218,7 @@ export const PreviewBox = ({
             name={asset.name}
             url={hasCropIntent ? assetUrl : thumbnailUrl}
             onLoad={() => {
-              if (hasCropIntent) {
+              if (asset.isLocal ? true : hasCropIntent) {
                 setIsCropImageReady(true);
               }
             }}