fix account actions menu item click

toolkit/chakra/button.tsx

@@ -51,9 +51,8 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
     })();
 
     return (
-      <Skeleton loading={ loadingSkeleton } asChild>
+      <Skeleton loading={ loadingSkeleton } asChild ref={ ref as React.ForwardedRef<HTMLDivElement> }>
         <ChakraButton
-          ref={ ref }
           { ...(expanded ? { 'data-expanded': true } : {}) }
           { ...(selected ? { 'data-selected': true } : {}) }
           { ...(highlighted ? { 'data-highlighted': true } : {}) }

toolkit/chakra/link.tsx

@@ -54,9 +54,8 @@ export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
 
     if (external) {
       return (
-        <Skeleton loading={ loading } asChild>
+        <Skeleton loading={ loading } ref={ ref as React.ForwardedRef<HTMLDivElement> } asChild>
           <ChakraLink
-            ref={ ref }
             href={ href }
             className="group"
             target="_blank"
@@ -72,10 +71,9 @@ export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
     }
 
     return (
-      <Skeleton loading={ loading } asChild>
+      <Skeleton loading={ loading } ref={ ref as React.ForwardedRef<HTMLDivElement> } asChild>
         <ChakraLink
           asChild
-          ref={ ref }
           { ...(disabled ? { 'data-disabled': true } : {}) }
           { ...rest }
         >

toolkit/components/AdaptiveTabs/AdaptiveTabsList.tsx

@@ -80,14 +80,14 @@ const AdaptiveTabsList = (props: Props) => {
       overflowX={{ base: 'auto', lg: 'initial' }}
       overscrollBehaviorX="contain"
       css={{
-        'scroll-snap-type': 'x mandatory',
-        'scroll-padding-inline': '12px', // mobile page padding
+        scrollSnapType: 'x mandatory',
+        scrollPaddingInline: '12px', // mobile page padding
         // hide scrollbar
         '&::-webkit-scrollbar': { /* Chromiums */
           display: 'none',
         },
         '-ms-overflow-style': 'none', /* IE and Edge */
-        'scrollbar-width': 'none', /* Firefox */
+        scrollbarWidth: 'none', /* Firefox */
       }}
       {
         ...(props.stickyEnabled ? {

ui/shared/AccountActionsMenu/AccountActionsMenu.tsx

@@ -77,7 +77,7 @@ const AccountActionsMenu = ({ isLoading, className, showUpdateMetadataItem }: Pr
   }
 
   return (
-    <MenuRoot>
+    <MenuRoot unmountOnExit={ false }>
       <MenuTrigger asChild>
         <IconButton variant="dropdown" size="sm" className={ className } onClick={ handleButtonClick } aria-label="Show address menu">
           <IconSvg name="dots" boxSize="18px"/>

ui/shared/AccountActionsMenu/items/MetadataUpdateMenuItem.tsx

@@ -2,11 +2,11 @@ import React from 'react';
 
 import type { ItemProps } from '../types';
 
+import { MenuItem } from 'toolkit/chakra/menu';
 import IconSvg from 'ui/shared/IconSvg';
 import { useMetadataUpdateContext } from 'ui/tokenInstance/contexts/metadataUpdate';
 
 import ButtonItem from '../parts/ButtonItem';
-import MenuItem from '../parts/MenuItem';
 
 const MetadataUpdateMenuItem = ({ type }: ItemProps) => {
 
@@ -30,7 +30,7 @@ const MetadataUpdateMenuItem = ({ type }: ItemProps) => {
       }
       case 'menu_item': {
         return (
-          <MenuItem onClick={ handleClick } isDisabled={ status === 'WAITING_FOR_RESPONSE' } value="refresh-metadata">
+          <MenuItem onClick={ handleClick } disabled={ status === 'WAITING_FOR_RESPONSE' } value="refresh-metadata">
             <IconSvg name="refresh" boxSize={ 5 }/>
             <span>Refresh metadata</span>
           </MenuItem>

ui/shared/AccountActionsMenu/items/PrivateTagMenuItem.tsx

@@ -8,6 +8,7 @@ import type { Transaction } from 'types/api/transaction';
 
 import { getResourceKey } from 'lib/api/useApiQuery';
 import getPageType from 'lib/mixpanel/getPageType';
+import { MenuItem } from 'toolkit/chakra/menu';
 import { useDisclosure } from 'toolkit/hooks/useDisclosure';
 import AddressModal from 'ui/privateTags/AddressModal/AddressModal';
 import TransactionModal from 'ui/privateTags/TransactionModal/TransactionModal';
@@ -15,7 +16,6 @@ import IconSvg from 'ui/shared/IconSvg';
 import AuthGuard from 'ui/snippets/auth/AuthGuard';
 
 import ButtonItem from '../parts/ButtonItem';
-import MenuItem from '../parts/MenuItem';
 
 interface Props extends ItemProps {
   entityType?: 'address' | 'tx';

ui/shared/AccountActionsMenu/items/PublicTagMenuItem.tsx

@@ -3,10 +3,10 @@ import React from 'react';
 
 import type { ItemProps } from '../types';
 
+import { MenuItem } from 'toolkit/chakra/menu';
 import IconSvg from 'ui/shared/IconSvg';
 
 import ButtonItem from '../parts/ButtonItem';
-import MenuItem from '../parts/MenuItem';
 
 const PublicTagMenuItem = ({ hash, type }: ItemProps) => {
   const router = useRouter();

ui/shared/AccountActionsMenu/items/TokenInfoMenuItem.tsx

@@ -7,6 +7,7 @@ import type { ItemProps } from '../types';
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
 import { PAGE_TYPE_DICT } from 'lib/mixpanel/getPageType';
+import { MenuItem } from 'toolkit/chakra/menu';
 import { useDisclosure } from 'toolkit/hooks/useDisclosure';
 import AddressVerificationModal from 'ui/addressVerification/AddressVerificationModal';
 import IconSvg from 'ui/shared/IconSvg';
@@ -14,7 +15,6 @@ import AuthGuard from 'ui/snippets/auth/AuthGuard';
 import useIsAuth from 'ui/snippets/auth/useIsAuth';
 
 import ButtonItem from '../parts/ButtonItem';
-import MenuItem from '../parts/MenuItem';
 
 const TokenInfoMenuItem = ({ hash, type }: ItemProps) => {
   const router = useRouter();

ui/shared/AccountActionsMenu/parts/MenuItem.tsx

-import React from 'react';
-
-import { MenuItem as MenuItemChakra } from 'toolkit/chakra/menu';
-
-interface Props {
-  className?: string;
-  children: React.ReactNode;
-  onClick: () => void;
-  value: string;
-  isDisabled?: boolean;
-}
-
-const MenuItem = ({ className, children, onClick, value, isDisabled }: Props) => {
-  return (
-    <MenuItemChakra className={ className } onClick={ onClick } disabled={ isDisabled } value={ value }>
-      { children }
-    </MenuItemChakra>
-  );
-};
-
-export default MenuItem;