i have created 2 diferent collections one for users another one for Usertasks in my database. The structure is Usertasks( Collection)- >userid (document)->documents (collection)->taskId(document)->the task date string, name id and status (collection ) I am attaching a picture for better understanding

The thing is i need to create "{items} " in order to be able to render it in the agenda events, items are like this

Object {
  "2017-05-20": Array [
    Object {
      "name": "Meetin Juan",
    },

This is what i have in my database

Array [
  Object {
    "dateString": "2017-04-27",
    "id": "1638540202073 }",
    "name": "Jajajajaaaaa",
    "status": false,
  },

So i pass this function to my db data to get what i need;

transform =() => {
  //console.log("porfavor",(data))
  let item ={}

  const itemList = []
  data.forEach(element => {
    item={
      [element.dateString]:{
      id : element.id,
      name : element.name,
      status : element.status
    }
  }
  itemList.push(item)
});
console.log("this is the itemlist ",itemList)

setItemList(itemList)

}

And thats what i get but i dont think is right as i get errors when i say const items=props.itemList and nothing is displayed just too many renders error

Array [
  Object {
    "2017-04-27": Object {
    "id": "1638540202073 }",
    "name": "Jajajajaaaaa",
    "status": false,
  },
},

How can i do it?