From a5f0875e0530ed015b4e27101fa936a5b1334bc5 Mon Sep 17 00:00:00 2001
From: Mika Andrianarijaona <mikaoelitiana@gmail.com>
Date: Wed, 4 Aug 2021 16:59:11 +0200
Subject: [PATCH 1/2] fix: do not display menu toggle when `singleStory=true`

---
 lib/ui/src/components/preview/tools/menu.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/lib/ui/src/components/preview/tools/menu.tsx b/lib/ui/src/components/preview/tools/menu.tsx
index 411baf5fd94f..9bb999c2186c 100644
--- a/lib/ui/src/components/preview/tools/menu.tsx
+++ b/lib/ui/src/components/preview/tools/menu.tsx
@@ -5,6 +5,7 @@ import { Addon } from '@storybook/addons';
 
 const menuMapper = ({ api, state }: Combo) => ({
   isVisible: state.layout.showNav,
+  singleStory: state.singleStory,
   toggle: () => api.toggleNav(),
 });
 
@@ -14,7 +15,8 @@ export const menuTool: Addon = {
   match: ({ viewMode }) => viewMode === 'story',
   render: () => (
     <Consumer filter={menuMapper}>
-      {({ isVisible, toggle }) =>
+      {({ isVisible, toggle, singleStory }) =>
+        !singleStory &&
         !isVisible && (
           <>
             <IconButton aria-label="Show sidebar" key="menu" onClick={toggle} title="Show sidebar">

From 658b55e8b9adc16d5337ddb9f47f5aaaba37555f Mon Sep 17 00:00:00 2001
From: Mika Andrianarijaona <mikaoelitiana@gmail.com>
Date: Thu, 5 Aug 2021 09:18:45 +0200
Subject: [PATCH 2/2] fix: don't display fullscreen toggle in `singleStory` if
 there is no panel available

---
 lib/ui/src/components/preview/toolbar.tsx | 26 +++++++++++++----------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/lib/ui/src/components/preview/toolbar.tsx b/lib/ui/src/components/preview/toolbar.tsx
index bdf60c1fe2b9..916a958aad48 100644
--- a/lib/ui/src/components/preview/toolbar.tsx
+++ b/lib/ui/src/components/preview/toolbar.tsx
@@ -43,6 +43,8 @@ const fullScreenMapper = ({ api, state }: Combo) => ({
   toggle: api.toggleFullscreen,
   value: state.layout.isFullscreen,
   shortcut: shortcutToHumanString(api.getShortcutKeys().fullScreen),
+  hasPanel: Object.keys(api.getPanels()).length > 0,
+  singleStory: state.singleStory,
 });
 
 export const fullScreenTool: Addon = {
@@ -51,17 +53,19 @@ export const fullScreenTool: Addon = {
   match: (p) => ['story', 'docs'].includes(p.viewMode),
   render: () => (
     <Consumer filter={fullScreenMapper}>
-      {({ toggle, value, shortcut }) => (
-        <S.DesktopOnly>
-          <IconButton
-            key="full"
-            onClick={toggle as any}
-            title={`${value ? 'Exit full screen' : 'Go full screen'} [${shortcut}]`}
-          >
-            <Icons icon={value ? 'close' : 'expand'} />
-          </IconButton>
-        </S.DesktopOnly>
-      )}
+      {({ toggle, value, shortcut, hasPanel, singleStory }) =>
+        (!singleStory || (singleStory && hasPanel)) && (
+          <S.DesktopOnly>
+            <IconButton
+              key="full"
+              onClick={toggle as any}
+              title={`${value ? 'Exit full screen' : 'Go full screen'} [${shortcut}]`}
+            >
+              <Icons icon={value ? 'close' : 'expand'} />
+            </IconButton>
+          </S.DesktopOnly>
+        )
+      }
     </Consumer>
   ),
 };