Bacancy Technology

Bacancy Technology represents the connected world, offering innovative and customer-centric information technology experiences, enabling Enterprises, Associates and the Society to Rise™.

12+

Countries where we have happy customers

1050+

Agile enabled employees

World wide offices

12+

Years of Experience

Agile Coaches

Certified Scrum Masters

1000+

Clients projects

1458

Happy customers

ReactJS

October 9, 2023

Manage Unauthorized User Behavior

To handle unauthorized user behavior and clear the previous Auth0 state, you can follow these steps:

1. We have to define private routes in Routes file

<PrivateRoute path="/dashboard" component={Dashboard} />

2. Create a PrivateRoute component that checks whether the user is authenticated using useAuth0() hook.

import { Route } from 'react-router-dom';
import { useAuth0 } from '@auth0/auth0-react';

const PrivateRoute = ({ component: Component, ...rest }) => {
  const { isAuthenticated } = useAuth0();

  return isAuthenticated ? (
    <Route {...rest} render={(props) => <Component {...props} />} />
  ) : (
    <Login />
  );
};

export default PrivateRoute;

with these steps, when an unauthorized user tries to access the /dashboard route, they will be redirected to the login page (/login). If the user is authorized, they will be granted access to the dashboard.