[Recompose] Render Nothing in Place of a Component using Recompose

Learn how to use the ‘branch’ and ‘renderNothing’ higher-order
components to render nothing when a certain prop condition is
met. Sometimes you only want to render a component when valid
props exist or are in a certain condition; ‘renderNothing’ is
an easy way to completely remove the component when you don’t
need to show it.

 

const userIsNotActive = ({ status }) => status !== 'active';
const hideIfNotActive = branch(userIsNotActive, renderNothing);

const FeaturedUser = hideIfNotActive(({ name, status }) =>
  <div>
    <h3>Today's Featured User</h3>
    <User name={ name } status={ status } />
    <hr />
  </div>
);