my component isn't shown with React mapping

Question

I'm trying to render posts that come from my database, the data is printed as an array in the console.log(post) but the post component doesn't render.

Code:

{posts && posts.map((post, key) => {
   {console.log(post)}
   <ConnectPost postDetails={post} key={key} />
})}

Data Array example:

{
    "post_id": 3,
    "user_id": 1,
    "placed_by": "youtuber",
    "link": "https://www.youtube.com/c/MrBeast6000",
    "game_id": null,
    "game_name": null,
    "requirements": "{\"minimum game size\": 1000}"
}

Answer 1

Try to add return :

{posts && posts.map((post, key) => {
   {console.log(post)}
  return <ConnectPost postDetails={post} key={key} />
})}