From 6e03027b4c055831828e1fe935d79635339f2e96 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Jaenisch?= <andre.jaenisch@posteo.de>
Date: Wed, 28 Feb 2024 21:30:24 +0100
Subject: [PATCH] feat: apply locale and writing direction
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

FINALLY! I can look into translated UIs in Storybook with Svelte!

Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de>
---
 .storybook/preview.ts | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/.storybook/preview.ts b/.storybook/preview.ts
index 28086b1..27a93a7 100644
--- a/.storybook/preview.ts
+++ b/.storybook/preview.ts
@@ -1,6 +1,8 @@
 import type { Preview } from '@storybook/svelte';
 import { init, locale, register } from 'svelte-i18n';
 
+import { mapLocaleToDir } from '../src/lib/i18n/index.ts';
+
 // See src/routes/+layout.svelte
 // Order is important!
 import '../src/theme.postcss';
@@ -14,6 +16,15 @@ register('he', () => import('../src/lib/i18n/locales/he.json'));
 init({ fallbackLocale: 'en', initialLocale: 'en' });
 locale.set('en');
 
+function withI18n(storyFn, context) {
+	const l = context.globals.locale;
+
+	locale.set(l);
+	document.dir = mapLocaleToDir(l);
+
+	return storyFn();
+}
+
 const preview: Preview = {
 	globalTypes: {
 		locale: {
@@ -49,4 +60,6 @@ const preview: Preview = {
 	}
 };
 
+export const decorators = [withI18n];
+
 export default preview;