From 997412d7b35ad2b53a46346f5dbcbeb321fa5641 Mon Sep 17 00:00:00 2001
From: Jonathan Weth <git@jonathanweth.de>
Date: Wed, 31 Aug 2022 15:47:36 +0200
Subject: [PATCH] Include and configure vue-i18n

---
 aleksis/core/assets/app.js                    | 23 ++++++++++++++++++-
 .../assets/components/CacheNotification.vue   |  2 +-
 .../notifications/NotificationItem.vue        |  2 +-
 aleksis/core/assets/messages.json             | 21 +++++++++++++++++
 aleksis/core/settings.py                      |  1 +
 5 files changed, 46 insertions(+), 3 deletions(-)
 create mode 100644 aleksis/core/assets/messages.json

diff --git a/aleksis/core/assets/app.js b/aleksis/core/assets/app.js
index daf30dfdb..31555d16d 100644
--- a/aleksis/core/assets/app.js
+++ b/aleksis/core/assets/app.js
@@ -7,6 +7,25 @@ import ApolloClient from 'apollo-boost'
 import VueApollo from 'vue-apollo'
 
 import "./css/global.scss"
+import VueI18n from 'vue-i18n'
+
+import messages from "./messages.json"
+
+Vue.use(VueI18n)
+
+const i18n = new VueI18n({
+    locale: JSON.parse(document.getElementById("current-language").textContent),
+    fallbackLocale: "en",
+    availableLocales: JSON.parse(document.getElementById("language-info-list").textContent),
+    messages
+});
+
+// Using this function, apps can register their locale files
+i18n.registerLocale = function (messages) {
+    for (let locale in messages) {
+        i18n.mergeLocaleMessage(locale, messages[locale]);
+    }
+};
 
 Vue.use(Vuetify)
 Vue.use(VueRouter)
@@ -96,8 +115,10 @@ const app = new Vue({
         "notification-list": NotificationList,
         "sidenav-search": SidenavSearch,
     },
-    router
+    router,
+    i18n
 })
 
 window.app = app;
 window.router = router;
+window.i18n = i18n;
diff --git a/aleksis/core/assets/components/CacheNotification.vue b/aleksis/core/assets/components/CacheNotification.vue
index 4491615e6..d636a056c 100644
--- a/aleksis/core/assets/components/CacheNotification.vue
+++ b/aleksis/core/assets/components/CacheNotification.vue
@@ -1,6 +1,6 @@
 <template>
   <message-box :value="cache" type="warning">
-    {{ this.$root.django.gettext('This page may contain outdated information since there is no internet connection.') }}
+    {{ $t('alerts.page_cached') }}
   </message-box>
 </template>
 
diff --git a/aleksis/core/assets/components/notifications/NotificationItem.vue b/aleksis/core/assets/components/notifications/NotificationItem.vue
index 0388d0758..2035cbd69 100644
--- a/aleksis/core/assets/components/notifications/NotificationItem.vue
+++ b/aleksis/core/assets/components/notifications/NotificationItem.vue
@@ -22,7 +22,7 @@
 
         <v-list-item-action v-if="notification.link">
           <v-btn text :href="notification.link">
-            {{ $root.django.gettext('More information →') }}
+            {{ $t('notifications.more_information') }} →
           </v-btn>
         </v-list-item-action>
 
diff --git a/aleksis/core/assets/messages.json b/aleksis/core/assets/messages.json
new file mode 100644
index 000000000..34c7dab87
--- /dev/null
+++ b/aleksis/core/assets/messages.json
@@ -0,0 +1,21 @@
+{
+  "en": {
+    "notifications":  {
+      "more_information": "More information",
+      "no_notifications": "No notifications available yet."
+    },
+    "alerts": {
+      "page_cached": "This page may contain outdated information since there is no internet connection."
+    }
+  },
+  "de": {
+    "notifications": {
+      "more_information": "Mehr Informationen",
+      "no_notifications": "Keine Benachrichtigungen verfügbar."
+    },
+    "alerts": {
+      "page_cached": "Diese Seite enthält vielleicht veraltete Informationen, da es keine Internetverbindung gibt."
+    }
+  }
+}
+
diff --git a/aleksis/core/settings.py b/aleksis/core/settings.py
index 60f934407..0440d3424 100644
--- a/aleksis/core/settings.py
+++ b/aleksis/core/settings.py
@@ -579,6 +579,7 @@ YARN_INSTALLED_APPS = [
     "webpack@^5.73.0",
     "webpack-bundle-tracker@^1.6.0",
     "webpack-cli@^4.10.0",
+    "vue-i18n@8",
 ]
 
 merge_app_settings("YARN_INSTALLED_APPS", YARN_INSTALLED_APPS, True)
-- 
GitLab