From 5693a9a3f0698391482ba48761452fc8bb113bce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Connor=20B=C3=A4r?= <github@connorbaer.com>
Date: Fri, 19 Jan 2024 18:32:12 +0000
Subject: [PATCH] Improve performance of the Popover

---
 .../circuit-ui/components/Popover/Popover.tsx | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/packages/circuit-ui/components/Popover/Popover.tsx b/packages/circuit-ui/components/Popover/Popover.tsx
index dd8719ae49..4a91fa9c9c 100644
--- a/packages/circuit-ui/components/Popover/Popover.tsx
+++ b/packages/circuit-ui/components/Popover/Popover.tsx
@@ -275,7 +275,14 @@ export const Popover = ({
       window.removeEventListener('scroll', update);
     }
 
-    // Focus the first or last element after opening
+    return () => {
+      window.removeEventListener('resize', update);
+      window.removeEventListener('scroll', update);
+    };
+  }, [isOpen, refs.reference, update]);
+
+  useEffect(() => {
+    // Focus the first or last popover item after opening
     if (!prevOpen && isOpen) {
       const element = (
         triggerKey.current && triggerKey.current === 'ArrowUp'
@@ -287,7 +294,7 @@ export const Popover = ({
       }
     }
 
-    // Focus the trigger button after closing
+    // Focus the reference element after closing
     if (prevOpen && !isOpen) {
       const triggerButton = (refs.reference.current &&
         refs.reference.current.firstElementChild) as HTMLElement;
@@ -295,13 +302,7 @@ export const Popover = ({
     }
 
     triggerKey.current = null;
-
-    // Clean up the event listener when the component is unmounted
-    return () => {
-      window.removeEventListener('resize', update);
-      window.removeEventListener('scroll', update);
-    };
-  }, [isOpen, prevOpen, refs.reference, update]);
+  }, [isOpen, prevOpen, refs.reference]);
 
   return (
     <Fragment>