Why is this an issue?

JSX fragments is a feature that allows you to group multiple elements together without adding an extra DOM element. They are a way to return multiple elements from a component’s render method without requiring a wrapping parent element.

However, a fragment is redundant if it contains only one child, or if it is the child of an HTML element.

<>;    // Noncompliant: The fragment has only one child

<>foo

; // Noncompliant: The fragment is the child of the HTML element 'p'

You can safely remove the redundant fragment while preserving the original behaviour.

;

foo

;

Resources

Documentation