fixed User tokens

app/containers/App/index.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 import { Helmet } from 'react-helmet';
 import { Switch, Redirect } from 'react-router-dom';
 
@@ -28,14 +28,12 @@ const RedirectToDashboard = () => (
 
 const App = () => {
   const token = getItem(AUTH_TOKEN);
-  const [user, setUser] = useState({});
-
-  useEffect(() => {
+  let initialUser = {};
   if (token) {
     const { userId, userName, userRole, customerId } = parseJwt(token.access_token);
-      setUser({ id: userId, email: userName, role: userRole, customerId });
+    initialUser = { id: userId, email: userName, role: userRole, customerId };
   }
-  }, []);
+  const [user, setUser] = useState(initialUser);
 
   const updateToken = newToken => {
     setItem(AUTH_TOKEN, newToken);

app/index.js

@@ -11,7 +11,7 @@ import 'styles/index.scss';
 import App from 'containers/App';
 import { AUTH_TOKEN } from 'constants/index';
 
-import { getItem, setItem } from 'utils/localStorage';
+import { getItem, setItem, removeItem } from 'utils/localStorage';
 
 const API_URI = process.env.NODE_ENV !== 'production' ? 'http://localhost:4000/' : '';
 const MOUNT_NODE = document.getElementById('root');
@@ -41,6 +41,7 @@ const client = new ApolloClient({
       graphQLErrors.forEach(err => {
         // handle errors differently based on its error code
         switch (err.extensions.code) {
+          case 'FORBIDDEN':
           case 'UNAUTHENTICATED':
             operation.setContext({
               headers: {
@@ -59,6 +60,11 @@ const client = new ApolloClient({
               },
             });
             return forward(operation);
+          case 'INTERNAL_SERVER_ERROR':
+            if (err.path && err.path[0] === 'updateToken') {
+              removeItem(AUTH_TOKEN);
+            }
+            return forward(operation);
           default:
             return forward(operation);
         }