Merge pull request #29743 from storybookjs/norbert/no-context-in-prod

Core: Disable SidebarContextMenu in static builds
storybookjs · Dec 2, 2024 · 35afa71 · 35afa71
2 parents 0e2d73f + 0768cd1
commit 35afa71
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/code/.storybook/preview.tsx b/code/.storybook/preview.tsx
@@ -22,6 +22,7 @@ import { DocsPageWrapper } from '../lib/blocks/src/components';
 import { isChromatic } from './isChromatic';
 
 const { document } = global;
+globalThis.CONFIG_TYPE = 'DEVELOPMENT';
 
 const ThemeBlock = styled.div<{ side: 'left' | 'right'; layout: string }>(
   {

diff --git a/code/core/src/manager/components/sidebar/ContextMenu.tsx b/code/core/src/manager/components/sidebar/ContextMenu.tsx
@@ -12,7 +12,11 @@ import type { API } from '@storybook/core/manager-api';
 import type { Link } from '../../../components/components/tooltip/TooltipLinkList';
 import { StatusButton } from './StatusButton';
 import type { ExcludesNull } from './Tree';
-import { ContextMenu } from './Tree';
+
+const empty = {
+  onMouseEnter: () => {},
+  node: null,
+};
 
 export const useContextMenu = (context: API_HashEntry, links: Link[], api: API) => {
   const [hoverCount, setHoverCount] = useState(0);
@@ -34,7 +38,7 @@ export const useContextMenu = (context: API_HashEntry, links: Link[], api: API)
   }, []);
 
   /**
-   * Calculate the providerLinks whenever the user mouses over the container. We use an incrementer,
+   * Calculate the providerLinks whenever the user mouses over the container. We use an incrementor,
    * instead of a simple boolean to ensure that the links are recalculated
    */
   const providerLinks = useMemo(() => {
@@ -51,6 +55,11 @@ export const useContextMenu = (context: API_HashEntry, links: Link[], api: API)
   const isRendered = providerLinks.length > 0 || links.length > 0;
 
   return useMemo(() => {
+    // Never show the SidebarContextMenu in production
+    if (globalThis.CONFIG_TYPE !== 'DEVELOPMENT') {
+      return empty;
+    }
+
     return {
       onMouseEnter: handlers.onMouseEnter,
       node: isRendered ? (