fix user profile menu opening/closing

package.json

@@ -45,7 +45,7 @@
     "@blockscout/bens-types": "1.4.1",
     "@blockscout/stats-types": "2.5.0-alpha",
     "@blockscout/visualizer-types": "0.2.0",
-    "@chakra-ui/react": "3.14.0",
+    "@chakra-ui/react": "3.15.0",
     "@cloudnouns/kit": "1.1.6",
     "@emotion/react": "11.14.0",
     "@growthbook/growthbook-react": "0.21.0",

ui/snippets/auth/AuthModal.tsx

@@ -186,7 +186,7 @@ const AuthModal = ({ initialScreen, onClose, mixpanelConfig, closeOnError }: Pro
       // we need to allow user interact with element outside of dialog otherwise they can't click on recaptcha
       modal={ false }
       // FIXME if we allow to close on interact outside, the dialog will be closed when user click on recaptcha
-      closeOnInteractOutside={ ![ 'email', 'otp_code' ].includes(currentStep.type) }
+      closeOnInteractOutside={ ![ 'email', 'otp_code', 'connect_wallet', 'select_method' ].includes(currentStep.type) }
       trapFocus={ false }
       preventScroll={ false }
     >

ui/snippets/user/profile/UserProfileDesktop.tsx

@@ -70,9 +70,13 @@ const UserProfileDesktop = ({ buttonSize, buttonVariant = 'header' }: Props) =>
     profileMenu.onClose();
   }, [ authModal, profileMenu ]);
 
+  const handleProfileMenuOpenChange = React.useCallback(({ open }: { open: boolean }) => {
+    !open && profileMenu.onOpenChange({ open });
+  }, [ profileMenu ]);
+
   return (
     <>
-      <PopoverRoot positioning={{ placement: 'bottom-end' }} open={ profileMenu.open } onOpenChange={ profileMenu.onOpenChange }>
+      <PopoverRoot positioning={{ placement: 'bottom-end' }} open={ profileMenu.open } onOpenChange={ handleProfileMenuOpenChange }>
         <PopoverTrigger>
           <UserProfileButton
             profileQuery={ profileQuery }
@@ -81,7 +85,7 @@ const UserProfileDesktop = ({ buttonSize, buttonVariant = 'header' }: Props) =>
             onClick={ handleProfileButtonClick }
           />
         </PopoverTrigger>
-        { (profileQuery.data || web3Address) && (
+        { (profileQuery.data || web3Address) && profileMenu.open && (
           <PopoverContent w="280px">
             <PopoverBody>
               <UserProfileContent

ui/snippets/user/profile/UserProfileMobile.tsx

@@ -64,11 +64,15 @@ const UserProfileMobile = () => {
     profileMenu.onClose();
   }, [ authModal, profileMenu ]);
 
+  const handleProfileMenuOpenChange = React.useCallback(({ open }: { open: boolean }) => {
+    !open && profileMenu.onOpenChange({ open });
+  }, [ profileMenu ]);
+
   return (
     <>
       <DrawerRoot
         open={ profileMenu.open }
-        onOpenChange={ profileMenu.onOpenChange }
+        onOpenChange={ handleProfileMenuOpenChange }
       >
         <DrawerBackdrop/>
         <DrawerTrigger>

ui/snippets/user/wallet/UserWalletButton.tsx

@@ -18,7 +18,7 @@ interface Props {
   domain?: string;
 }
 
-const UserWalletButton = ({ size, variant, isPending, isAutoConnectDisabled, address, domain }: Props, ref: React.ForwardedRef<HTMLButtonElement>) => {
+const UserWalletButton = ({ size, variant, isPending, isAutoConnectDisabled, address, domain, ...rest }: Props, ref: React.ForwardedRef<HTMLButtonElement>) => {
 
   const isMobile = useIsMobile();
 
@@ -53,6 +53,7 @@ const UserWalletButton = ({ size, variant, isPending, isAutoConnectDisabled, add
         fontWeight={ address ? 700 : 600 }
         loading={ isPending }
         loadingText={ isMobile ? undefined : 'Connecting' }
+        { ...rest }
       >
         { content }
       </Button>

ui/snippets/user/wallet/UserWalletDesktop.tsx

@@ -61,7 +61,7 @@ const UserWalletDesktop = ({ buttonSize, buttonVariant = 'header' }: Props) => {
           isAutoConnectDisabled={ isAutoConnectDisabled }
         />
       </PopoverTrigger>
-      { web3AccountWithDomain.address && (
+      { web3AccountWithDomain.address && walletMenu.open && (
         <PopoverContent w="235px">
           <PopoverBody>
             <UserWalletMenuContent

ui/snippets/user/wallet/UserWalletMobile.tsx

@@ -59,7 +59,7 @@ const UserWalletMobile = () => {
       </DrawerTrigger>
       <DrawerContent maxWidth="300px">
         <DrawerBody p={ 6 }>
-          { web3AccountWithDomain.address && (
+          { web3AccountWithDomain.address && walletMenu.open && (
             <UserWalletMenuContent
               address={ web3AccountWithDomain.address }
               domain={ web3AccountWithDomain.domain }