I will definately be sad if I read this code in real life.

There is no difference between If-Else component and tenary operator essentially. Using abstraction to wrap it doesn't reduce the complexity of the application, rather increase it by introducing new component.

If tenary operator is ugly, you may want to avoid the condition by using guard clause like

```

{items.length === 0 && ...}

{items.length > 0 && ...}

```

or rather hide it in component (not suggested though)