Less logic in JSX resulting in code that's easier to read and transpiled to a simpler and more compact block of code

logic-in-jsx-improved.js

render () {
  const { visible } = this.props
  let visibleContent
  if (visible) {
    visibleContent = this.getVisibleContent()
  }

  return (
    <div className={ visible ? 'expanded' : 'collapsed' }>
      { visibleContent } // No more logic here and useless "null"
    </div>
  )

  getVisibleContent () {
    return ( <div>
      // Dozens of lines of JSX code here
    </div> )
  }
}