diff --git a/code/core/src/core-server/presets/common-preset.ts b/code/core/src/core-server/presets/common-preset.ts index bb9445809326..86f706ca4c34 100644 --- a/code/core/src/core-server/presets/common-preset.ts +++ b/code/core/src/core-server/presets/common-preset.ts @@ -209,6 +209,7 @@ export const features: PresetProperty<'features'> = async (existing) => ({ backgrounds: true, outline: true, measure: true, + sidebarOnboardingChecklist: true, }); export const csfIndexer: Indexer = { diff --git a/code/core/src/manager/components/sidebar/Sidebar.stories.tsx b/code/core/src/manager/components/sidebar/Sidebar.stories.tsx index 25b623802eb7..25cbe035cf46 100644 --- a/code/core/src/manager/components/sidebar/Sidebar.stories.tsx +++ b/code/core/src/manager/components/sidebar/Sidebar.stories.tsx @@ -208,6 +208,19 @@ export const SimpleInProduction: Story = { }, }; +export const SimpleNoChecklist: Story = { + args: { + showCreateStoryButton: false, + }, + beforeEach: () => { + const features = global.FEATURES; + global.FEATURES = { ...features, sidebarOnboardingChecklist: false }; + return () => { + global.FEATURES = features; + }; + }, +}; + export const Mobile: Story = { decorators: [mobileLayoutDecorator], globals: { sb_theme: 'light', viewport: { value: 'mobile1' } }, diff --git a/code/core/src/manager/components/sidebar/Sidebar.tsx b/code/core/src/manager/components/sidebar/Sidebar.tsx index d16b5b1a51b2..46bf07a61b6b 100644 --- a/code/core/src/manager/components/sidebar/Sidebar.tsx +++ b/code/core/src/manager/components/sidebar/Sidebar.tsx @@ -166,7 +166,9 @@ export const Sidebar = React.memo(function Sidebar({ isLoading={isLoading} onMenuClick={onMenuClick} /> - {!isLoading && global.CONFIG_TYPE === 'DEVELOPMENT' && } + {!isLoading && + global.CONFIG_TYPE === 'DEVELOPMENT' && + global.FEATURES?.sidebarOnboardingChecklist !== false && } {

- {checklist.openItems.length === 0 ? ( -
Your work here is done!
- ) : checklist.widget.disable || checklist.openItems.every((item) => item.isMuted) ? ( -
- Want to see this in the sidebar?{' '} - checklist.disable(false)}>Show in sidebar -
- ) : ( -
- Don't want to see this in the sidebar?{' '} - checklist.mute(checklist.allItems.map(({ id }) => id))}> - Remove from sidebar - -
+ {global.FEATURES?.sidebarOnboardingChecklist !== false && ( + <> + {checklist.openItems.length === 0 ? ( +
Your work here is done!
+ ) : checklist.widget.disable || checklist.openItems.every((item) => item.isMuted) ? ( +
+ Want to see this in the sidebar?{' '} + checklist.disable(false)}>Show in sidebar +
+ ) : ( +
+ Don't want to see this in the sidebar?{' '} + checklist.mute(checklist.allItems.map(({ id }) => id))}> + Remove from sidebar + +
+ )} + )} ); diff --git a/code/core/src/types/modules/core-common.ts b/code/core/src/types/modules/core-common.ts index 9a9514cd3707..78ebbab44917 100644 --- a/code/core/src/types/modules/core-common.ts +++ b/code/core/src/types/modules/core-common.ts @@ -453,6 +453,13 @@ export interface StorybookConfigRaw { */ actions?: boolean; + /** + * Enable the onboarding checklist sidebar widget + * + * @default true + */ + sidebarOnboardingChecklist?: boolean; + /** * @temporary This feature flag is a migration assistant, and is scheduled to be removed. *