Manipulate date inside react-table

Question

I was wondering if there is any way to manipulate a date returned from an API inside the react-table component?

For example, the timestamp comes back from the API formatted as such 2019-08-31 06:27:14 ... What I would like it to look like is something like Monday 8th of August 2005 03:12:46 PM

I am using the react-table component to render the table and the column i would like to manipulate is the Signup Date column.

Any help would be greatly appreciated.

columns={[
    {
        Header: "ID",
        accessor: "id",
        show: false
    },
    {
        Header: "Signup Date",
        accessor: "signup_date"
    }
]}

Answer 1

You can modify it like this:

columns : {[
    {
        Header:"Signup Date",
        accessor:"signup_date",
        //this is the func your looking for, it can retuen custom tableCell
        Cell : (props)=>{
            //props.value will contain your date
            //you can convert your date here
            const custom_date = 'custom_date'+props.value
            return <span>{custom_date}</span>
        }
    }
]}

As another solution, it might be a good idea to wrap your table inside a parent container that delivers modified data to table. sth like this:
container.js

componentDidMount(){
    const {data} = this.props;
    let tableData = []
    for(let me in data){
        let object = {
            //select and modify data from incoming server data
            date : 'fake date'
        }
        tableData.push(object)
    }
    this.setState({
        data : tableData
    })
}
render(){
    return(
        <React-Table
           //...settings
           data = {this.state.data}
        />
    )
}

hope this helps.