jsx: ReactJS if condition

Question

How to use if condition in jsx: ReactJS? I just want that if the

if user == "author" or "supervisor":
<IconButton 
   aria-label="delete" 
   onClick={() => props.pressHandler(props.id)}
 >
  <DeleteIcon style={{ color: 'red' }} />
</IconButton>
else
     no delete button

Answer 1

Just put them in braces,

{ ["author", "supervisor"].includes(user) &&
<IconButton 
   aria-label="delete" 
   onClick={() => props.pressHandler(props.id)}
 >
  <DeleteIcon style={{ color: 'red' }} />
</IconButton> || null }

Reference: https://reactjs.org/docs/conditional-rendering.html#inline-if-with-logical--operator