From aaecb621aa785066403d5acffeb83c42b8ecf3fd Mon Sep 17 00:00:00 2001
From: Jonathan Fulton <jonathan.s.fulton@gmail.com>
Date: Sat, 31 Jan 2026 13:58:01 -0500
Subject: [PATCH 1/2] Fix: Remove extra toolbar divider when zoom controls not
 shown

Fixes #21429

In docs mode, the menu tool was rendering a Separator that had no tools
following it, causing an orphaned divider to appear in the toolbar.

The Separator in menuTool is intended to visually separate the menu
button from subsequent tools (like remountTool). However, in docs mode,
remountTool and other left-side tools are filtered out by their match
function, leaving the separator with nothing to separate.

The fix makes the Separator conditional on viewMode === 'story', since
that's when the other left-side tools are actually visible.
---
 code/core/src/manager/components/preview/tools/menu.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/code/core/src/manager/components/preview/tools/menu.tsx b/code/core/src/manager/components/preview/tools/menu.tsx
index 0cb0531d5705..c192c9b450d7 100644
--- a/code/core/src/manager/components/preview/tools/menu.tsx
+++ b/code/core/src/manager/components/preview/tools/menu.tsx
@@ -11,6 +11,7 @@ import type { Combo } from 'storybook/manager-api';
 const menuMapper = ({ api, state }: Combo) => ({
   isVisible: api.getIsNavShown(),
   singleStory: state.singleStory,
+  viewMode: state.viewMode,
   toggle: () => api.toggleNav(),
 });
 
@@ -22,7 +23,7 @@ export const menuTool: Addon_BaseType = {
   match: ({ viewMode }) => ['story', 'docs'].includes(viewMode),
   render: () => (
     <Consumer filter={menuMapper}>
-      {({ isVisible, toggle, singleStory }) =>
+      {({ isVisible, toggle, singleStory, viewMode }) =>
         !singleStory &&
         !isVisible && (
           <>
@@ -35,7 +36,9 @@ export const menuTool: Addon_BaseType = {
             >
               <MenuIcon />
             </Button>
-            <Separator />
+            {/* Only show separator in story mode where other tools (like remount) are visible.
+                In docs mode, most left-side tools are filtered out, leaving an orphaned separator (fixes #21429) */}
+            {viewMode === 'story' && <Separator />}
           </>
         )
       }

From e904086bfcec3644d7dc65c528df8fb8e44a9f25 Mon Sep 17 00:00:00 2001
From: Valentin Palkovic <dev@valentinpalkovic.dev>
Date: Tue, 3 Feb 2026 10:17:02 +0100
Subject: [PATCH 2/2] Update
 code/core/src/manager/components/preview/tools/menu.tsx

---
 code/core/src/manager/components/preview/tools/menu.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/code/core/src/manager/components/preview/tools/menu.tsx b/code/core/src/manager/components/preview/tools/menu.tsx
index c192c9b450d7..16346b90bf88 100644
--- a/code/core/src/manager/components/preview/tools/menu.tsx
+++ b/code/core/src/manager/components/preview/tools/menu.tsx
@@ -36,8 +36,6 @@ export const menuTool: Addon_BaseType = {
             >
               <MenuIcon />
             </Button>
-            {/* Only show separator in story mode where other tools (like remount) are visible.
-                In docs mode, most left-side tools are filtered out, leaving an orphaned separator (fixes #21429) */}
             {viewMode === 'story' && <Separator />}
           </>
         )