diff --git a/src/components/Dialog/DialogAnchor.tsx b/src/components/Dialog/DialogAnchor.tsx
index db27d8ee68..5e411ba0f4 100644
--- a/src/components/Dialog/DialogAnchor.tsx
+++ b/src/components/Dialog/DialogAnchor.tsx
@@ -42,6 +42,10 @@ export function useDialogAnchor<T extends HTMLElement>({
     }
   }, [open, popperElement, update]);
 
+  if (popperElement && !open) {
+    setPopperElement(null);
+  }
+
   return {
     attributes,
     setPopperElement,
@@ -87,13 +91,6 @@ export const DialogAnchor = ({
     };
   }, [dialog, open]);
 
-  useEffect(() => {
-    if (!open) {
-      // setting element reference back to null allows to re-run the usePopper component once the component is re-rendered
-      setPopperElement(null);
-    }
-  }, [open, setPopperElement]);
-
   // prevent rendering the dialog contents if the dialog should not be open / shown
   if (!open) {
     return null;