From 946644675a2d62817f955790aa5ae8bdd61a2078 Mon Sep 17 00:00:00 2001
From: leandrofars <leandrofars@gmail.com>
Date: Thu, 15 May 2025 13:07:38 -0300
Subject: [PATCH] feat(frontend): side nav item with external link icon

---
 frontend/src/layouts/dashboard/side-nav-item.js | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/frontend/src/layouts/dashboard/side-nav-item.js b/frontend/src/layouts/dashboard/side-nav-item.js
index e46634c..015f479 100644
--- a/frontend/src/layouts/dashboard/side-nav-item.js
+++ b/frontend/src/layouts/dashboard/side-nav-item.js
@@ -5,6 +5,7 @@ import { Box, ButtonBase, Collapse, SvgIcon, Tooltip } from '@mui/material';
 import ChevronDownIcon from '@heroicons/react/24/outline/ChevronDownIcon';
 import ChevronUpIcon from '@heroicons/react/24/outline/ChevronUpIcon';
 import { usePathname } from 'next/navigation';
+import ArrowTopRightOnSquareIcon from '@heroicons/react/24/solid/ArrowTopRightOnSquareIcon';
 
 export const SideNavItem = (props) => {
   const { active = false, disabled, external, icon, path, title, children, padleft, tooltip } = props;
@@ -112,7 +113,13 @@ export const SideNavItem = (props) => {
           }}
           {...linkProps}
         >
-          {title}
+          {title} {
+            external && (
+              <SvgIcon fontSize='8px' sx={{ml: 1}}>
+                <ArrowTopRightOnSquareIcon />
+              </SvgIcon>
+            )
+          }
         </Box>
         { children &&
             <Box
@@ -144,7 +151,7 @@ export const SideNavItem = (props) => {
           <SvgIcon fontSize='8px'>
             <ChevronUpIcon />
           </SvgIcon>
-    }
+          }
           </Box>
         }
       </ButtonBase>
@@ -158,7 +165,7 @@ export const SideNavItem = (props) => {
                     <SideNavItem
                       active={isItemActive(pathname, child.path)}
                       disabled={child.disabled}
-                      external={false}
+                      external={child.external ? true : false}
                       icon={child.icon}
                       key={child.title}
                       path={child.path}