fix: address the issue where account menu remains open on remove prof…

…ile (#1532) closes #1531
PolkaGate · Sep 8, 2024 · e991fc2 · e991fc2
1 parent 814af86
commit e991fc2
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 8 deletions.
diff --git a/...ages/extension-polkagate/src/fullscreen/homeFullScreen/partials/FullScreenAccountMenu.tsx b/...ages/extension-polkagate/src/fullscreen/homeFullScreen/partials/FullScreenAccountMenu.tsx
@@ -20,10 +20,9 @@ interface Props {
   setDisplayPopup: React.Dispatch<React.SetStateAction<number | undefined>>;
 }
 
-const Menus = ({ address, handleClose, setAnchorEl, setDisplayPopup }: {
+const Menus = ({ address, handleClose, setDisplayPopup }: {
   address: string | undefined,
   handleClose: () => void,
-  setAnchorEl: React.Dispatch<React.SetStateAction<HTMLButtonElement | null>>,
   setDisplayPopup: React.Dispatch<React.SetStateAction<number | undefined>>,
 }) => {
   const { t } = useTranslation();
@@ -118,7 +117,7 @@ const Menus = ({ address, handleClose, setAnchorEl, setDisplayPopup }: {
       <Divider sx={{ bgcolor: 'divider', height: '1px', my: '6px' }} />
       <ProfileMenu
         address={address}
-        setUpperAnchorEl={setAnchorEl}
+        closeParentMenu={handleClose}
       />
       {hasPrivateKey &&
         <MenuItem
@@ -202,7 +201,6 @@ function FullScreenAccountMenu ({ address, baseButton, setDisplayPopup }: Props)
         <Menus
           address={address}
           handleClose={handleClose}
-          setAnchorEl={setAnchorEl}
           setDisplayPopup={setDisplayPopup}
         />
       </Popover>

diff --git a/packages/extension-polkagate/src/fullscreen/homeFullScreen/partials/ProfileMenu.tsx b/packages/extension-polkagate/src/fullscreen/homeFullScreen/partials/ProfileMenu.tsx
@@ -13,7 +13,7 @@ import { updateMeta } from '../../../messaging';
 
 interface Props {
   address: string | undefined;
-  setUpperAnchorEl?: React.Dispatch<React.SetStateAction<HTMLButtonElement | null>>;
+  closeParentMenu: () => void;
 }
 
 interface InputBoxProps {
@@ -180,7 +180,7 @@ enum STATUS {
   SHOW_REMOVE
 }
 
-function ProfileMenu ({ address, setUpperAnchorEl }: Props): React.ReactElement<Props> {
+function ProfileMenu ({ address, closeParentMenu }: Props): React.ReactElement<Props> {
   const theme = useTheme();
   const { t } = useTranslation();
   const isExtensionMode = useIsExtensionPopup();
@@ -196,8 +196,8 @@ function ProfileMenu ({ address, setUpperAnchorEl }: Props): React.ReactElement<
   const handleClose = useCallback(() => {
     setAnchorEl(null);
     setShowName(false);
-    setUpperAnchorEl && setUpperAnchorEl(null);
-  }, [setUpperAnchorEl]);
+    closeParentMenu();
+  }, [closeParentMenu]);
 
   const onAddClick = useCallback((event: React.MouseEvent<HTMLButtonElement | HTMLDivElement>) => {
     setAnchorEl(event.currentTarget);

diff --git a/packages/extension-polkagate/src/partials/AccountMenu.tsx b/packages/extension-polkagate/src/partials/AccountMenu.tsx
@@ -135,6 +135,7 @@ function AccountMenu ({ address, isMenuOpen, noMargin, setShowMenu }: Props): Re
       <MenuSeparator />
       <ProfileMenu
         address={address}
+        closeParentMenu={closeMenu}
       />
       {hasPrivateKey &&
         <MenuItem