Fixed broken login redirection when 401 (again)

front/src/components/auth/Login.vue

@@ -52,7 +52,7 @@ import PasswordInput from "@/components/forms/PasswordInput"
 
 export default {
   props: {
-    next: { type: String, default: "/" }
+    next: { type: String, default: "/library" }
   },
   components: {
     PasswordInput
@@ -69,6 +69,11 @@ export default {
       isLoading: false
     }
   },
+  created () {
+    if (this.$store.state.auth.authenticated) {
+      this.$router.push(this.next)
+    }
+  },
   mounted() {
     this.$refs.username.focus()
   },
@@ -91,10 +96,11 @@ export default {
         username: this.credentials.username,
         password: this.credentials.password
       }
+      console.log('NEXT', this.next)
       this.$store
         .dispatch("auth/login", {
           credentials,
-          next: "/library",
+          next: this.next,
           onError: error => {
             if (error.response.status === 400) {
               self.error = "invalid_credentials"

front/src/components/favorites/List.vue

@@ -101,6 +101,9 @@ export default {
     }
   },
   created() {
+    if (!this.$store.state.auth.authenticated) {
+      this.$router.push({name: 'login', query: {next: this.$router.currentRoute.fullPath}})
+    }
     this.fetchFavorites(FAVORITES_URL)
   },
   mounted() {

front/src/main.js

@@ -97,7 +97,7 @@ axios.interceptors.response.use(function (response) {
   error.backendErrors = []
   if (error.response.status === 401) {
     store.commit('auth/authenticated', false)
-    logger.default.warn('Received 401 response from API, redirecting to login form')
+    logger.default.warn('Received 401 response from API, redirecting to login form', router.currentRoute.fullPath)
     router.push({name: 'login', query: {next: router.currentRoute.fullPath}})
   }
   if (error.response.status === 404) {

front/src/store/auth.js

@@ -75,9 +75,10 @@ export default {
       return axios.post('token/', credentials).then(response => {
         logger.default.info('Successfully logged in as', credentials.username)
         commit('token', response.data.token)
-        dispatch('fetchProfile')
-        // Redirect to a specified route
-        router.push(next)
+        dispatch('fetchProfile').then(() => {
+          // Redirect to a specified route
+          router.push(next)
+        })
       }, response => {
         logger.default.error('Error while logging in', response.data)
         onError(response)
@@ -116,27 +117,34 @@ export default {
         document.cookie = 'sessionid=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'
       }
 
-      return axios.get('users/users/me/').then((response) => {
-        logger.default.info('Successfully fetched user profile')
-        dispatch('updateProfile', response.data)
-        dispatch('ui/fetchUnreadNotifications', null, { root: true })
-        dispatch('favorites/fetch', null, { root: true })
-        dispatch('playlists/fetchOwn', null, { root: true })
-        return response.data
-      }, (response) => {
-        logger.default.info('Error while fetching user profile')
+      return new Promise((resolve, reject) => {
+        axios.get('users/users/me/').then((response) => {
+          logger.default.info('Successfully fetched user profile')
+          dispatch('updateProfile', response.data).then(() => {
+            resolve(response.data)
+          })
+          dispatch('ui/fetchUnreadNotifications', null, { root: true })
+          dispatch('favorites/fetch', null, { root: true })
+          dispatch('playlists/fetchOwn', null, { root: true })
+        }, (response) => {
+          logger.default.info('Error while fetching user profile')
+          reject()
+        })
       })
     },
     updateProfile({ commit }, data) {
-      commit("authenticated", true)
-      commit("profile", data)
-      commit("username", data.username)
-      Object.keys(data.permissions).forEach(function(key) {
-        // this makes it easier to check for permissions in templates
-        commit("permission", {
-          key,
-          status: data.permissions[String(key)]
+      return new Promise((resolve, reject) => {
+        commit("authenticated", true)
+        commit("profile", data)
+        commit("username", data.username)
+        Object.keys(data.permissions).forEach(function(key) {
+          // this makes it easier to check for permissions in templates
+          commit("permission", {
+            key,
+            status: data.permissions[String(key)]
+          })
         })
+        resolve()
       })
     },
     refreshToken ({commit, dispatch, state}) {