add icons to menu

ui/shared/AddressActions/Menu.tsx

@@ -31,8 +31,8 @@ const AddressActions = () => {
       </MenuButton>
       <MenuList minWidth="180px" zIndex="popover">
         { isTokenPage && appConfig.contractInfoApi.endpoint && appConfig.adminServiceApi.endpoint && <TokenInfoMenuItem py={ 2 } px={ 4 } hash={ hash }/> }
-        <PublicTagMenuItem py={ 2 } px={ 4 } hash={ hash }/>
         <PrivateTagMenuItem py={ 2 } px={ 4 } hash={ hash }/>
+        <PublicTagMenuItem py={ 2 } px={ 4 } hash={ hash }/>
       </MenuList>
     </Menu>
   );

ui/shared/AddressActions/PrivateTagMenuItem.tsx

-import { MenuItem, chakra, useDisclosure } from '@chakra-ui/react';
+import { MenuItem, Icon, chakra, useDisclosure } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
 import React from 'react';
 
 import type { Address } from 'types/api/address';
 
+import iconPrivateTags from 'icons/privattags.svg';
 import { getResourceKey } from 'lib/api/useApiQuery';
 import useRedirectIfNotAuth from 'lib/hooks/useRedirectIfNotAuth';
 import PrivateTagModal from 'ui/privateTags/AddressModal/AddressModal';
@@ -46,8 +47,9 @@ const PrivateTagMenuItem = ({ className, hash }: Props) => {
 
   return (
     <>
-      <MenuItem className={ className }onClick={ handleClick }>
-        Add private tag
+      <MenuItem className={ className } onClick={ handleClick }>
+        <Icon as={ iconPrivateTags } boxSize={ 6 } mr={ 2 }/>
+        <span>Add private tag</span>
       </MenuItem>
       <PrivateTagModal isOpen={ modal.isOpen } onClose={ modal.onClose } onSuccess={ handleAddPrivateTag } data={ formData }/>
     </>

ui/shared/AddressActions/PublicTagMenuItem.tsx

-import { MenuItem, chakra } from '@chakra-ui/react';
+import { MenuItem, Icon, chakra } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import iconPublicTags from 'icons/publictags.svg';
 import useRedirectIfNotAuth from 'lib/hooks/useRedirectIfNotAuth';
 
 interface Props {
@@ -23,7 +24,8 @@ const PublicTagMenuItem = ({ className, hash }: Props) => {
 
   return (
     <MenuItem className={ className }onClick={ handleClick }>
-      Add public tag
+      <Icon as={ iconPublicTags } boxSize={ 6 } mr={ 2 }/>
+      <span>Add public tag</span>
     </MenuItem>
   );
 };

ui/shared/AddressActions/TokenInfoMenuItem.tsx

-import { MenuItem, chakra, useDisclosure } from '@chakra-ui/react';
+import { MenuItem, Icon, chakra, useDisclosure } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
 import appConfig from 'configs/app/config';
+import iconEdit from 'icons/edit.svg';
 import useApiQuery from 'lib/api/useApiQuery';
 import useRedirectIfNotAuth from 'lib/hooks/useRedirectIfNotAuth';
 import AddressVerificationModal from 'ui/addressVerification/AddressVerificationModal';
@@ -44,22 +45,28 @@ const TokenInfoMenuItem = ({ className, hash }: Props) => {
     router.push({ pathname: '/account/verified_addresses' });
   }, [ router ]);
 
+  const icon = <Icon as={ iconEdit } boxSize={ 6 } mr={ 2 } p={ 1 }/>;
+
   const content = (() => {
     if (!verifiedAddressesQuery.data?.verifiedAddresses.find(({ contractAddress }) => contractAddress.toLowerCase() === hash.toLowerCase())) {
       return (
         <MenuItem className={ className } onClick={ handleAddAddressClick }>
-          Add token info
+          { icon }
+          <span>Add token info</span>
         </MenuItem>
       );
     }
 
     return (
       <MenuItem className={ className } onClick={ handleAddApplicationClick }>
-        {
-          applicationsQuery.data?.submissions.some(({ tokenAddress }) => tokenAddress.toLowerCase() === hash.toLowerCase()) ?
-            'Update token info' :
-            'Add token info'
-        }
+        { icon }
+        <span>
+          {
+            applicationsQuery.data?.submissions.some(({ tokenAddress }) => tokenAddress.toLowerCase() === hash.toLowerCase()) ?
+              'Update token info' :
+              'Add token info'
+          }
+        </span>
       </MenuItem>
     );
   })();