Branch.js

Branch.js

// @flow
import type { Children } from 'react';
import Hidden from 'components/Hidden';

const renderNoop = () => null;

type Props = {
  condition: any,
  persistent?: boolean,
  renderLeft: () => Children,
  renderRight?: () => Children,
};

const defaultProps = {
  persistent: false,
  renderRight: renderNoop,
};

const Branch = (props: Props) => {
  if (props.persistence) {
    if (props.condition) {
      return (
        <>
          {props.renderLeft()}
           <Hidden>{props.renderRight()}</Hidden>
        </>
      );
    }
    return (
      <>
        <Hidden>{props.renderLeft()}</Hidden>
        {props.renderRight()}
      </>
    );
  }
  return props.condition ? props.renderLeft() : props.renderRight()
};

Branch.defaultProps = defaultProps;

export default Branch;