diff --git a/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.css b/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.css
index 9b0246e..90f0f05 100644
--- a/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.css
+++ b/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.css
@@ -119,3 +119,18 @@
   min-width: 16px;
   height: 16px;
 }
+
+/* Custom dropdown menu for "More" button */
+.no-code-toolbar-more-menu {
+  max-height: 400px;
+  overflow-y: auto;
+  background-color: var(--modal-bg);
+  border: 1px solid var(--border-color-3);
+  border-radius: 8px;
+  padding: 4px 0;
+}
+
+.no-code-toolbar-more-item {
+  padding: 0;
+  margin: 0;
+}
diff --git a/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.jsx b/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.jsx
index 3f095e2..83943fc 100644
--- a/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.jsx
+++ b/frontend/src/ide/editor/no-code-toolbar/no-code-toolbar.jsx
@@ -435,26 +435,29 @@ const NoCodeToolbar = memo(function NoCodeToolbar({
     };
   }, [items, calculateVisibleItems, debouncedCalculate]);
 
-  // Create dropdown menu items from hidden items
-  const dropdownMenu = useMemo(
-    () => ({
-      items: hiddenItems.map((item) => {
-        const freshItem = items.find((i) => i.key === item.key);
-        return {
-          key: item.key,
-          label: freshItem?.label ?? item.label,
-        };
-      }),
-    }),
-    [hiddenItems, items]
-  );
-
   // Create a set of hidden item keys for quick lookup
   const hiddenItemKeys = useMemo(
     () => new Set(hiddenItems.map((item) => item.key)),
     [hiddenItems]
   );
 
+  // Render function for the "More" dropdown - memoized to avoid unnecessary re-renders
+  const renderMoreDropdown = useCallback(
+    () => (
+      <div className="no-code-toolbar-more-menu">
+        {hiddenItems.map((item) => {
+          const freshItem = items.find((i) => i.key === item.key);
+          return (
+            <div key={item.key} className="no-code-toolbar-more-item">
+              {freshItem?.label ?? item.label}
+            </div>
+          );
+        })}
+      </div>
+    ),
+    [hiddenItems, items]
+  );
+
   return (
     <div className="no-code-toolbar-wrapper">
       <div className="no-code-toolbar-content" ref={containerRef}>
@@ -472,7 +475,7 @@ const NoCodeToolbar = memo(function NoCodeToolbar({
           {hasOverflow && (
             <div className="toolbar-item toolbar-more-item">
               <Dropdown
-                menu={dropdownMenu}
+                dropdownRender={renderMoreDropdown}
                 trigger={["click"]}
                 placement="bottomRight"
                 overlayClassName="no-code-toolbar-dropdown"