How can I create routes depending on user type?

I'm building web application which has 3 types of users.

1. Guest User
2. Registered User
3. Admin / Super User

When User logged in I'm setting localstorage with usertype:

Both User and Super user have different login pages. If user logged in then

localstorage.setItem("type", "user");

And if Super user logged in then

localstorage.setItem("type", "admin");

Now based on that how can I set routes? If user logged in than can have access to user routes only and same for super user.

//Core UI Theme routes.

I have created userroutes.js and adminroutes.js

Common route.js

import React from 'react';

const Home = React.lazy(() => import('./views/Home/Home'));
const About = React.lazy(() => import('./views/About/About'));

const routes = [
{ path: '/', exact: true, name: 'Home', component: Home },
{ path: '/about-us', exact: true, name: 'About-Us', component: 
About}
];

export default routes;

userroute.js and adminroute.js have different routes.

Here what tries

<Suspense fallback={this.loading()}>
                        <Switch>
                            {this.state.type === "user" ? userroutes.map((route, idx) => {
                                return userroutes.component ? (
                                    <Route
                                        key={idx}
                                        path={route.path}
                                        exact={route.exact}
                                        name={route.name}
                                        render={props => (
                                            <route.component {...props} />
                                        )} />
                                ) : (null);
                            }) : ""}
                            {/* <Redirect from="/" to="/dashboard" /> */}
                        </Switch>
                    </Suspense>

Will it works? Or there is better solution for that?