Render resolved or rejected value of Promise in ReactJS

So, I've got this function fetchData() that returns a promise which is either rejected or resolved. How can i Call fetchData and if promise resolves, render it on the page, Display loading text while promise is not fulfilled yet and If promise is rejected, display custom text on page?how can i do that?

function fetchData() {    return new Promise((resolve, reject) => {        const time = Math.random() * 1000;        setTimeout(() => {            if (Math.random() > 0.5) {                resolve(`resolved`);            } else {                reject(new Error("error"));            }        }, time);    });}