feature: ✨ check token expire before render login button

src/webui/src/components/Header/index.js

@@ -67,13 +67,35 @@ export default class Header extends React.Component {
     }
   }
 
+  get isTokenExpire () {
+    let token = storage.getItem('token');
+    if (!_.isString(token)) return true;
+    let payload = token.split('.')[1];
+    if (!payload) return true;
+    try {
+      payload = JSON.parse(atob(payload));
+    } catch (err) {
+      console.error('Invalid token:', err, token); // eslint-disable-line
+      return false;
+    }
+    if (!payload.exp || !_.isNumber(payload.exp)) return true;
+    let jsTimestamp = (payload.exp * 1000) - 30000; // Report as expire before (real expire time - 30s)
+
+    let expired = Date.now() >= jsTimestamp;
+    if (expired) {
+      storage.clear();
+    }
+
+    return expired;
+  }
+
   handleLogout () {
     storage.clear();
     location.reload();
   }
 
   renderUserActionButton () {
-    if (storage.getItem('username')) { // TODO: Check jwt token expire
+    if (!this.isTokenExpire) { // TODO: Check jwt token expire
       return (
         <div className={classes.welcome}>
           Hi, {storage.getItem('username')}