[FIXED] How to display text only once per item iterated in React map

Issue

I am trying to display text only once per iteration block, but it keeps displaying depending on how many indexed there are iterated.

How can I explain only once?

This is my code:

someArr.map((col, i) => {
  return (
    <div
      key={i}
    >
      {text} // should be displayed only ONCE
      {someRule === someOtherRule && (
        <Icon/>
      )}
   </div>
 )
})

So what happens here is that Icon and all other items get displayed correctly, but {text} gets displayed depending on how many there are iterations. How can I display it only once, regardless of iteration count?

Solution

Check for the first index

  {i === 0 ? text: ''} 

Answered By - Sachila Ranawaka
Answer Checked By - - Katrina (ReactFix Volunteer)