Реагировать - Как реализовать страницу входа (макет) в моем приложении?

Question

Я должен добавить страницу входа в свое приложение React.

Я уже сделал все, но теперь мне нужно скрыть все страницы, пока я не вошел в систему, но я не могу рефакторинг моего кода для этого (первый раз).

Это мой индекс. js

import React from "react";
import ReactDOM from "react-dom";
import {createBrowserHistory} from "history";
import {Router, Route, Switch, Redirect} from "react-router-dom";

...
import AdminLayout from "layouts/Admin.jsx";

const hist = createBrowserHistory();

ReactDOM.render(
    <Router history={hist}>
        <Switch>
            <Route path="/admin" render={props => <AdminLayout {...props} />}/>
            <Redirect to="/admin/dashboard"/>
        </Switch>
    </Router>,
    document.getElementById("root")
);

Это Admin.jsx

import dashRoutes from "../routes.js";

var ps;

class Dashboard extends React.Component {

    state = {
        ----
    };

    mainPanel = React.createRef();

    componentDidMount() {
        if (navigator.platform.indexOf("Win") > -1) {
            ps = new PerfectScrollbar(this.mainPanel.current);
            document.body.classList.toggle("perfect-scrollbar-on");
        }
    }

    componentWillUnmount() {
        if (navigator.platform.indexOf("Win") > -1) {
            ps.destroy();
            document.body.classList.toggle("perfect-scrollbar-on");
        }
    }

    componentDidUpdate(e) {
        ----
    }

    render() {

        return (
            <div className="wrapper">
                <Sidebar
                    {...this.props}
                    routes={dashRoutes}
                    backgroundColor={this.state.backgroundColor}
                />
                <div className="main-panel" ref={this.mainPanel}>
                    <Navbar {...this.props} />
                    <Switch>
                        {dashRoutes.map((prop, key) => {
                            return (
                                <Route
                                    path={prop.layout + prop.path}
                                    component={prop.component}
                                    key={key}
                                />
                            );
                        })}
                        <Redirect from="/admin" to="/admin/dashboard"/>
                    </Switch>
                    <Footer fluid/>
                </div>
            </div>
        );
    }
}

export default Dashboard;

Здесь мои маршруты . js

let dashRoutes = [
    {
        path: "/dashboard",
        name: "Dashboard",
        icon: "media-2_sound-wave",
        component: Dashboard,
        layout: "/admin"
    },
    {
        path: "/promo_catalog",
        name: "Promo Catalog",
        icon: "shopping_shop",
        component: PROMOList,
        layout: "/admin"
    },
...

Я хотел бы знать, как реализовать маршрут в моем индексе. js