From 208a0ec4759b288e98adb6ad61ed03f17df993c3 Mon Sep 17 00:00:00 2001
From: EleanorMao <danningmao@outlook.com>
Date: Mon, 1 May 2023 21:26:45 +0800
Subject: [PATCH] feat: menu

---
 src/components/Menu/Menu.tsx  | 4 +++-
 src/components/Menu/styled.ts | 9 +++++++++
 src/icons/caretRight.svg      | 3 +++
 3 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 src/icons/caretRight.svg

diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
index bcb1542..a3587a0 100644
--- a/src/components/Menu/Menu.tsx
+++ b/src/components/Menu/Menu.tsx
@@ -4,13 +4,14 @@ import {
 	StyledActivateButton, StyledBackground, StyledCloseIcon, StyledCopyright, StyledExtraContent,
 	StyledIcon,
 	StyledMenuContainer,
-	StyledMenuItem,
+	StyledMenuItem, StyledNextIcon,
 	StyledPlainMenuContainer, StyledPlainMenuItem
 } from './styled'
 import { Paths } from 'routes/Paths'
 import { menuConfig } from 'routes/menuConfig'
 import { Text } from '../Typography'
 import { ReactComponent as CloseSvg } from 'icons/close.svg'
+import { ReactComponent as CaretRightSvg } from 'icons/caretRight.svg'
 
 export interface MenuProps {
 	onClose: () => void
@@ -47,6 +48,7 @@ export const Menu: FC<MenuProps> = ({ onLogout, onClose }) => {
 							rel={item.target === '_blank' ? "noopener noreferrer" : undefined}>
 							<StyledIcon component={item.icon} />
 							{item.title}
+							<StyledNextIcon component={CaretRightSvg} />
 						</StyledPlainMenuItem>
 					))}
 					<StyledExtraContent>
diff --git a/src/components/Menu/styled.ts b/src/components/Menu/styled.ts
index f5cf844..275aeea 100644
--- a/src/components/Menu/styled.ts
+++ b/src/components/Menu/styled.ts
@@ -105,3 +105,12 @@ export const StyledPlainMenuItem = styled(NavLink)`
     color: ${props => props.theme.brandPrimary};
   }
 `
+
+export const StyledNextIcon = styled(Icon)`
+  width: 9px;
+  height: 14px;
+  position: absolute;
+  right: 24px;
+  top: 50%;
+  transform: translate3d(0, -50%, 0);
+`
diff --git a/src/icons/caretRight.svg b/src/icons/caretRight.svg
new file mode 100644
index 0000000..4264942
--- /dev/null
+++ b/src/icons/caretRight.svg
@@ -0,0 +1,3 @@
+<svg width="9" height="14" viewBox="0 0 9 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M1.05806 0.308058C1.30214 0.0639806 1.69786 0.0639806 1.94194 0.308058L8.19194 6.55806C8.43602 6.80214 8.43602 7.19786 8.19194 7.44194L1.94194 13.6919C1.69786 13.936 1.30214 13.936 1.05806 13.6919C0.813981 13.4479 0.813981 13.0521 1.05806 12.8081L6.86612 7L1.05806 1.19194C0.813981 0.947864 0.813981 0.552136 1.05806 0.308058Z" fill="currentColor"/>
+</svg>