From a9072370ca1eb9a5cce928b1d487db0f307edea6 Mon Sep 17 00:00:00 2001
From: ivarlovlie <git@ivarlovlie.no>
Date: Tue, 20 Sep 2022 15:24:27 +0800
Subject: feat: Move old apps into it's own directory

---
 apps/kit/src/lib/components/locale-switcher.svelte | 52 ++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 apps/kit/src/lib/components/locale-switcher.svelte

(limited to 'apps/kit/src/lib/components/locale-switcher.svelte')

diff --git a/apps/kit/src/lib/components/locale-switcher.svelte b/apps/kit/src/lib/components/locale-switcher.svelte
new file mode 100644
index 0000000..39d6168
--- /dev/null
+++ b/apps/kit/src/lib/components/locale-switcher.svelte
@@ -0,0 +1,52 @@
+<script lang="ts">
+    import {browser} from "$app/environment";
+    import {page} from "$app/stores";
+    import {setLocale, locale} from "$lib/i18n/i18n-svelte";
+    import type {Locales} from "$lib/i18n/i18n-types";
+    import {locales} from "$lib/i18n/i18n-util";
+    import {loadLocaleAsync} from "$lib/i18n/i18n-util.async";
+
+    const switchLocale = async (
+        newLocale: Locales,
+        updateHistoryState = true,
+    ) => {
+        if (!newLocale || $locale === newLocale) return;
+
+        // load new dictionary from server
+        await loadLocaleAsync(newLocale);
+
+        // select locale
+        setLocale(newLocale);
+
+        // update `lang` attribute
+        document.querySelector("html")?.setAttribute("lang", newLocale);
+
+        //TODO set cookie that persists the locale
+    };
+
+    // update locale when navigating via browser back/forward buttons
+    const handlePopStateEvent = async ({state}: PopStateEvent) =>
+        switchLocale(state.locale, false);
+
+    // update locale when page store changes
+    $: if (browser) {
+        const lang = $page.params.lang as Locales;
+        switchLocale(lang, false);
+    }
+</script>
+
+<svelte:window on:popstate={handlePopStateEvent}/>
+
+<ul>
+    {#each locales as l}
+        <li>
+            <button
+                    type="button"
+                    class:active={l === $locale}
+                    on:click={() => switchLocale(l)}
+            >
+                {l}
+            </button>
+        </li>
+    {/each}
+</ul>
-- 
cgit v1.3