diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx
index aab89e767bb..6a99492b312 100644
--- a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx
+++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx
@@ -7,10 +7,9 @@ const code = `
 import { Group, Menu } from '@mantine/core';
 
 function Demo() {
-  const navMenus = 4;
   return (
     <Group>
-      {[...Array(navMenus)].map((e, i) => (
+      {Array(4).fill(0).map((e, i) => (
         <Menu
           key={i}
           trigger="click-hover"
@@ -19,7 +18,7 @@ function Demo() {
           trapFocus={false}
           menuItemTabIndex={0}
         >
-          {/* ... menu items */}
+          <DemoMenuItems />
         </Menu>
       ))}
     </Group>
@@ -28,10 +27,9 @@ function Demo() {
 `;
 
 function Demo() {
-  const navMenus = 4;
   return (
     <Group>
-      {[...Array(navMenus)].map((e, i) => (
+      {Array(4).fill(0).map((e, i) => (
         <Menu
           key={i}
           trigger="click-hover"