All files / src/stores language.store.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 
 
 
 
 
 
 
6x
9x
 
9x
 
 
 
 
9x
 
 
 
 
 
 
7x
7x
7x
7x
 
 
9x
 
 
import { AVAILABLE_LOCALES } from '@/models/available-locales';
import { i18n } from '@/plugins/vue-i18n';
import { useLocalStorage } from '@vueuse/core';
import axios from 'axios';
import { defineStore } from 'pinia';
import { computed, readonly } from 'vue';
 
export const useLanguageStore = defineStore('language', () => {
  const { locale } = i18n.global;
 
  const language = useLocalStorage(
    'lang',
    navigator.languages?.[0] || navigator.language || 'en',
  );
 
  const availableLocales = computed(() => AVAILABLE_LOCALES);
 
  /**
   * Sets the new language.
   * @param locale The new language.
   */
  function setLanguage(value: string): void {
    locale.value = value as typeof locale.value;
    language.value = value;
    axios.defaults.headers.common['Accept-Language'] = value;
    document.querySelector('html')?.setAttribute('lang', value);
  }
 
  return { language: readonly(language), availableLocales, setLanguage };
});