fix: show scrollbar in navigation menu

apps/web/src/components/navigation-menu/index.js

@@ -27,6 +27,7 @@ import { useStore as useAppStore } from "../../stores/app-store";
 import { useStore as useUserStore } from "../../stores/user-store";
 import { useStore as useThemeStore } from "../../stores/theme-store";
 import useLocation from "../../hooks/use-location";
+import { FlexScrollContainer } from "../scroll-container";
 
 function shouldSelectNavItem(route, pin) {
   if (pin.type === "notebook") {
@@ -126,15 +127,8 @@ function NavigationMenu(props) {
       bg={"bgSecondary"}
       px={0}
     >
-      <Flex
-        flexDirection="column"
-        sx={{
-          overflow: "scroll",
-          scrollbarWidth: "none",
-          "::-webkit-scrollbar": { width: 0, height: 0 },
-          msOverflowStyle: "none",
-        }}
-      >
+      <FlexScrollContainer>
+        <Flex flexDirection="column">
           {routes.map((item) => (
             <NavigationItem
               key={item.path}
@@ -177,7 +171,13 @@ function NavigationMenu(props) {
               }}
             />
           ))}
-        <Box width="85%" height="0.8px" bg="border" alignSelf="center" my={1} />
+          <Box
+            width="85%"
+            height="0.8px"
+            bg="border"
+            alignSelf="center"
+            my={1}
+          />
           {pins.map((pin) => (
             <NavigationItem
               key={pin.id}
@@ -216,6 +216,7 @@ function NavigationMenu(props) {
             />
           ))}
         </Flex>
+      </FlexScrollContainer>
       <Flex flexDirection="column">
         {theme === "light" ? (
           <NavigationItem