Merge pull request #1992 from oasisprotocol/lw/account-icon

Update icon of "Account" nav button
oasisprotocol · Jul 9, 2024 · e9a3aa4 · e9a3aa4
2 parents ab1c9db + 82ff612
commit e9a3aa4
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 11 deletions.
diff --git a/.changelog/1992.trivial.md b/.changelog/1992.trivial.md
@@ -0,0 +1 @@
+Update icon of "Account" nav button
diff --git a/src/app/components/MobileFooterNavigation/index.tsx b/src/app/components/MobileFooterNavigation/index.tsx
@@ -1,11 +1,11 @@
-import React, { useMemo } from 'react'
+import { useMemo } from 'react'
 import { useSelector } from 'react-redux'
 import { useTranslation } from 'react-i18next'
 import { Box } from 'grommet/es6/components/Box'
 import { Text } from 'grommet/es6/components/Text'
 import { LineChart } from 'grommet-icons/es6/icons/LineChart'
 import { Inherit } from 'grommet-icons/es6/icons/Inherit'
-import { Money } from 'grommet-icons/es6/icons/Money'
+import { MuiWalletIcon } from '../../../styles/theme/icons/mui-icons/MuiWalletIcon'
 import { CreditCard } from 'grommet-icons/es6/icons/CreditCard'
 import styled from 'styled-components'
 import { normalizeColor } from 'grommet/es6/utils'
@@ -51,7 +51,7 @@ export const MobileFooterNavigation = () => {
     const menuItems = [
       {
         label: t('menu.wallet', 'Account'),
-        Icon: Money,
+        Icon: MuiWalletIcon,
         to: `/account/${address}`,
         exactActive: true,
       },

diff --git a/src/app/components/Sidebar/__tests__/__snapshots__/index.test.tsx.snap b/src/app/components/Sidebar/__tests__/__snapshots__/index.test.tsx.snap
@@ -907,15 +907,13 @@ exports[`<Navigation /> with account opened should match snapshot 1`] = `
           class="c9"
         >
           <svg
-            aria-label="Money"
+            aria-hidden="true"
+            aria-label="icons.wallet.label"
             class="c10"
-            viewBox="0 0 24 24"
+            viewBox="0 -960 960 960"
           >
             <path
-              d="M16 16c0-1.105-3.134-2-7-2s-7 .895-7 2 3.134 2 7 2 7-.895 7-2zM2 16v4.937C2 22.077 5.134 23 9 23s7-.924 7-2.063V16M9 5c-4.418 0-8 .895-8 2s3.582 2 8 2M1 7v5c0 1.013 3.582 2 8 2M23 4c0-1.105-3.1-2-6.923-2-3.824 0-6.923.895-6.923 2s3.1 2 6.923 2S23 5.105 23 4zm-7 12c3.824 0 7-.987 7-2V4M9.154 4v10.166M9 9c0 1.013 3.253 2 7.077 2C19.9 11 23 10.013 23 9"
-              fill="none"
-              stroke="#000"
-              stroke-width="2"
+              d="M240-160q-66 0-113-47T80-320v-320q0-66 47-113t113-47h480q66 0 113 47t47 113v320q0 66-47 113t-113 47H240Zm0-480h480q22 0 42 5t38 16v-21q0-33-23.5-56.5T720-720H240q-33 0-56.5 23.5T160-640v21q18-11 38-16t42-5Zm-74 130 445 108q9 2 18 0t17-8l139-116q-11-15-28-24.5t-37-9.5H240q-26 0-45.5 13.5T166-510Z"
             />
           </svg>
           <div

diff --git a/src/app/components/Sidebar/index.tsx b/src/app/components/Sidebar/index.tsx
@@ -15,7 +15,7 @@ import { LineChart } from 'grommet-icons/es6/icons/LineChart'
 import { MuiLockIcon } from '../../../styles/theme/icons/mui-icons/MuiLockIcon'
 import { Logout } from 'grommet-icons/es6/icons/Logout'
 import { Menu as MenuIcon } from 'grommet-icons/es6/icons/Menu'
-import { Money } from 'grommet-icons/es6/icons/Money'
+import { MuiWalletIcon } from '../../../styles/theme/icons/mui-icons/MuiWalletIcon'
 import { CreditCard } from 'grommet-icons/es6/icons/CreditCard'
 import * as React from 'react'
 import { useContext } from 'react'
@@ -254,7 +254,7 @@ function SidebarMenuItems() {
     ),
     wallet: (
       <SidebarButton
-        icon={<Money />}
+        icon={<MuiWalletIcon />}
         label={t('menu.wallet', 'Account')}
         needsWalletOpen={true}
         route={`/account/${address}`}