Types for langcodes

src/home/HomeNews.vue

@@ -2,7 +2,7 @@
 import useLocale from "@/i18n/locale.composable";
 import items from "./news.yaml";
 
-const { th } = useLocale();
+const { th2 } = useLocale();
 
 function getDate(date: Date) {
   return date.toISOString().slice(0, 10);
@@ -16,9 +16,9 @@ function getDate(date: Date) {
       :key="i"
       class="bg-sky-50 dark:bg-sky-800 shadow shadow-sky-200 dark:shadow-sky-600 text-sky-800 dark:text-sky-200 p-1 px-2 my-2"
     >
-      <strong>{{ getDate(item.date) }}: {{ th(item.title) }}</strong>
+      <strong>{{ getDate(item.date) }}: {{ th2(item.title) }}</strong>
       <!-- eslint-disable-next-line vue/no-v-html -->
-      <div v-html="th(item.body)"></div>
+      <div v-html="th2(item.body)"></div>
     </article>
   </div>
 </template>

src/i18n/locale.composable.ts

@@ -3,8 +3,9 @@ import { useI18n } from "vue-i18n";
 import { filesize } from "filesize";
 import { useStorage } from "@vueuse/core";
 import { configSymbol } from "@formkit/vue";
+import type { ByLang, SvEn, SweEng } from "@/util.types";
 
-const storedLocale = useStorage("locale", "");
+const storedLocale = useStorage<SvEn | "">("locale", "");
 
 export default function useLocale() {
   const { locale } = useI18n();
@@ -18,7 +19,9 @@ export default function useLocale() {
   };
 
   // The ISO 639-3 code is used in many parts of the Språkbanken infrastructure.
-  const locale3 = computed(() => (locale.value == "en" ? "eng" : "swe"));
+  const locale3 = computed<SweEng>(() =>
+    locale.value == "en" ? "eng" : "swe",
+  );
 
   // Sync from storage once, if present
   if (storedLocale.value) {
@@ -28,22 +31,20 @@ export default function useLocale() {
 
   // Then sync from switcher continually
   watch(locale, () => {
-    storedLocale.value = locale.value;
+    storedLocale.value = (locale.value as SvEn) || "";
     exportLocale();
   });
 
   /** Translate here - picks the current language out of a strings-by-language object. */
-  function th(stringsByLang?: Record<string, string>) {
-    if (!stringsByLang) return undefined;
-    if (typeof stringsByLang == "string") return stringsByLang;
-    const lang3 = { sv: "swe", en: "eng" }[locale.value];
-    return (
-      stringsByLang[locale.value] ||
-      (lang3 && stringsByLang[lang3]) ||
-      stringsByLang.eng ||
-      stringsByLang.swe ||
-      Object.values(stringsByLang)[0]
-    );
+  function th(map?: ByLang): string | undefined {
+    if (!map) return undefined;
+    return th2({ sv: map.swe, en: map.eng });
+  }
+
+  /** Translate here - picks the current language out of a strings-by-language object. */
+  function th2(map?: Record<SvEn, string>): string | undefined {
+    if (!map) return undefined;
+    return map[locale.value as SvEn];
   }
 
   /** Wrap the filesize lib with some sane defaults and avoiding exponential notation. */
@@ -58,6 +59,7 @@ export default function useLocale() {
     locale,
     locale3,
     th,
+    th2,
     filesize: myFilesize,
   };
 }

src/util.types.ts

@@ -1 +1,4 @@
-export type ByLang<T = string> = { swe: T; eng: T };
+export type SweEng = "swe" | "eng";
+export type SvEn = "sv" | "en";
+
+export type ByLang<T = string> = Record<SweEng, T>;