Getting unique key error even I put the key all components - reactjs

Question

I put the key prop to parent component but it gives unique key error. Even I put the key props to every element still getting this error. How can I fix this problem?
{orders &&
orders.slice(0).reverse().map((order) =>
order.order_type === 'PickupOrders' &&
<Row key={uuidv4()} align="middle" style={{ height: '6vh', borderBottom: '1px solid #e6ebe7' }} justify="center" >
<Col span={9} key={uuidv4()} >
<p key={uuidv4()} style={{ marginBottom: 'auto', marginTop: 'auto' , textAlign:'center'}}>{order.customer_fullname}</p>
</Col>
<Col span={9} key={uuidv4()}>
<p key={uuidv4()} style={{ marginBottom: 'auto', marginTop: 'auto' , textAlign:'center'}} >{order.order_status}</p>
</Col>
<Col span={6} key={uuidv4()}>
<p key={uuidv4()} style={{ marginBottom: 'auto', marginTop: 'auto' , textAlign:'center'}} >{order.total_price}</p>
</Col>
</Row>
)}
{counter > 0 &&
_.times( counter , (i) => (
<div style={{ height: '6vh', borderBottom: '1px solid #e6ebe7' }} >
<Dropdown
key={uuidv4()}
overlay={menu( PickUpOrder(orders, counter - i), openModalFunc)}
placement='bottomCenter'
trigger={['click']}
>
<IconButton
color='primary'
aria-label='add an alarm'
>
<MoreVertIcon />
</IconButton>
</Dropdown>
</div>
))
}

Answer 1

The first part looks fine. When you map or _.times in order to iterate arrays or array of objects, key attribute should be in top tag. In your case;
_.times( counter , (i) => (
<div style={{ height: '6vh', borderBottom: '1px solid #e6ebe7' }} key={uuidv4()}> {/* <---- */}
<Dropdown
overlay={menu( PickUpOrder(orders, counter - i), openModalFunc)}
placement='bottomCenter'
trigger={['click']}
> ...
I hope it works fine.