React array map inside map value not rendering

I have an object Array list and this array list includes duplicate values. So I need to render only unique values. But it’s not working.

{promotions.map((row) => (
  <div>
    <h1>{row.name}</h1>  //This is working
    {row.products.map(() => {
      const pp = row.products.filter( (ele, ind) => ind === row.products.findIndex( elem => elem.productId === ele.productId))

      pp.map((data)=>{
        return(
          <Chip
            key={`${row.productId}_${data.productId}`}
            classes={{ root: classes.productsChipRoot }}
            label={data.productName}
            style={{ margin: 3, backgroundColor: '#BBD7FB' }}
          /> 
        )
      })
    })}
  </div>
))}

>Solution :

In Render, Map works for just outter map. So, the Inner map is not render. You should not use the inner map.

I recommend using filter method. Like this

row.products.filter(condition).map(()=>{
return
)