Routing

Adminto React is having routing setup based on React-Router v6.

You can easily add, change or remove any route by simply making changes described below:

  1. Open src/routes/index.tsx file, declare your component. E.g.

    const Dashboard1 = React.lazy(() => import('./views/dashboards/Dashboard1'));.

  2. And make sure to add the entry for same with path and element in constants routes declared there. E.g.

    { path: 'dashboard', element: <LoadComponent component={Dashboard1} />},

    Each of these properties are explained below:

    • path - Url relative path
    • element - Lazily load component with actual component name which would get rendered when user visits the path
      • If you want to restrict the non authenticated and unauthorized users to access particular path, specify element as PrivateRoute. The children of PrivateRoute will be restricted.

        If you specify PrivateRoute, the application would check if the user is already authenticated or not and also validate if the user is having required role assigned to it, in order to access the specified path. In order to specify which roles are allowed, you can specify them using roles property.

Optionally, you might want to add the menu entry in respective layout menu component.