Typescript - Create object based on another

Question

I have the following object (this is the service response):

let contentArray = {
   "errorMessages":[
      
   ],
   "output":[
      {
         "id":1,
         "excecuteDate":"2022-02-04T13:34:20"
      },
      {
         "id":2,
         "excecuteDate":"2022-02-04T12:04:20"
      },
      {
         "id":3,
         "excecuteDate":"2022-02-01T11:23:34"
      },
      {
         "id":4,
         "excecuteDate":"2022-01-14T10:30:54"
      },
      {
         "id":5,
         "excecuteDate":"2021-11-03T10:20:43"
      }
   ]
}

Based on the previous object I have to create the following:

{
   "2021":{
      "11-November":{
         "03/11/2021":[
            "10:20:43"
         ]
      }
   },
   "2022":{
      "01_January":{
         "14/01/2022":[
            "10:30:54"
         ]
      },
      "02_February":{
         "01/02/2022":[
            "11:23:34"
         ],
         "04/02/2022":[
            "12:04:20", "13:34:20"
         ]
      }
   }
}

To be able to paint something like this on the screen:

I updated the question to be more specific. Based on the above, I have this code:

        let dateExecutionValue: Date;
        let i: number = 0;
        let tree = {};
        while (i < this.contentArray.length) {
            dateExecutionValue = new Date(this.contentArray[i].excecuteDate);
            let year = dateExecutionValue.getFullYear();
            tree[year] = {};
            let auxYear = year;
            while (auxYear === year && i < this.contentArray.length) {
                let month = dateExecutionValue.getMonth() + 1;
                // here, now under the year property of the object, I want to create another month property (for each month associated with that year)
                i++;
            }    
        }

How could I do it? thanks,

Answer 1

1. Iterate through the response
2. Apply some logic to transform returned value into a date and push into new property
3. Insert into html / DOM Manipulation