Rearrange array of objects by date

Question

I receive from the API all active and completed tasks. I want to adapt this object to use SectionList (React-Native), using each date field (dataCadastro) to separate by day . For example https://reactnative.dev/docs/sectionlist

{
  active: [
    {
      id: 1,
      dataCadastro: '2020-06-15T14:33:45.4807609+00:00',
      status: 1,
      description: '',

    },
    {
      id: 2,
      dataCadastro: '2020-06-15T15:33:45.4807609+00:00',
      status: 1,
      description: '',

    },
  ],
  completed: [
    {
      id: 3,
      dataCadastro: '2020-05-19T14:33:45.4807609+00:00',
      status: 1,
      description: '',

    },
    {
      id: 4,
      dataCadastro: '2020-05-19T15:33:45.4807609+00:00',
      status: 1,
      description: '',

    }
  ]
}

A result like this would be great:

const dataTest = [
    {
      title: '2020-06-15', // All tasks for the 15th of June.
      data: [
        {
          id: 1,
          dataCadastro: '2020-06-15T14:33:45.4807609+00:00',
          status: 1,
          description: '',

        },
       {
          id: 2,
          dataCadastro: '2020-06-15T15:33:45.4807609+00:00',
          status: 1,
          description: '',

        }
      ],
    }, {...}  
  ];

Answer 1

The first thing to do is merge all of the data together.

const allTasks = data.active.concat(data.completed);

Then you need to aggregate them by date.

const dataObject = allTasks.reduce((dataObject, task) => {
    const date = new Date(task.dataCadastro.toLocaleDateString());

    if (!dataObject[date]) dataObject[date] = { title: date, data: [] };
    dataObject[date].data.push[task];
    return dataObject;
}, {});

Then you need to convert the data object into an array and sort it by date.

const data = Object.values(dataObject).sort((a, b) => a.title - b.title);

Answer 2

If your data inside active or completed are of same type then you can use just map it by taking entries:

 var obj = { active: [ { id: 1, dataCadastro: '2020-06-15T14:33:45.4807609+00:00', status: 1, description: '', }, { id: 2, dataCadastro: '2020-06-15T15:33:45.4807609+00:00', status: 1, description: '', }, ], completed: [ { id: 3, dataCadastro: '2020-05-19T14:33:45.4807609+00:00', status: 1, description: '', }, { id: 4, dataCadastro: '2020-05-19T15:33:45.4807609+00:00', status: 1, description: '', } ]}; var result = Object.entries(obj).map(([_,data])=>({title: data[0].dataCadastro, data })); console.log(result);

Otherwise you can go for reduce :

 var obj = { active: [ { id: 1, dataCadastro: '2020-06-15T14:33:45.4807609+00:00', status: 1, description: '', }, { id: 2, dataCadastro: '2020-06-15T15:33:45.4807609+00:00', status: 1, description: '', }, ], completed: [ { id: 3, dataCadastro: '2020-05-19T14:33:45.4807609+00:00', status: 1, description: '', }, { id: 4, dataCadastro: '2020-05-19T15:33:45.4807609+00:00', status: 1, description: '', } ]}; var result = Object.entries(obj).reduce((acc, [_, data])=>{ data.forEach(elem=>{ title = elem.dataCadastro.slice(0,10) acc[title] = acc[title] || {title, data:[]}; acc[title].data.push(elem); }); return acc; },{}); console.log(Object.values(result));