From 61a7b2a4c442c4b3b54e0ed9cd340a6f518e244e Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 29 Nov 2024 09:22:03 +0100 Subject: [PATCH 1/3] disable SidebarContextMenu in static build --- .../src/manager/components/sidebar/ContextMenu.tsx | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/code/core/src/manager/components/sidebar/ContextMenu.tsx b/code/core/src/manager/components/sidebar/ContextMenu.tsx index 867ed8da72b7..6e0300a22eb0 100644 --- 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 ? ( From 0241fb366b733955ecff96cba52e8ed6120ad305 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 29 Nov 2024 11:37:40 +0100 Subject: [PATCH 2/3] fix tests --- code/.storybook/storybook.setup.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/code/.storybook/storybook.setup.ts b/code/.storybook/storybook.setup.ts index 1be658970e2f..da5b925272eb 100644 --- a/code/.storybook/storybook.setup.ts +++ b/code/.storybook/storybook.setup.ts @@ -14,6 +14,8 @@ import * as projectAnnotations from './preview'; vi.spyOn(console, 'warn').mockImplementation((...args) => console.log(...args)); +globalThis.CONFIG_TYPE = 'DEVELOPMENT'; + const annotations = setProjectAnnotations([ // @ts-expect-error check type errors later projectAnnotations, From 60ec2fe1573027dc5c82627fe7aabcfd52df0452 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 29 Nov 2024 12:04:03 +0100 Subject: [PATCH 3/3] apply global for CONFIG_TYPE in the preview annotation --- code/.storybook/preview.tsx | 1 + code/.storybook/storybook.setup.ts | 2 -- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/code/.storybook/preview.tsx b/code/.storybook/preview.tsx index fac0c9bdb2b1..cc4481a56d1c 100644 --- 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/.storybook/storybook.setup.ts b/code/.storybook/storybook.setup.ts index da5b925272eb..1be658970e2f 100644 --- a/code/.storybook/storybook.setup.ts +++ b/code/.storybook/storybook.setup.ts @@ -14,8 +14,6 @@ import * as projectAnnotations from './preview'; vi.spyOn(console, 'warn').mockImplementation((...args) => console.log(...args)); -globalThis.CONFIG_TYPE = 'DEVELOPMENT'; - const annotations = setProjectAnnotations([ // @ts-expect-error check type errors later projectAnnotations,