diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx
index aace77bf40..e83526aa03 100644
--- a/.storybook/preview.tsx
+++ b/.storybook/preview.tsx
@@ -1,12 +1,11 @@
-import type { ArgTypes, Preview, Decorator } from "@storybook/react-vite";
-import { addons } from "storybook/preview-api";
+import type { ArgTypes, Preview, Decorator, ReactRenderer, StrictArgs } from "@storybook/react-vite";
import "../res/css/shared.pcss";
import "./preview.css";
import React, { useLayoutEffect } from "react";
-import { FORCE_RE_RENDER } from "storybook/internal/core-events";
import { setLanguage } from "../src/shared-components/utils/i18n";
import { TooltipProvider } from "@vector-im/compound-web";
+import { StoryContext } from "storybook/internal/csf";
export const globalTypes = {
theme: {
@@ -59,29 +58,9 @@ const withThemeProvider: Decorator = (Story, context) => {
);
};
-const LanguageSwitcher: React.FC<{
- language: string;
-}> = ({ language }) => {
- useLayoutEffect(() => {
- const changeLanguage = async (language: string) => {
- await setLanguage(language);
- // Force the component to re-render to apply the new language
- addons.getChannel().emit(FORCE_RE_RENDER);
- };
- changeLanguage(language);
- }, [language]);
-
- return null;
-};
-
-export const withLanguageProvider: Decorator = (Story, context) => {
- return (
- <>
-
-
- >
- );
-};
+async function languageLoader(context: StoryContext): Promise {
+ await setLanguage(context.globals.language);
+}
const withTooltipProvider: Decorator = (Story) => {
return (
@@ -93,7 +72,7 @@ const withTooltipProvider: Decorator = (Story) => {
const preview: Preview = {
tags: ["autodocs"],
- decorators: [withThemeProvider, withLanguageProvider, withTooltipProvider],
+ decorators: [withThemeProvider, withTooltipProvider],
parameters: {
options: {
storySort: {
@@ -108,6 +87,7 @@ const preview: Preview = {
test: "error",
},
},
+ loaders: [languageLoader],
};
export default preview;