chore: use portal by default in avatar menu

opengovsg · Oct 3, 2024 · 145bfda · 145bfda
1 parent b95107b
commit 145bfda
Showing 1 changed file with 6 additions and 3 deletions.
diff --git a/react/src/AvatarMenu/AvatarMenu.tsx b/react/src/AvatarMenu/AvatarMenu.tsx
@@ -6,6 +6,7 @@ import {
   MenuDivider,
   MenuListProps,
   MenuProps,
+  Portal,
   useMultiStyleConfig,
 } from '@chakra-ui/react'
 import { merge } from 'lodash'
@@ -78,9 +79,11 @@ export const AvatarMenu = ({
               {hasNotification && badge}
             </Avatar>
           </AvatarMenuButton>
-          <Menu.List role="menu" sx={styles.list} {...menuListProps}>
-            {children}
-          </Menu.List>
+          <Portal>
+            <Menu.List role="menu" sx={styles.list} {...menuListProps}>
+              {children}
+            </Menu.List>
+          </Portal>
         </>
       )}
     </Menu>