Discussion on: Are you giving the proper sense to React.Fragment?

[Andy Nicholson]

Your final code reads very well, that’s to be commended.

I don’t agree that the solution to every React problem is more components, though. Writing a ListManager component seems like massive overkill and poor naming: what you're describing is more like a ListItemManager - and what is a ListItemManager if not, well, a List?

Naming an empty list is great, but you don’t need a component for that either! You could do just as well by interpolating a const instead, saving yourself a function call:

function List(props) {  
  const items = props.items;
  const emptyList = <React.Fragment />;
  const hasItems = items && items.length > 0;

  return hasItems
  ?  <ul>{ items.map(i => <li key={i}>{i}</li>) }</ul>
  : emptyList
  ;
}

React is awesome, but moar components aren’t always the answer.