fix(front): fix changing language not being saved to the user's settings

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2023-08-23 16:11:55 +02:00
parent fef60ed0f9
commit 010a5e426d
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773
3 changed files with 14 additions and 9 deletions

View file

@ -70,14 +70,16 @@ const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
const { loggedUser } = useUserSettings(); const { loggedUser } = useUserSettings();
const { mutate: doUpdateLocale } = updateLocale();
onMounted(() => { onMounted(() => {
updateLocale(locale as unknown as string); doUpdateLocale({ locale: locale as unknown as string });
doUpdateSetting({ timezone }); doUpdateSetting({ timezone });
}); });
watch(locale, () => { watch(locale, () => {
if (locale.value) { if (locale.value) {
updateLocale(locale.value as string); doUpdateLocale({ locale: locale as unknown as string });
saveLocaleData(locale.value as string); saveLocaleData(locale.value as string);
} }
}); });

View file

@ -59,12 +59,8 @@ export async function doUpdateSetting(
})); }));
} }
export async function updateLocale(locale: string) { export function updateLocale() {
useMutation<{ id: string; locale: string }>(UPDATE_USER_LOCALE, () => ({ return useMutation<{ id: string; locale: string }>(UPDATE_USER_LOCALE);
variables: {
locale,
},
}));
} }
export function registerAccount() { export function registerAccount() {

View file

@ -47,6 +47,7 @@
<o-select <o-select
:loading="loadingTimezones || loadingUserSettings" :loading="loadingTimezones || loadingUserSettings"
v-model="$i18n.locale" v-model="$i18n.locale"
@update:modelValue="updateLanguage"
:placeholder="t('Select a language')" :placeholder="t('Select a language')"
id="setting-language" id="setting-language"
> >
@ -147,7 +148,7 @@ import RouteName from "../../router/name";
import { AddressSearchType } from "@/types/enums"; import { AddressSearchType } from "@/types/enums";
import { Address, IAddress } from "@/types/address.model"; import { Address, IAddress } from "@/types/address.model";
import { useTimezones } from "@/composition/apollo/config"; import { useTimezones } from "@/composition/apollo/config";
import { useUserSettings } from "@/composition/apollo/user"; import { useUserSettings, updateLocale } from "@/composition/apollo/user";
import { useHead } from "@vueuse/head"; import { useHead } from "@vueuse/head";
import { computed, defineAsyncComponent, ref, watch } from "vue"; import { computed, defineAsyncComponent, ref, watch } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
@ -172,6 +173,12 @@ useHead({
const theme = ref(localStorage.getItem("theme")); const theme = ref(localStorage.getItem("theme"));
const systemTheme = ref(!("theme" in localStorage)); const systemTheme = ref(!("theme" in localStorage));
const { mutate: doUpdateLocale } = updateLocale();
const updateLanguage = (newLocale: string) => {
doUpdateLocale({ locale: newLocale });
};
watch(systemTheme, (newSystemTheme) => { watch(systemTheme, (newSystemTheme) => {
console.debug("changing system theme", newSystemTheme); console.debug("changing system theme", newSystemTheme);
if (newSystemTheme) { if (newSystemTheme) {