Frontend: Handle logout using event

Signed-off-by: Michael Mayer <michael@liquidbytes.net>

frontend/src/common/api.js

@@ -41,7 +41,11 @@ Api.interceptors.response.use(function (response) {
         errorMessage = data.message ? data.message : data.error;
     }
 
-    Notify.error(errorMessage);
+    if (code === 401) {
+        Notify.logout(errorMessage);
+    } else {
+        Notify.error(errorMessage);
+    }
 
     return Promise.reject(error);
 });

frontend/src/common/notify.js

@@ -13,6 +13,10 @@ const Notify = {
     success: function (message) {
         Event.publish("notify.success", {msg: message});
     },
+    logout: function (message) {
+        Event.publish("notify.error", {msg: message});
+        Event.publish("session.logout");
+    },
     ajaxStart: function() {
         Event.publish("ajax.start");
     },

frontend/src/common/session.js

@@ -1,4 +1,5 @@
 import Api from "./api";
+import Event from "pubsub-js";
 import User from "../model/user";
 
 export default class Session {
@@ -22,6 +23,8 @@ export default class Session {
         if (this.isUser()) {
             this.auth = true;
         }
+
+        Event.subscribe('session.logout', this.onLogout.bind(this));
     }
 
     useSessionStorage() {
@@ -126,6 +129,11 @@ export default class Session {
         );
     }
 
+    onLogout() {
+        this.deleteToken();
+        window.location = "/";
+    }
+
     logout() {
         const token = this.getToken();
 

frontend/src/component/p-notify.vue

@@ -37,13 +37,13 @@
             };
         },
         created() {
-            this.subscriptionId = Event.subscribe('notify', this.eventHandler);
+            this.subscriptionId = Event.subscribe('notify', this.onNotify);
         },
         destroyed() {
             Event.unsubscribe(this.subscriptionId);
         },
         methods: {
-            eventHandler: function (ev, data) {
+            onNotify: function (ev, data) {
                 const type = ev.split('.')[1];
 
                 // get message from data object