From eddcdd17552d237bf197059c9e28b27662165055 Mon Sep 17 00:00:00 2001
From: Andreas Zweili <andreas@2li.ch>
Date: Thu, 29 Jul 2021 18:06:59 +0200
Subject: [PATCH] add an auto logout

---
 src/App.vue                         | 12 +++++++++
 src/store/modules/auth/actions.js   | 40 ++++++++++++++++++++++++-----
 src/store/modules/auth/getters.js   |  3 +++
 src/store/modules/auth/index.js     |  2 +-
 src/store/modules/auth/mutations.js |  5 +++-
 5 files changed, 54 insertions(+), 8 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index b37294c..1a41bba 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -14,8 +14,20 @@ export default {
   components: {
     TheHeader
   },
+  computed: {
+    didAutoLogout() {
+      return this.$store.getters.didAutoLogout;
+    }
+  },
   created() {
     this.$store.dispatch('tryLogin');
+  },
+  watch: {
+    didAutoLogout(curValue, oldValue) {
+      if (curValue && curValue !== oldValue) {
+        this.$router.replace('/coaches');
+      }
+    }
   }
 };
 </script>
diff --git a/src/store/modules/auth/actions.js b/src/store/modules/auth/actions.js
index f16c920..7dde61c 100644
--- a/src/store/modules/auth/actions.js
+++ b/src/store/modules/auth/actions.js
@@ -1,5 +1,7 @@
 import getAuth from '../../../scripts/axios-auth';
 
+let timer;
+
 export default {
   async login(context, payload) {
     return context.dispatch('auth', {
@@ -27,13 +29,20 @@ export default {
       });
       const responseData = response.data;
 
+      const expiresIn = +responseData.expiresIn * 1000;
+      const expirationDate = new Date().getTime() + expiresIn;
+
       localStorage.setItem('token', responseData.idToken);
       localStorage.setItem('userId', responseData.localId);
+      localStorage.setItem('tokenExpiration', expirationDate);
+
+      timer = setTimeout(function() {
+        context.dispatch('autoLogout');
+      }, expiresIn);
 
       context.commit('setUser', {
         token: responseData.idToken,
-        userId: responseData.localId,
-        tokenExpiration: responseData.expiresIn
+        userId: responseData.localId
       });
     } catch (err) {
       const error = new Error(err.message);
@@ -43,20 +52,39 @@ export default {
   tryLogin(context) {
     const token = localStorage.getItem('token');
     const userId = localStorage.getItem('userId');
+    const tokenExpiration = localStorage.getItem('tokenExpiration');
+
+    const expiresIn = +tokenExpiration - new Date().getTime();
+
+    if (expiresIn < 0) {
+      return;
+    }
+
+    setTimeout(function() {
+      context.dispatch('autoLogout');
+    }, expiresIn);
 
     if (token && userId) {
       context.commit('setUser', {
         token: token,
-        userId: userId,
-        tokenExpiration: null
+        userId: userId
       });
     }
   },
   logout(context) {
+    localStorage.removeItem('token');
+    localStorage.removeItem('userId');
+    localStorage.removeItem('tokenExpiration');
+
+    clearTimeout(timer);
+
     context.commit('setUser', {
       token: null,
-      userId: null,
-      tokenExpiration: null
+      userId: null
     });
+  },
+  autoLogout(context) {
+    context.dispatch('logout');
+    context.commit('setAutoLogout');
   }
 };
diff --git a/src/store/modules/auth/getters.js b/src/store/modules/auth/getters.js
index 69c9026..3befccd 100644
--- a/src/store/modules/auth/getters.js
+++ b/src/store/modules/auth/getters.js
@@ -7,5 +7,8 @@ export default {
   },
   isAuthenticated(state) {
     return !!state.token;
+  },
+  didAutoLogout(state) {
+    return state.didAutoLogout;
   }
 };
diff --git a/src/store/modules/auth/index.js b/src/store/modules/auth/index.js
index 189f352..bcd7cd7 100644
--- a/src/store/modules/auth/index.js
+++ b/src/store/modules/auth/index.js
@@ -7,7 +7,7 @@ export default {
     return {
       userId: null,
       token: null,
-      tokenExpiration: null
+      didAutoLogout: false
     };
   },
   actions,
diff --git a/src/store/modules/auth/mutations.js b/src/store/modules/auth/mutations.js
index aa49a8e..2bad42e 100644
--- a/src/store/modules/auth/mutations.js
+++ b/src/store/modules/auth/mutations.js
@@ -2,6 +2,9 @@ export default {
   setUser(state, payload) {
     state.token = payload.token;
     state.userId = payload.userId;
-    state.tokenExpiration = payload.tokenExpiration;
+    state.didAutoLogout = false;
+  },
+  setAutoLogout(state) {
+    state.didAutoLogout = true;
   }
 };