From 0606cb07aec1219cb450066877482f90e71e7217 Mon Sep 17 00:00:00 2001
From: Alicia Sykes <sykes.alicia@gmail.com>
Date: Thu, 22 Jul 2021 22:20:03 +0100
Subject: [PATCH] :sparkles: Implements localisation

---
 src/assets/locales/en-GB.json |  4 ++++
 src/main.js                   | 29 +++++++++++++++++++++++------
 2 files changed, 27 insertions(+), 6 deletions(-)
 create mode 100644 src/assets/locales/en-GB.json

diff --git a/src/assets/locales/en-GB.json b/src/assets/locales/en-GB.json
new file mode 100644
index 00000000..0288acea
--- /dev/null
+++ b/src/assets/locales/en-GB.json
@@ -0,0 +1,4 @@
+{
+  "test": "Hello World!",
+  "test2": "Im a fallback"
+}
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index ca08f56d..1004cfc1 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,18 +1,25 @@
+// Import core framework and essential utils
 import Vue from 'vue';
+import VueI18n from 'vue-i18n'; // i18n for localization
 
-/* Import component Vue plugins, used throughout the app */
+// Import component Vue plugins, used throughout the app
 import VTooltip from 'v-tooltip'; // A Vue directive for Popper.js, tooltip component
 import VModal from 'vue-js-modal'; // Modal component
 import VSelect from 'vue-select'; // Select dropdown component
 import VTabs from 'vue-material-tabs'; // Tab view component, used on the config page
 import Toasted from 'vue-toasted'; // Toast component, used to show confirmation notifications
 
-import { toastedOptions } from '@/utils/defaults';
+// Import base Dashy components and utils
 import Dashy from '@/App.vue';
 import router from '@/router';
 import registerServiceWorker from '@/registerServiceWorker';
 import clickOutside from '@/utils/ClickOutside';
+import { toastedOptions } from '@/utils/defaults';
 
+// Locales - Import translation files here!
+import en from '@/assets/locales/en-GB.json';
+
+Vue.use(VueI18n);
 Vue.use(VTooltip);
 Vue.use(VModal);
 Vue.use(VTabs);
@@ -22,10 +29,20 @@ Vue.directive('clickOutside', clickOutside);
 
 Vue.config.productionTip = false;
 
+// Setup translations
+const messages = { en }; // <-- Add new language files here!
+
+const i18n = new VueI18n({
+  locale: 'en',
+  fallbackLocale: 'en',
+  messages,
+});
+
 // Register Service Worker
 registerServiceWorker();
 
-new Vue({
-  router,
-  render: (awesome) => awesome(Dashy),
-}).$mount('#app');
+// Render function
+const render = (awesome) => awesome(Dashy);
+
+// All done, now just initialize main Vue app!
+new Vue({ router, render, i18n }).$mount('#app');