Merge pull request #4015 from c2corg/fix-3892

fix: #3892, immediate needed to properly have token set on load

src/js/vue-plugins/user.js

@@ -9,31 +9,46 @@ export default function install(Vue) {
     data() {
       const data = this.$localStorage.get(config.urls.api, {});
 
-      return {
-        // The unique name, used to login
-        userName: data['userName'] ?? null,
-
-        // unique numerical ID
-        id: data['id'] ?? null,
-
-        // user lang, read write property everywhere : this.$user.lang
-        lang: data['lang'] ?? this.$language.current,
-
-        // list of roles
-        roles: data['roles'] ?? [],
-
-        // public name, a simple label
-        name: data['name'] ?? null,
-
-        // forum name
-        forumUsername: data['forumUsername'] ?? null,
-
-        // private token used for API auth
-        token: data['token'] ?? null,
-
-        // token expiration date
-        expire: data['expire'] ?? null,
-      };
+      // token expiration date
+      const expire = data['expire'] ?? null;
+      // The unique name, used to login
+      const userName = data['userName'] ?? null;
+      // unique numerical ID
+      const id = data['id'] ?? null;
+      // user lang, read write property everywhere : this.$user.lang
+      const lang = data['lang'] ?? this.$language.current;
+      // list of roles
+      const roles = data['roles'] ?? [];
+      // public name, a simple label
+      const name = data['name'] ?? null;
+      // forum name
+      const forumUsername = data['forumUsername'] ?? null;
+      // private token used for API auth
+      const token = data['token'] ?? null;
+
+      const expired = this.checkExpiration(expire, token);
+
+      return expired
+        ? {
+            userName: null,
+            id: null,
+            lang,
+            roles: [],
+            name: null,
+            forumUsername: null,
+            token: null,
+            expire: null,
+          }
+        : {
+            userName,
+            id,
+            lang,
+            roles,
+            name,
+            forumUsername,
+            token,
+            expire,
+          };
     },
 
     computed: {
@@ -48,11 +63,12 @@ export default function install(Vue) {
     watch: {
       token: {
         handler: 'updateToken',
+        immediate: true,
       },
     },
 
     created() {
-      this.checkExpiration();
+      this.commitToLocaleStorage_();
     },
 
     methods: {
@@ -72,22 +88,12 @@ export default function install(Vue) {
         });
       },
 
-      signout() {
+      signout(token) {
         // we have an expired token in local storage, so we don't want to use that token
         // for the API calls (we would go into https://github.com/c2corg/v6_api/issues/730 instead
         // of doing unauthentified requests).
         // We still want to make the logout call which needs a (potentially expired) token
-        c2c.userProfile.logout(this.token);
-
-        this.token = null;
-        this.roles = [];
-        this.id = null;
-        this.userName = null;
-        this.name = null;
-        this.forumUsername = null;
-        this.expire = null;
-
-        this.commitToLocaleStorage_();
+        c2c.userProfile.logout(token);
       },
 
       updateAccount(currentpassword, name, forum_username, email, is_profile_public, newpassword) {
@@ -118,16 +124,15 @@ export default function install(Vue) {
         this.$localStorage.set(config.urls.api, this.$data);
       },
 
-      checkExpiration() {
-        if (!this.expire) {
+      checkExpiration(expire, token) {
+        if (!expire) {
           return true;
         }
 
         const now = Date.now() / 1000; // in seconds
-        const expire = this.expire;
 
         if (now > expire) {
-          this.signout();
+          this.signout(token);
           return true;
         }