How can i convert buffer to img url in react

Good day
i'm new with react and i have an endpoint that returns image as buffer and text, but i'm having issue converting that buffer to img url and displaying it, below is my code snippet
<div className={newsStyle.container}>
<ul >
{newsItem.map((news) => {
const Base64string = btoa(
String.fromCharCode(... new Uint8Array(news?.img?.data?.data))
);
<li key={news._id}>
<div className={newsStyle.index}>
<img src={data: image/png; base64, ${Base64string}`} />

{news.title}

                    </div>


                </li>
            })}
        </ul>

    </div>

`
now the issue is with the curly bracket in the map function, nothing is rendered, but when i remove the curly it render value, but i wont b able to declare a variable
can anyone help out

Comments

[Andrew Bone]

It doesn't look like you're returning anything from the map.

export function SomeThing({ array }) {

  return (
    <div>
      {array.map((item) => {
        const value = `${item} - default`;

        return <input defaultValue={value} />
      })}
    </div>
  )
}

Map makes a new array based on what the function inside it returns.

[OlaNeat Ayoola]

tnks