feat:#60 added first example localization

frontend/src/components/MenuBar.vue

@@ -1,34 +1,36 @@
 <script lang="ts" setup>
 import { ref } from "vue";
+import { useI18n } from "vue-i18n";
+const {t} = useI18n({})
 
 const items = ref([
   {
-    label: "Create Calendar",
+    label: t('createCalendar'),
     icon: "pi pi-fw pi-plus",
     url: "/",
   },
   {
-    label: "Edit Calendar",
+    label: t('editCalendar'),
     icon: "pi pi-fw pi-pencil",
     url: "/edit",
   },
   {
-    label: "Check Room Availability",
+    label: t('roomFinder'),
     icon: "pi pi-fw pi-calendar",
     url: "/rooms",
   },
   {
-    label: "FAQ",
+    label: t('faq'),
     icon: "pi pi-fw pi-book",
     url: "/faq",
   },
   {
-    label: "Imprint",
+    label: t('imprint'),
     icon: "pi pi-fw pi-id-card",
     url: "/imprint",
   },
   {
-    label: "Privacy",
+    label: t('privacy'),
     url: "/privacy-policy",
     icon: "pi pi-fw pi-exclamation-triangle",
   },

frontend/src/i18n/index.ts

@@ -0,0 +1,11 @@
+import { createI18n } from 'vue-i18n'
+import messages from "./messages.ts";
+
+const i18n = createI18n({
+  legacy: false,
+  globalInjection: true,
+  locale: 'en',
+  messages,
+})
+
+export default i18n

frontend/src/i18n/messages.ts

@@ -0,0 +1,18 @@
+export default {
+  en: {
+      createCalendar: 'Create Calendar',
+      editCalendar: 'Edit Calendar',
+      roomFinder: 'Room Finder',
+      faq: 'FAQ',
+      imprint: 'Imprint',
+      privacy: 'Privacy',
+  },
+  de: {
+      createCalendar: 'Kalender erstellen',
+      editCalendar: 'Kalender bearbeiten',
+      roomFinder: 'Raumfinder',
+      faq: 'FAQ',
+      imprint: 'Impressum',
+      privacy: 'Datenschutz',
+  }
+}

frontend/src/main.ts

@@ -30,6 +30,7 @@ import Column from "primevue/column";
 import DynamicDialog from "primevue/dynamicdialog";
 import DialogService from "primevue/dialogservice";
 import ProgressSpinner from "primevue/progressspinner";
+import i18n from "./i18n";
 
 const app = createApp(App);
 const pinia = createPinia();
@@ -39,6 +40,7 @@ app.use(router);
 app.use(ToastService);
 app.use(pinia);
 app.use(DialogService);
+app.use(i18n);
 app.component("Button", Button);
 app.component("Menu", Menu);
 app.component("Menubar", Menubar);