How to map object values in React?

Question

I have to map Date values by extracting the values from object. Following is the code for reference:

const [newDate, setNewDate] = useState([]);

Date.prototype.addDays = function (days) {
    var dat = new Date(this.valueOf());
    
    dat.setDate(dat.getDate() + days);

    return dat;
};

const getDates = (startDate, stopDate) => {
    var dateArray = new Array();
    var currentDate = startDate;

    while (currentDate <= stopDate) {
        dateArray.push(currentDate);
        currentDate = currentDate.addDays(1);
    }

    return dateArray
}

const dateArray2 = getDates(new Date(), new Date().addDays(30));

useEffect(() => {
    setNewDate(dateArray2)
}, [])

return (
    <>
        {console.log('Date', newDate)}
    </>
)

Here I get the data but I am unable to map it properly. Mapping in this manner gives the following error:

Objects are not valid as a React child (found: Fri Mar 12 2021 17:23:28 GMT+0200 (Eastern European Standard Time)). If you meant to render a collection of children, use an array instead.

newDate.map((data) => (
    <h3>{data}</h3>
))

What could be the best possible solution?

Following is the codesandbox link: https://codesandbox.io/s/material-demo-forked-nxhwg