index.js

import React from "react";
import {
  BrowserRouter as Router,
  Switch,
  Route,
  Link,
  useLocation,
  Redirect
} from "react-router-dom";
import Home from '../container/Home'
import Login from '../container/Login'
import Register from '../container/Register'
import Screen404 from '../container/Screen404'
import ForgotPassword from '../container/ForgotPassword'
import ResetPassword from '../container/ResetPassword'
import SetPassword from '../container/SetPassword'
import EmailVerification from "../container/EmailVerification";
import Constant from "../library/Constant";
import ShadowScreen from "../container/ShadowScreen";
// This site has 3 pages, all of which are rendered
// dynamically in the browser (not server rendered).
//
// Although the page does not ever refresh, notice how
// React Router keeps the URL up to date as you navigate
// through the site. This preserves the browser history,
// making sure things like the back button and bookmarks
// work properly.

export default function BasicExample() {
  
  return (
    <Router basename={process.env.REACT_APP_URL_MAIN_FE}>
      <Switch>
        <Route exact path="/">
          <Redirect
            to={{
              pathname: "/home/beranda",
              // state: { from: location }
            }}
          />
        </Route>
        <Route path="/login" component={Login}/>
          {/* <Login/>
        </PrivateRoute> */}
        <Route path="/forgot-password" component={ForgotPassword} />
        <Route path="/reset-password/:id" component={ResetPassword} />
        <Route path="/set-password/:id" component={SetPassword} />
        <Route path="/email-verification" component={EmailVerification} />
        <Route path="/register" component={Register}/>
        <Route path="/cronjob/:type" component={ShadowScreen}/>
        <PrivateRoute path="/home">
          <Home/>
        </PrivateRoute>
        <Route path="*">
          <Screen404 />
        </Route>
      </Switch>
    </Router>
  );
}

function PrivateRoute({ children, ...rest }) {
  // React.useEffect(() => {
  //   token()
  // })
  const logged = localStorage.getItem(Constant.TOKEN) !== null? true : false
  // const token = async() => {
  //   let a = await localStorage.getItem(Constant.TOKEN)
  //   alert(a)
  // }
  
  return (
    <Route
      {...rest}
      render={({ location }) =>
        logged ? (
          children
        ) : (
          <Redirect
            to={{
              pathname: "/login",
              state: { from: location }
            }}
          />
        )
      }
    />
  );
}