Group by Id and create an array from the grouped data

Question

In my angular application, i am getting the response as follows.

[{
    "proposalId": "cc0bcd90-fc75-4c73-bd66-799b37330fb5",
    "proposalGpId": "cc0bcd90-fc75-4c73-bd66-799b37380fb5",
    "eventId": "17e69ea1-54da-11e7-9469-985aebe2005e",
    "listingId": "pdf19f7e1-5f2b-4d02-a48d-3b6d0189b5d1",
    "status": "Approved"
}, {
    "proposalId": "cc0bcd90-fc75-4c73-bd66-799b373306b5",
    "proposalGpId": "cc0bcd90-fc75-4c73-bd66-799b37380fb5",
    "eventId": "17e69ea1-54da-11e7-9469-985aebe2005e",
    "listingId": "pdf19f7e1-5f2b-4d02-a48d-3b6d0189b5d1",
    "status": "Approved"
}]

i have two classes on the application as,

ProposalGroup.ts

export class ProposalGroup {
    eventId: string;
    proposalGpId: string;
    proposals: Proposal[];
}

Proposal.ts

export class Proposal {
    proposalId: string;
    listingId: Date;
    eventId: Price;
    status: string;
}

I need to create an array of ProposalGroups out of the above JSON, when to proposals have the same listingId It should be grouped.

I want to generate an output as follows,

[{
    "eventId": "17e69ea1-54da-11e7-9469-985aebe2005e",
    "proposals": [{
        "proposalId": "cc0bcd90-fc75-4c73-bd66-799b37330fb5",
        "proposalGpId": "cc0bcd90-fc75-4c73-bd66-799b37380fb5",
        "eventId": "17e69ea1-54da-11e7-9469-985aebe2005e",
        "listingId": "pdf19f7e1-5f2b-4d02-a48d-3b6d0189b5d1",
        "status": "approved"
    }, {
        "proposalId": "cc0bcd90-fc75-4c73-bd66-799b373306b5",
        "proposalGpId": "cc0bcd90-fc75-4c73-bd66-799b37380fb5",
        "eventId": "17e69ea1-54da-11e7-9469-985aebe2005e",
        "listingId": "pdf19f7e1-5f2b-4d02-a48d-3b6d0189b5d1",
        "status": "approved"
    }]
}]

this is what i have tried using lodash,

const grouped = _.groupBy(this.proposals, (proposal: Proposal) => proposal.listingId);

but the above gives a dictionary.

Answer 1

Group and then map the groups to a new array:

const proposals = [{"proposalId":"cc0bcd90-fc75-4c73-bd66-799b37330fb5","proposalGpId":"cc0bcd90-fc75-4c73-bd66-799b37380fb5","eventId":"17e69ea1-54da-11e7-9469-985aebe2005e","listingId":"pdf19f7e1-5f2b-4d02-a48d-3b6d0189b5d1","status":"Approved"},{"proposalId":"cc0bcd90-fc75-4c73-bd66-799b373306b5","proposalGpId":"cc0bcd90-fc75-4c73-bd66-799b37380fb5","eventId":"17e69ea1-54da-11e7-9469-985aebe2005e","listingId":"pdf19f7e1-5f2b-4d02-a48d-3b6d0189b5d1","status":"Approved"}];

const result = _(proposals)
  .groupBy('listingId') // group by listingId
  .map((proposals, listingId) => (({
    eventId: proposals[0].eventId, // omit this if you don't want the eventId
    listingId, // omit it if you don't want the listingId
    proposals
  })))
  .value();
  
console.log(result);

.as-console-wrapper { max-height: 100%!important; top: 0; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>