feat:#60 added localization switch

frontend/src/components/MenuBar.vue

@@ -1,58 +1,50 @@
 <script lang="ts" setup>
-import { ref } from "vue";
+import { computed } from "vue";
 import { useI18n } from "vue-i18n";
 import LocaleSwitcher from "./LocaleSwitcher.vue";
-import i18n from "../i18n";
+const { t } = useI18n({ useScope: 'global' })
 
-const { t, locale } = useI18n();
-
-console.debug("locale", locale);
-console.debug(useI18n().locale)
-
-const items = ref([
+const items = computed(() => [
   {
     label: t("createCalendar"),
     icon: "pi pi-fw pi-plus",
-    url: `/${locale}`,
+    to: "/",
   },
   {
     label: t("editCalendar"),
     icon: "pi pi-fw pi-pencil",
-    url: `/${locale}/edit`,
+    to: "/edit",
   },
   {
     label: t("roomFinder"),
     icon: "pi pi-fw pi-calendar",
-    url: `/${locale}/rooms`,
+    to: `rooms`,
   },
   {
     label: t("faq"),
     icon: "pi pi-fw pi-book",
-    url: `/${i18n.vueI18n.global.locale}/faq`,
+    to: `faq`,
   },
   {
     label: t("imprint"),
     icon: "pi pi-fw pi-id-card",
-    url: `/${i18n.vueI18n.global.locale}/imprint`,
+    to: `imprint`,
   },
   {
     label: t("privacy"),
     icon: "pi pi-fw pi-exclamation-triangle",
-    url: `/${i18n.vueI18n.global.locale}/privacy-policy`,
+    to: `privacy-policy`,
   },
 ]);
 
-function removeAllItems() {
-  items.value = [];
-}
 </script>
 
 <template>
   <Menubar :model="items" class="menubar justify-content-center">
-    <template #start></template>
+    <template #start>
+    </template>
     <template #end>
       <LocaleSwitcher></LocaleSwitcher>
-      <Button @click="removeAllItems()"></Button>
     </template>
   </Menubar>
 </template>