How to display a binary image on img tag in reactjs

I am fetching the data from a mongoDB and recieving the avatar as a binary (console.log(avatar) >> '�PNGIHDR��jpHYs')

How can i show this in an img tag in ReactJs

I tried to use this function to convert the binary to base64 and push 'data:image/jpg;base64,' at the beginning and add it to the src attribute, but also failed

```    const hexToBase64 = hex => {
```        return btoa(
```            String.fromCharCode.apply(
```                null,
```                hex
```                    .replace(/\r|\n/g, '')
```                    .replace(/([\da-fA-F]{2}) ?/g, '0x$1 ')
```                    .replace(/ +$/, '')
```                    .split(' ')
```            )
```        );
```    };