The summary is, we cant use the if statement in JSX because that if statement will be written as a function parameter of React.createElement, and we cant do that. This is the same reason why we can't use the switch case and for statement inside JSX. Hopefully, my explanation will help you to understand why we can't write if statement in JSX

The only difference is it will use the ternary operator in the React.createElement last parameter. And, technically, we can use the ternary operator as a function parameter. So our code will work

The problem is that the if statement will be written to the React.createElement last parameter. And technically, we can't write if statement as a function parameter. So it break our code