diff --git a/graphql/UserProfileQuery.js b/graphql/UserProfileQuery.js index 1848c82b9..2a283d0d4 100644 --- a/graphql/UserProfileQuery.js +++ b/graphql/UserProfileQuery.js @@ -7,6 +7,7 @@ export default gql(` name avatar about + locationName location { name } diff --git a/pages/profile/_slug.vue b/pages/profile/_slug.vue index fd6966dd8..670a4e81b 100644 --- a/pages/profile/_slug.vue +++ b/pages/profile/_slug.vue @@ -26,12 +26,12 @@ {{ user.name }} - {{ user.location[0].name }} + {{ user.location.name }} @@ -51,18 +50,16 @@ import { CancelToken } from 'axios' import find from 'lodash/find' let timeout -const mapboxToken = - 'pk.eyJ1IjoiaHVtYW4tY29ubmVjdGlvbiIsImEiOiJjajl0cnBubGoweTVlM3VwZ2lzNTNud3ZtIn0.KZ8KK9l70omjXbEkkbHGsQ' +const mapboxToken = process.env.MAPBOX_TOKEN export default { data() { return { axiosSource: null, cities: [], - city: null, form: { name: null, - locationId: null, + locationName: null, about: null } } @@ -78,7 +75,7 @@ export default { handler: function(user) { this.form = { name: user.name, - locationId: user.locationId, + locationName: user.locationName, about: user.about } } @@ -93,18 +90,18 @@ export default { mutation( $id: ID! $name: String - $locationId: String + $locationName: String $about: String ) { UpdateUser( id: $id name: $name - locationId: $locationId + locationName: $locationName about: $about ) { id name - locationId + locationName about } } @@ -113,14 +110,14 @@ export default { variables: { id: this.user.id, name: this.form.name, - locationId: this.form.locationId, + locationName: this.form.locationName, about: this.form.about }, // Update the cache with the result // The query will be updated with the optimistic response // and then with the real result of the mutation update: (store, { data: { UpdateUser } }) => { - this.$store.dispatch('auth/refresh', UpdateUser) + this.$store.dispatch('auth/fetchCurrentUser') // Read the data from our cache for this query. // const data = store.readQuery({ query: TAGS_QUERY }) @@ -154,15 +151,6 @@ export default { clearTimeout(timeout) timeout = setTimeout(() => this.requestGeoData(value), 500) }, - handleCitySelection(value) { - console.log('SET CURRENT VALUE', value) - const item = find(this.cities, { value: value }) - console.log('ID:', item.id) - this.form.locationId = item.id - }, - handleCityEnter() { - console.log('SET CURRENT VALUE') - }, processCityResults(res) { if ( !res || @@ -199,7 +187,7 @@ export default { this.$axios .get( - `https://api.mapbox.com/geocoding/v5/mapbox.places/${value}.json?access_token=${mapboxToken}&types=region,postcode,district,place,country&language=de`, + `https://api.mapbox.com/geocoding/v5/mapbox.places/${value}.json?access_token=${mapboxToken}&types=region,postcode,district,place,country&language=${this.$i18n.locale()}`, { cancelToken: this.axiosSource.token } diff --git a/store/auth.js b/store/auth.js index 40d6eef2e..956ba8f83 100644 --- a/store/auth.js +++ b/store/auth.js @@ -49,8 +49,8 @@ export const getters = { } export const actions = { - async init({ commit }) { - if (process.client) { + async init({ commit, dispatch }) { + if (!process.server) { return } const token = this.app.$apolloHelpers.getToken() @@ -58,20 +58,20 @@ export const actions = { return } - const user = await jwt.verify(token, 'b/&&7b78BF&fv/Vd') - if (user.id) { - commit('SET_USER', { - id: user.id, - name: user.name, - slug: user.slug, - email: user.email, - avatar: user.avatar, - role: user.role, - locationId: user.locationId, - about: user.about - }) - commit('SET_TOKEN', token) + const payload = await jwt.verify( + token, + process.server + ? require('dotenv').parse(require('fs').readFileSync('.env')).JWT_SECRET + : null + ) + if (!payload.id) { + return } + commit('SET_TOKEN', token) + commit('SET_USER', { + id: payload.id + }) + await dispatch('fetchCurrentUser') }, async check({ commit, dispatch, getters }) { if (!this.app.$apolloHelpers.getToken()) { @@ -79,20 +79,32 @@ export const actions = { } return getters.isLoggedIn }, - refresh({ state, commit }, { id, name, locationId, about, avatar }) { - if (!state.user.id || id !== state.user.id) { - return - } - commit('SET_USER', { - id: state.user.id, // do not change - name: name || state.user.name, - slug: state.user.slug, // do not change - email: state.user.email, // do not change - avatar: avatar || state.user.avatar, - role: state.user.role, - locationId: locationId || state.user.locationId, - about: about || state.user.about - }) + async fetchCurrentUser({ commit, getters }) { + await this.app.apolloProvider.defaultClient + .query({ + query: gql(` + query User($id: ID!) { + User(id: $id) { + id + name + slug + email + avatar + role + locationName + about + } + } + `), + variables: { id: getters.user.id } + }) + .then(({ data }) => { + const user = data.User.pop() + if (user.id && user.email) { + commit('SET_USER', user) + } + }) + return getters.user }, async login({ commit }, { email, password }) { commit('SET_PENDING', true) @@ -100,20 +112,20 @@ export const actions = { const res = await this.app.apolloProvider.defaultClient .mutate({ mutation: gql(` - mutation($email: String!, $password: String!) { - login(email: $email, password: $password) { - id - name - slug - email - avatar - role - locationId - about - token + mutation($email: String!, $password: String!) { + login(email: $email, password: $password) { + id + name + slug + email + avatar + role + locationName + about + token + } } - } - `), + `), variables: { email, password } }) .then(({ data }) => data && data.login)