When a user successfully signs out from the application, we want to clear the stored JWT credentials from sessionStorage. This can be accomplished by calling the clearJWT method, which is defined in the following code.

mern-skeleton/client/auth/auth-helper.js:

clearJWT(cb) {
      if(typeof window !== "undefined")
        sessionStorage.removeItem('jwt')
      cb()
      signout().then((data) => {
          document.cookie = "t=; expires=Thu, 01 Jan 1970 00:00:00 
          UTC; path=/;"
      })
}

This clearJWT method takes a callback function as an argument, and it removes the JWT credential from sessionStorage. The passed in cb() function allows the component initiating the signout functionality to dictate what should happen after a successful sign-out. 

The clearJWT method also uses the signout method we defined earlier in api-auth.js to call the signout API in the backend. If we had used cookies to store the credentials instead of sessionStorage, the response to this API call would be where we clear the cookie, as shown in the preceding code. Using the signout API call is optional since this is dependent on whether cookies are used as the credential storage mechanism.

With these three methods, we now have ways of storing, retrieving, and deleting JWT credentials on the client-side. Using these methods, the React components we build for the frontend will be able to check and manage user auth state to restrict access in the frontend, as demonstrated in the following section with the custom PrivateRoute component.