Auth

The Auth.js file is a global singleton which manages user authentication for the application. Upon loading or refreshing the page, the Auth component check to see if the user has already been authenticated before. If they have, the Auth component attempts to refresh their session token and, if the token is successfully refreshed, allows the user into the application with a new token. If the user does not already have a token or the session token is expired, the Auth component will not allow the user to access any page other than the login screen. The user can then login to their account from the login screen, which prompts the Auth component to send an authentication request to the server using the user's credentials.

Because the Auth component is a global singleton, it's state and values are preserved throught the whole application, allowing different components to check if the user is logged in before displaying themselves. This is especially useful for items in the NavBar, where additional buttons are displayed when the user is logged in but are hidden when they log out. In order to check if the user is authenticated from any other component, the following code should be used

Checking User Authentication

import Auth from "Auth.js"
if(Auth.isAuthenticated()){

}

Accessing the user's username (phone number)

import Auth from "Auth.js"
Auth.username // The user's username (phone number)