simplify code

Talend · Jul 27, 2023 · b63d96f · b63d96f
1 parent 4d73458
commit b63d96f
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 58 deletions.
diff --git a/packages/storybook/.storybook/preview.js b/packages/storybook/.storybook/preview.js
@@ -2,11 +2,9 @@ import React from 'react';
 
 import prettier from 'prettier/standalone';
 import prettierBabel from 'prettier/parser-babel';
-import { addons } from '@storybook/addons';
 
 import { DocsContainer } from '@storybook/blocks';
 
-import { SET_STORIES } from '@storybook/core-events';
 import '@talend/storybook-docs/dist/globalStyles.min.css';
 
 import {
@@ -31,7 +29,8 @@ import {
 } from '@talend/locales-tui-forms';
 
 import 'focus-outline-manager';
-import { useThemeSwitcher } from './utils/ThemeSwitcher.hook';
+import { create } from '@storybook/theming';
+import { themeDark, themeLight } from '@talend/storybook-docs';
 
 export const i18n = {
 	namespaces: [
@@ -90,17 +89,24 @@ export const parameters = {
 		// 		orderedList: false,
 		// 	},
 		// },
-		container: ({ theme, ...props }) => {
+		container: ({ children, context }) => {
 			// 	// useEffect(() => {
 			// 	// 	channel.emit('SET_STATUSES_BY_PAGE', statusByPage);
 			// 	// }, [statusByPage]);
 
-			const initialTheme = props.context.store.globals.globals.theme;
-			const { theme: previewTheme } = useThemeSwitcher(initialTheme);
+			const themeKey = context.store.globals.globals.theme || 'light';
+			const theme = create(
+				{
+					light: themeLight,
+					dark: themeDark,
+				}[themeKey],
+			);
 
 			return (
-				<div data-theme={previewTheme?.base || 'light'}>
-					<DocsContainer {...props} theme={previewTheme} />
+				<div data-theme={themeKey}>
+					<DocsContainer context={context} theme={theme}>
+						{children}
+					</DocsContainer>
 				</div>
 			);
 		},

diff --git a/packages/storybook/.storybook/utils/ThemeSwitcher.hook.ts b/packages/storybook/.storybook/utils/ThemeSwitcher.hook.ts
diff --git a/tools/scripts-config-storybook-lib/.storybook-templates/preview.js b/tools/scripts-config-storybook-lib/.storybook-templates/preview.js
@@ -77,17 +77,7 @@ const defaultPreview = {
 				dynamicTitle: true,
 			},
 		},
-		theme: {
-			name: 'Theme',
-			description: 'Choose a theme to apply to the design system',
-			toolbar: {
-				icon: 'paintbrush',
-				items: [
-					{ value: 'light', left: '⚪️', title: 'Default theme' },
-					{ value: 'dark', left: '⚫️', title: 'Dark theme' },
-				],
-			},
-		},
+
 	},
 	loaders: [cmfLoader].filter(Boolean),
 	decorators: [
@@ -126,9 +116,6 @@ const defaultPreview = {
 		},
 		cmfDecorator
 	].filter(Boolean),
-	parameters:{
-
-	}
 };