const IS_LOGGED_IN = true;

const PrivatRoute = ({ component: Component = React.Fragment, hasPermission }) => {
  return <>{IS_LOGGED_IN && hasPermission ? <Component /> : <></>}</>;
};

const Dashboard = () => <h2>Can be accessed if user is logged in </h2>;

const Profile = () => <h2>Can't be accessed, as user does not have required permissions </h2>;

const Application = () => {
  return (
    <>
      <PrivatRoute component={Dashboard} hasPermission />
      {/*Profile Route won't be rendered as hasPermission prop is set to false.
Try updating it to true, if want to see the component
*/}
      <PrivatRoute component={Profile} hasPermission={false} />
    </>
  );
};
/*
 * Render the above component into the div#app
 */
ReactDOM.render(<Application />, document.getElementById('app'));