Allow render i18n messages in top bar menus - refs BT#21104

AngelFQC · AngelFQC · commit fb31a821fdf7 · 2024-01-03T13:04:20.000-05:00
diff --git a/assets/vue/components/layout/TopbarLoggedIn.vue b/assets/vue/components/layout/TopbarLoggedIn.vue
@@ -63,9 +63,9 @@ import { useMessageRelUserStore } from "../../store/messageRelUserStore"
 
 import headerLogoPath from "../../../../assets/css/themes/chamilo/images/header-logo.svg"
 import { useNotification } from "../../composables/notification"
-import { useI18n } from 'vue-i18n';
+import { useI18n } from "vue-i18n"
 
-const { t } = useI18n();
+const { t } = useI18n()
 
 // eslint-disable-next-line no-undef
 const props = defineProps({
@@ -90,7 +90,7 @@ const btnTicketsOnClick = () => {
 const btnInboxOnClick = async () => await router.push({ name: "MessageList" })
 
 const elUserSubmenu = ref(null)
-const userSubmenuItems = [
+const userSubmenuItems = computed(() => [
   {
     label: props.currentUser.fullName,
     items: [
@@ -116,7 +116,7 @@ const userSubmenuItems = [
       },
     ],
   },
-]
+])
 
 function toogleUserMenu(event) {
   elUserSubmenu.value.toggle(event)
diff --git a/assets/vue/components/layout/TopbarNotLoggedIn.vue b/assets/vue/components/layout/TopbarNotLoggedIn.vue
@@ -12,7 +12,7 @@
 </template>
 
 <script setup>
-import { ref } from "vue"
+import {computed, ref} from "vue"
 import Menubar from "primevue/menubar"
 import headerLogoPath from "../../../../assets/css/themes/chamilo/images/header-logo.svg"
 import { useI18n } from "vue-i18n"
@@ -45,7 +45,7 @@ const languageItems = window.languages.map((language) => ({
 
 const currentLanguage = window.languages.find((language) => document.querySelector("html").lang === language.isocode)
 
-const menuItems = ref([
+const menuItems = computed(() => [
   {
     label: t("Home"),
     to: { name: "Index" },
