React - conditional (ternary) operator

Question

//Syntax
condition ? exprIfTrue : exprIfFalse

//Example
var age = 26;
var beverage = (age >= 21) ? "Beer" : "Juice";
console.log(beverage); // "Beer"

<div className="col-md-3">
  {ColumnSideData.agent.agent_pic ? (
    <img
      className="agent-img"
      src={ColumnSideData.agent.agent_pic}
      onError={e => {
        e.target.src = '/static/images/avatar.png';
      }}
    />
  ) : (
    <span className="badge agent-avatar">{agentName}</span>
  )}
</div>

 

Answer 1

const defenderSale =
  defenderProperties.defenderType === '110' ||
  defenderProperties.defenderType === 'd90'
    ? true
    : false;

 

Answer 2

{listingBeds === 0 ? <>Studio</> : <>{listingBeds} beds</>}

{beds === 0 ? <>Studio</> : <>{beds} beds</>}

 

Answer 3

<Link href={listurlObj} as={listingUrl}>
    <a
      target={
        isBlue || isRed || isYellow || isGreen ? '_blank' : '_self'
      }
      className="text-decoration-none"
    >

 

Answer 4

{isShortlist === 0 ? (
  <img src="/static/images/icons/fav.svg" alt="shortlist" />
) : (
  <img
    src="/static/images/icons/fav-active.svg"
    alt="shortlist"
  />
)}

 

Answer 5

{(listingItemData.field_exclusive_i === 1 ||
  listingItemData.featured_id_i) && (
  <div className="item-exclusive d-block d-md-none">
    {listingItemData.featured_id_i ? (
      <div className="featured">MUST SEE</div>
    ) : (
      <div className="exclusive">LC Only</div>
    )}
  </div>
)}