fix: sync language selector with browser back/forward navigation
All checks were successful
CI / update (push) Successful in 1m10s

Replace non-reactive window.location.pathname with SvelteKit's reactive $page store to ensure language selector updates when navigating via browser back/forward buttons.
This commit is contained in:
2026-01-03 19:39:04 +01:00
parent 72f0713ecc
commit 191a1879d8

View File

@@ -1,5 +1,6 @@
<script lang="ts"> <script lang="ts">
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
import { page } from '$app/stores';
import { recipeTranslationStore } from '$lib/stores/recipeTranslation'; import { recipeTranslationStore } from '$lib/stores/recipeTranslation';
import { languageStore } from '$lib/stores/language'; import { languageStore } from '$lib/stores/language';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
@@ -9,16 +10,17 @@
let langOptions: HTMLDivElement; let langOptions: HTMLDivElement;
$effect(() => { $effect(() => {
// Update current language and path when page changes // Update current language and path when page changes (reactive to browser navigation)
if (typeof window !== 'undefined') { const path = $page.url.pathname;
const path = window.location.pathname;
currentPath = path; currentPath = path;
if (path.startsWith('/recipes')) { if (path.startsWith('/recipes')) {
languageStore.set('en'); languageStore.set('en');
} else if (path.startsWith('/rezepte')) { } else if (path.startsWith('/rezepte')) {
languageStore.set('de'); languageStore.set('de');
} else if (path === '/') { } else if (path === '/') {
// On main page, read from localStorage // On main page, read from localStorage
if (typeof localStorage !== 'undefined') {
const preferredLanguage = localStorage.getItem('preferredLanguage'); const preferredLanguage = localStorage.getItem('preferredLanguage');
languageStore.set(preferredLanguage === 'en' ? 'en' : 'de'); languageStore.set(preferredLanguage === 'en' ? 'en' : 'de');
} }