Create complex array from array in React

{
                           "chartOptions": {
                                "type": "line",
                                "isStacked": false, 
                                "minValue": 0,
                                "maxValue": 600000, 
                                "filled": false,
                                "showAxis": true,
                            "chartLabels":[
                                "May 23",
                                "May 24",
                                "May 25",
                                "May 26",
                                "May 27",
                                "May 28"
                            ],
                            "chartDatasets": [
                                {
                                    "label": "Mentions",
                                    "backgroundColor": "rgb(81, 45, 168)",
                                    "stack": "Stack 0",
                                    "data": [
                                        1100,
                                        800,
                                        750,
                                        1200,
                                        400,
                                        600
                                    ]
                                }
                            ]
                        },

Thats the original array I have from backend and now I want to build something like this:

const data = { labels: ['May 23', 'May 24', 'May 25', 'May 26', 'May 27', 'May 28'], datasets: [{ label: 'Mentions', borderDash: [5, 3], data: [6500, 5900, 8000, 8100, 5600, 10000] }] }

So the chartDatasets will be datasets and the chartLabels will be labels.. I think this is pretty easy but I don’t know how I can do it.

I’m saving the original array in state so..

Thanks

Answer

If you have to modify single time you can simply assign in object like this:

const data = {
                           "chartOptions": {
                                "type": "line",
                                "isStacked": false, 
                                "minValue": 0,
                                "maxValue": 600000, 
                                "filled": false,
                                "showAxis": true,
                                },
                            "chartLabels":[
                                "May 23",
                                "May 24",
                                "May 25",
                                "May 26",
                                "May 27",
                                "May 28"
                            ],
                            "chartDatasets": [
                                {
                                    "label": "Mentions",
                                    "backgroundColor": "rgb(81, 45, 168)",
                                    "stack": "Stack 0",
                                    "data": [
                                        1100,
                                        800,
                                        750,
                                        1200,
                                        400,
                                        600
                                    ]
                                }
                            ]
                        }
                        
const modifiedData = {
labels:data.chartLabels,
datasets:data.chartDatasets,
}
console.log(modifiedData)

updated according to your requirement adding extra key in data set.

const data = {
                               "chartOptions": {
                                    "type": "line",
                                    "isStacked": false, 
                                    "minValue": 0,
                                    "maxValue": 600000, 
                                    "filled": false,
                                    "showAxis": true,
                                    },
                                "chartLabels":[
                                    "May 23",
                                    "May 24",
                                    "May 25",
                                    "May 26",
                                    "May 27",
                                    "May 28"
                                ],
                                "chartDatasets": [
                                    {
                                        "label": "Mentions",
                                        "backgroundColor": "rgb(81, 45, 168)",
                                        "stack": "Stack 0",
                                        "data": [
                                            1100,
                                            800,
                                            750,
                                            1200,
                                            400,
                                            600
                                        ]
                                    }
                                ]
                            }
                            
    const modifiedData = {
    labels:data.chartLabels,
    datasets:data.chartDatasets.map(set => ({...set, yAxisID:"bar-y-axis"})),
    }
    console.log(modifiedData)