fix

ui/snippets/navigation/NavLink.tsx

-import { Link, Icon, Text, HStack, Tooltip, Box, useBreakpointValue, chakra } from '@chakra-ui/react';
+import { Link, Icon, Text, HStack, Tooltip, Box, useBreakpointValue, chakra, shouldForwardProp } from '@chakra-ui/react';
 import NextLink from 'next/link';
 import { route } from 'nextjs-routes';
 import React from 'react';
@@ -64,4 +64,16 @@ const NavLink = ({ text, nextRoute, icon, isCollapsed, isActive, px, isNewUi, cl
   );
 };
 
-export default React.memo(chakra(NavLink));
+const NavLinkChakra = chakra(NavLink, {
+  shouldForwardProp: (prop) => {
+    const isChakraProp = !shouldForwardProp(prop);
+
+    if (isChakraProp && prop !== 'px') {
+      return false;
+    }
+
+    return true;
+  },
+});
+
+export default React.memo(NavLinkChakra);

ui/snippets/navigation/NavigationDesktop.tsx

@@ -91,7 +91,7 @@ const NavigationDesktop = () => {
         </VStack>
       </Box>
       { hasAccount && (
-        <Box as="nav" mt={ 8 } w="100%">
+        <Box as="nav" borderTopWidth="1px" borderColor="divider" w="100%" mt={ 6 } pt={ 6 }>
           <VStack as="ul" spacing="1" alignItems="flex-start">
             { accountNavItems.map((item) => <NavLink key={ item.text } { ...item } isCollapsed={ isCollapsed }/>) }
           </VStack>

ui/snippets/navigation/NavigationMobile.tsx

@@ -64,6 +64,9 @@ const NavigationMobile = () => {
           <Box
             as={ motion.nav }
             mt={ 6 }
+            pt={ 6 }
+            borderTopWidth="1px"
+            borderColor="divider"
             style={{ x: mainX }}
           >
             <VStack as="ul" spacing="1" alignItems="flex-start">