set i18n.locale and localeChanged from vee-validate inside the language mutation of the store

frontend/src/store/store.js

@@ -1,11 +1,15 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 import createPersistedState from 'vuex-persistedstate'
+import { localeChanged } from 'vee-validate'
+import i18n from '../i18n.js'
 
 Vue.use(Vuex)
 
 export const mutations = {
   language: (state, language) => {
+    i18n.locale = language
+    localeChanged(language)
     state.language = language
   },
   email: (state, email) => {

frontend/src/store/store.test.js

@@ -1,8 +1,18 @@
 import { mutations, actions } from './store'
 import Vuex from 'vuex'
 import Vue from 'vue'
+import i18n from '../i18n.js'
+import { localeChanged } from 'vee-validate'
 
 jest.mock('vuex')
+jest.mock('../i18n.js')
+jest.mock('vee-validate', () => {
+  return {
+    localeChanged: jest.fn(),
+  }
+})
+
+i18n.locale = 'blubb'
 
 const {
   language,
@@ -29,6 +39,14 @@ describe('Vuex store', () => {
         language(state, 'de')
         expect(state.language).toEqual('de')
       })
+
+      it('sets the i18n locale', () => {
+        expect(i18n.locale).toBe('de')
+      })
+
+      it('calls localChanged of vee-validate', () => {
+        expect(localeChanged).toBeCalledWith('de')
+      })
     })
 
     describe('email', () => {

frontend/src/views/Pages/Login.vue

@@ -64,7 +64,6 @@ import InputPassword from '../../components/Inputs/InputPassword'
 import InputEmail from '../../components/Inputs/InputEmail'
 import { login } from '../../graphql/queries'
 import { getCommunityInfoMixin } from '../../mixins/getCommunityInfo'
-import { localeChanged } from 'vee-validate'
 
 export default {
   name: 'login',
@@ -102,8 +101,6 @@ export default {
             data: { login },
           } = result
           this.$store.dispatch('login', login)
-          this.$i18n.locale = login.language
-          localeChanged(login.language)
           this.$router.push('/overview')
           loader.hide()
         })