authProtected value resetting on page reload

Question

I am using a class to keep track of authentication of routes. On login, the authProtected is toggled. But when I refresh the page, it toggles again and logs me out. How do I stop it from changing?

class Auth {
  constructor() {
    this.authProtected = true;
  }

  login() {
    this.authProtected = false;
  }

  isAuthProtected() {
    return this.authProtected;
  }
}

export default new Auth();

The log in function is being used in my log in component and the isAuthProtected() is used as a condition in my routes file to allow access to redirect too login