From 25d775a18a98cb553701110ef529920b3c7e1650 Mon Sep 17 00:00:00 2001
From: Daniel Dimitrov <daniel@compojoom.com>
Date: Wed, 29 May 2024 10:51:48 +0200
Subject: [PATCH] refactor: move static tag to the navItem conf array

---
 src/components/sidebar/SidebarNavigation/config.tsx |  3 +++
 src/components/sidebar/SidebarNavigation/index.tsx  | 10 +++-------
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/components/sidebar/SidebarNavigation/config.tsx b/src/components/sidebar/SidebarNavigation/config.tsx
index 27cc371aeb..afbb0a17b1 100644
--- a/src/components/sidebar/SidebarNavigation/config.tsx
+++ b/src/components/sidebar/SidebarNavigation/config.tsx
@@ -9,11 +9,13 @@ import AppsIcon from '@/public/images/apps/apps-icon.svg'
 import SettingsIcon from '@/public/images/sidebar/settings.svg'
 import SwapIcon from '@/public/images/common/swap.svg'
 import { SvgIcon } from '@mui/material'
+import Chip from '@mui/material/Chip'
 
 export type NavItem = {
   label: string
   icon?: ReactElement
   href: string
+  tag?: ReactElement
 }
 
 export const navItems: NavItem[] = [
@@ -31,6 +33,7 @@ export const navItems: NavItem[] = [
     label: 'Swap',
     icon: <SvgIcon component={SwapIcon} inheritViewBox />,
     href: AppRoutes.swap,
+    tag: <Chip label="New" color="success" sx={{ ml: 1 }} />,
   },
   {
     label: 'Transactions',
diff --git a/src/components/sidebar/SidebarNavigation/index.tsx b/src/components/sidebar/SidebarNavigation/index.tsx
index 478be83788..c37a958332 100644
--- a/src/components/sidebar/SidebarNavigation/index.tsx
+++ b/src/components/sidebar/SidebarNavigation/index.tsx
@@ -19,7 +19,6 @@ import { FeatureRoutes, hasFeature } from '@/utils/chains'
 import { trackEvent } from '@/services/analytics'
 import { SWAP_EVENTS, SWAP_LABELS } from '@/services/analytics/events/swaps'
 import useIsCounterfactualSafe from '@/features/counterfactual/hooks/useIsCounterfactualSafe'
-import Chip from '@mui/material/Chip'
 
 const getSubdirectory = (pathname: string): string => {
   return pathname.split('/')[1]
@@ -32,17 +31,14 @@ const isRouteEnabled = (route: string, chain?: ChainInfo) => {
   return !featureRoute || hasFeature(chain, featureRoute)
 }
 
-const NavItemLabel = ({ item }: { item: NavItem }) => {
+const NavItemTag = ({ item }: { item: NavItem }) => {
   const queueSize = useQueuedTxsLength()
 
   if (item.href === AppRoutes.transactions.history) {
     return <SidebarListItemCounter count={queueSize} />
   }
 
-  if (item.href === AppRoutes.swap) {
-    return <Chip label="New" color="success" sx={{ ml: 1 }} />
-  }
-  return null
+  return item.tag
 }
 
 const Navigation = (): ReactElement => {
@@ -105,7 +101,7 @@ const Navigation = (): ReactElement => {
               <SidebarListItemText data-testid="sidebar-list-item" bold>
                 {item.label}
 
-                <NavItemLabel item={item} />
+                <NavItemTag item={item} />
               </SidebarListItemText>
             </SidebarListItemButton>
           </ListItem>