sfp_front_vue_diarista_prestador/src/App.vue

<template>
  <router-view />
</template>

<script setup>
import { useQuasar } from "quasar";
import { StatusBar, Style } from "@capacitor/status-bar";
import { Capacitor } from "@capacitor/core";
import { watch, onBeforeMount } from "vue";
import { useI18n } from "vue-i18n";
import { Preferences } from "@capacitor/preferences";

defineOptions({
  name: "App",
});

const { locale } = useI18n();

const $q = useQuasar();

const updateStatusBar = async () => {
  if (!Capacitor.isNativePlatform()) return;

  await StatusBar.show();
  await StatusBar.setStyle({
    style: Style.Light,
  });
};

watch(
  () => locale.value,
  async (value) => {
    await Preferences.set({ key: "locale", value });
  },
);

onBeforeMount(async () => {
  $q.dark.set(false);
  await updateStatusBar();

  const { value: localePref } = await Preferences.get({ key: "locale" });
  const userLocale = localePref || window.navigator.language;

  console.log(userLocale);
});
</script>