You need to go from expression syntax to the block syntax, using braces and return:
data.map((item) => {
const propertyName = item.productName;
return (<div className="flex-container card" key={item._id}>
<div className="content">
<p>{propertyName}</p>
</div>
</div>)
})
However, you could also use destructuring to get your propertyName, and then you are back to one expression:
data.map(({productName, _id}) =>
<div className="flex-container card" key={_id}>
<div className="content">
<p>{propertyName}</p>
</div>
</div>
)