Protected Route Using React Router Dom

index.js

const PrivateRoute = ({ component: Component, ...args }) => {
// user is the authenticated user pulled from the React Context
  const { user } = useContext(AuthContext);
  return (
    <Route
      {...args}
      render={props => {
        return user ? (
          <Component {...props} />
        ) : (
          <Redirect
            to={{
              pathname: "/login",
              state: {
                from: props.location,
              },
            }}
          />
        );
      }}
    />
  );
};
function Login(props) {
  const { user } = useContext(AuthContext);
  const { from } = props.location.state || { from: { pathname: "/" } };
  if (user) {
    return <Redirect to={from} />;
  }
  return (
    <React.Fragment>
      <Form
        props={props}
        authMessage={props.location.state && "You need to login first"}
      />
    </React.Fragment>
  );
}