HOC is an advanced technique for reusing component logic. It is a function that takes a component as a props and returns a new component.

const App = ()=> {

  const isLoggedIn = false;

  const HOC = ({ Authentication }) => {

    if (isLoggedIn) return <Authentication />;

    return <div>Please Login to continue</div>;

  };

  const Dashboard = () => {

    return(

    <div>Welcome User</div>

    )

  };

  return (

    <div className="App">

      <HOC Authentication={Dashboard} />

    </div>

  );

}

export default App;