fix(dashboard-v2): styling fixes for active link in navbar dropdown

packages/dashboard-v2/src/components/DropdownMenu/DropdownMenuLink.js

@@ -3,18 +3,16 @@ import PropTypes from "prop-types";
 
 const DropdownLink = styled.a.attrs({
   className: `m-0 border-t border-palette-200/50 h-[60px]
-              whitespace-nowrap transition-colors text-current
+              whitespace-nowrap transition-colors
               hover:bg-palette-100/50 flex items-center
               pr-8 pl-6 py-4 gap-4 first:border-0`,
 })``;
 
 export const DropdownMenuLink = ({ active, icon: Icon, label, ...props }) => (
-  <>
   <DropdownLink {...props}>
-      {Icon ? <Icon className={active ? "text-primary" : "text-current"} /> : null}
-      {label}
+    {Icon ? <Icon /> : null}
+    <span className="text-palette-500">{label}</span>
   </DropdownLink>
-  </>
 );
 
 DropdownMenuLink.propTypes = {

packages/dashboard-v2/src/components/NavBar/NavBar.js

@@ -68,8 +68,14 @@ export const NavBar = () => (
         </NavBarSection>
         <NavBarSection className="dropdown-area justify-end">
           <DropdownMenu title="My account">
-            <DropdownMenuLink href="/settings" icon={CogIcon} label="Settings" />
-            <DropdownMenuLink href="/logout" icon={LockClosedIcon} label="Log out" />
+            <DropdownMenuLink to="/settings" as={Link} activeClassName="text-primary" icon={CogIcon} label="Settings" />
+            <DropdownMenuLink
+              to="/logout"
+              as={Link}
+              activeClassName="text-primary"
+              icon={LockClosedIcon}
+              label="Log out"
+            />
           </DropdownMenu>
         </NavBarSection>
       </NavBarBody>