WIP: Setup i18n

client/src/locales/de.json

@@ -1,3 +1,11 @@
 {
-  "test": "Hallo VBV"
+  "general": {
+    "c2aNextStep": "Weiter geht's"
+  },
+  "dashboard": {
+    "welcome": "Willkommen, {name}"
+  },
+  "learningPathPage": {
+    "showListView": "Listenansicht anzeigen"
+  }
 }

client/src/main.ts

@@ -2,8 +2,8 @@ import * as log from "loglevel";
 import { createPinia } from "pinia";
 import { createApp, markRaw } from "vue";
 
-// import {setupI18n} from './i18n'
 import App from "./App.vue";
+import { loadLocaleMessages, setupI18n } from "./i18n";
 import router from "./router";
 
 import type { Router } from "vue-router";
@@ -15,11 +15,11 @@ if (window.location.href.indexOf("localhost") >= 0) {
   log.setLevel("warn");
 }
 
-// const i18n = setupI18n()
+const i18n = setupI18n();
 const app = createApp(App);
 
 // todo: define lang setup
-// await loadLocaleMessages(i18n, 'de')
+await loadLocaleMessages(i18n, "de");
 
 app.use(router);
 
@@ -33,6 +33,6 @@ pinia.use(({ store }) => {
   store.router = markRaw(router);
 });
 app.use(pinia);
-// app.use(i18n)
+app.use(i18n);
 
 app.mount("#app");

client/src/pages/CockpitPage.vue

@@ -11,7 +11,9 @@ const userStore = useUserStore();
   <div class="flex flex-col lg:flex-row">
     <main class="grow bg-gray-200 lg:order-2">
       <div class="mt-14 container-medium">
-        <h1 data-cy="welcome-message">Willkommen, {{ userStore.first_name }}</h1>
+        <h1 data-cy="welcome-message">
+          {{ $t("dashboard.welcome", { name: userStore.first_name }) }}
+        </h1>
         <div class="mb-14">
           <h2 class="mt-12 mb-3">Kurse</h2>
           <div class="flex flex-col md:flex-row justify-between">
@@ -19,7 +21,7 @@ const userStore = useUserStore();
               <h3 class="mb-4">Versicherungsvermittler/in</h3>
               <img class="mb-8 block" :src="'/static/icons/demo/vm-lernpfad.svg'" />
               <router-link class="btn-blue" to="/learn/versicherungsvermittlerin-lp">
-                Weiter geht's
+                {{ $t("general.c2aNextStep") }}
               </router-link>
             </div>
             <div class="bg-white p-6 md:w-[48%]">

client/src/pages/learningPath/LearningPathPage.vue

@@ -64,7 +64,7 @@ const createContinueUrl = (learningPath: LearningPath): [string, boolean] => {
               @click="learningPathStore.page = 'OVERVIEW'"
             >
               <it-icon-list />
-              Listenansicht anzeigen
+              {{ $t("learningPathPage.showListView") }}
             </button>
           </div>
           <LearningPathDiagram

requests.http

@@ -0,0 +1,2 @@
+# Logout
+POST http://localhost:8000/core/logout/

server/config/settings/base.py

@@ -414,9 +414,9 @@ else:
 
     structlog.configure(
         processors=shared_processors
-        + [
-            structlog.stdlib.ProcessorFormatter.wrap_for_formatter,
-        ],
+                   + [
+                       structlog.stdlib.ProcessorFormatter.wrap_for_formatter,
+                   ],
         context_class=dict,
         logger_factory=structlog.stdlib.LoggerFactory(),
         wrapper_class=structlog.stdlib.BoundLogger,
@@ -452,6 +452,7 @@ CORS_URLS_REGEX = r"^/api/.*$"
 CSP_DEFAULT_SRC = [
     "'self'",
     "'unsafe-inline'",
+    "'unsafe-eval'",
     "ws://localhost:5173",
     "ws://127.0.0.1:5173",
     "localhost:8000",