List of user accounts in MySQL using the command line?

Question about PrivateRoutes and to get navigated back to login page

Petrov

Hi I need help getting my code to work so that when I try to log back in I won't be able to view the dashboard since I logged out. Right now its giving me a blank screen in my project and I think its because privateroute isn't a thing anymore? Not sure. This is my code in PrivateRoute.js:

import React, { Component } from 'react';
import { Route, Navigate } from 'react-router-dom';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';

const PrivateRoute = ({ component: Component, auth: { isAuthenticated, loading },
...rest }) => (
    <Route {...rest} render={props => !isAuthenticated && !loading ? (<Navigate to='/login' />) : (<Component {...props} />)} />
)


PrivateRoute.propTypes = {
  auth: PropTypes.object.isRequired
};

const mapStatetoProps = state => ({
    auth: state.auth
});

export default connect(mapStatetoProps)(PrivateRoute);

This is the code for the app.js:

import React, { Fragment, useEffect } from 'react';
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
import Navbar from './components/layout/Navbar';
import Landing from './components/layout/Landing';
import Register from './components/auth/Register';
import Login from './components/auth/Login';
import Alert from './components/layout/Alert';
import Dashboard from './components/dashboard/Dashboard';
import PrivateRoute from './components/routing/PrivateRoute';
// Redux
import { Provider } from 'react-redux';
import store from './store';
import { loadUser } from './actions/auth';
import setAuthToken from './utils/setAuthToken';

import './App.css';

if (localStorage.token) {
  setAuthToken(localStorage.token);
}

const App = () => { 
  useEffect(() => {
    store.dispatch(loadUser());
  }, []);

return (
  <Provider store={store}>
  <Router>
    <Fragment>
      <Navbar />
      <Routes>
      <Route exact path='/' element={<Landing/>} />
      </Routes>
      <section className="container">
        <Alert />
        <Routes>
          <Route exact path='/Register' element={<Register/>} />
          <Route exact path='/Login' element={<Login/>} />
          <PrivateRoute exact path='/dashboard' element={Dashboard} />
        </Routes>
      </section>
    </Fragment>
  </Router>
  </Provider>
)};

export default App;

Please Help!