diff --git a/package-lock.json b/package-lock.json index 36e9f017..377990f1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15442,6 +15442,11 @@ "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==", "dev": true }, + "shvl": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/shvl/-/shvl-1.3.1.tgz", + "integrity": "sha512-+rRPP46hloYUAEImJcqprUgXu+05Ikqr4h4V+w5i2zJy37nAqtkQKufs3+3S2fDq6JNRrHMIQhB/Vaex+jgAAw==" + }, "sigmund": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz", @@ -17508,6 +17513,15 @@ "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.1.tgz", "integrity": "sha512-ER5moSbLZuNSMBFnEBVGhQ1uCBNJslH9W/Dw2W7GZN23UQA69uapP5GTT9Vm8Trc0PzBSVt6LzF3hGjmv41xcg==" }, + "vuex-persistedstate": { + "version": "2.5.4", + "resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-2.5.4.tgz", + "integrity": "sha512-XYJhKIwO+ZVlTaXyxKxnplrJ88Fnvk5aDw753bxzRw5/yMKLQ6lq9CDCBex2fwZaQcLibhtgJOxGCHjy9GLSlQ==", + "requires": { + "deepmerge": "^2.1.0", + "shvl": "^1.3.0" + } + }, "w3c-hr-time": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.1.tgz", diff --git a/package.json b/package.json index 5214a521..dab6c2d5 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "vue-router": "^3.0.3", "vuelidate": "^0.7.4", "vuex": "^3.0.1", + "vuex-persistedstate": "^2.5.4", "whatwg-fetch": "^3.0.0" }, "devDependencies": { diff --git a/src/auth.js b/src/auth.js index 78f2c0fc..435b3129 100644 --- a/src/auth.js +++ b/src/auth.js @@ -2,48 +2,29 @@ import SdkAuth, { TokenProvider } from '@commercetools/sdk-auth'; import store from './store'; import config from '../sunrise.config'; -const tokenInfoStorageName = 'token'; -const isAuthenticatedStorageName = 'auth'; -let storedTokenInfo; - -try { - storedTokenInfo = JSON.parse(localStorage.getItem(tokenInfoStorageName)); - const isAuthenticated = localStorage.getItem(isAuthenticatedStorageName); - if (storedTokenInfo && isAuthenticated) { - store.dispatch('setAuthenticated', true); - } -} catch (error) { - // eslint-disable-next-line no-console - console.error('Could not retrieve token from local storage', error); -} - const tokenProvider = new TokenProvider({ sdkAuth: new SdkAuth(config.ct.auth), fetchTokenInfo: sdkAuth => sdkAuth.anonymousFlow(), - onTokenInfoChanged: tokenInfo => localStorage.setItem(tokenInfoStorageName, JSON.stringify(tokenInfo)), -}, storedTokenInfo); + onTokenInfoChanged: tokenInfo => store.dispatch('setTokenInfo', tokenInfo), +}, store.state.tokenInfo); export function cleanUpSession() { tokenProvider.invalidateTokenInfo(); - localStorage.removeItem(tokenInfoStorageName); - localStorage.removeItem(isAuthenticatedStorageName); - return store.dispatch('setAuthenticated', false); + return store.dispatch('clearAuthentication'); } export function clientLogin(apolloClient, credentials) { - localStorage.removeItem(tokenInfoStorageName); - tokenProvider.fetchTokenInfo = sdkAuth => sdkAuth.customerPasswordFlow(credentials); - tokenProvider.invalidateTokenInfo(); - return apolloClient.resetStore() - .then(() => { - localStorage.setItem(isAuthenticatedStorageName, true); - return store.dispatch('setAuthenticated', true); - }) - .catch((error) => { - // eslint-disable-next-line no-console - console.error('Error on cache reset during login', error); - return cleanUpSession(); - }); + return store.dispatch('clearAuthentication').then(() => { + tokenProvider.fetchTokenInfo = sdkAuth => sdkAuth.customerPasswordFlow(credentials); + tokenProvider.invalidateTokenInfo(); + return apolloClient.resetStore() + .then(() => store.dispatch('setAuthenticated', true)) + .catch((error) => { + // eslint-disable-next-line no-console + console.error('Error on cache reset during login', error); + return cleanUpSession(); + }); + }); } export function clientLogout(apolloClient, redirect) { diff --git a/src/components/cartdetail/PageCartDetail.vue b/src/components/cartdetail/PageCartDetail.vue index d25a5ac3..1ff49ff3 100644 --- a/src/components/cartdetail/PageCartDetail.vue +++ b/src/components/cartdetail/PageCartDetail.vue @@ -144,7 +144,7 @@ export default { ${DisplayableMoneyFragment}`, variables() { return { - locale: this.$i18n.locale, + locale: this.$store.state.locale, }; }, }, diff --git a/src/components/common/Breadcrumb.vue b/src/components/common/Breadcrumb.vue index ec004843..08ffac7c 100644 --- a/src/components/common/Breadcrumb.vue +++ b/src/components/common/Breadcrumb.vue @@ -61,8 +61,8 @@ export default { }`, variables() { return { - locale: this.$i18n.locale, - where: `slug(${this.$i18n.locale}="${this.categorySlug}")`, + locale: this.$store.state.locale, + where: `slug(${this.$store.state.locale}="${this.categorySlug}")`, }; }, skip: vm => !vm.categorySlug, diff --git a/src/components/common/ProductThumbnail.vue b/src/components/common/ProductThumbnail.vue index 38fd7ffb..3a8f0d2b 100644 --- a/src/components/common/ProductThumbnail.vue +++ b/src/components/common/ProductThumbnail.vue @@ -86,15 +86,10 @@ diff --git a/src/components/header/CategoriesMenu.vue b/src/components/header/CategoriesMenu.vue index f271d528..f5580a69 100644 --- a/src/components/header/CategoriesMenu.vue +++ b/src/components/header/CategoriesMenu.vue @@ -117,7 +117,7 @@ export default { }`, variables() { return { - locale: this.$i18n.locale, + locale: this.$store.state.locale, }; }, }, diff --git a/src/components/header/LocationSelector.vue b/src/components/header/LocationSelector.vue index 71a84fb7..1d3882b7 100644 --- a/src/components/header/LocationSelector.vue +++ b/src/components/header/LocationSelector.vue @@ -1,28 +1,29 @@