Data transform if projectId match children and projectId grouped

Question

I need to group all the projectIds together and If the projectId is the same, the children should be together in the current item. Refer to the below picture for the expected final result.

Appreciate if anyone can help me on this. I'm trying to learn on the go while building functionality of an app. Thank you.

Current Json Format:

[
  {
    "projectIds": "1aa",
    "children": [
      {
        "email": "alyssayo@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "raa",
          "baa",
          "caa"
        ],
        "projectIds": "1aa"
      }
    ]
  },
  {
    "projectIds": "3aa",
    "children": [
      {
        "email": "alyssayo@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "raa",
          "baa",
          "caa"
        ],
        "projectIds": "3aa"
      }
    ]
  },
  {
    "projectIds": "1aa",
    "children": [
      {
        "email": "chiuewww@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "baa",
          "caa"
        ],
        "projectIds": "1aa"
      }
    ]
  },
  {
    "projectIds": "2aa",
    "children": [
      {
        "email": "chiuewww@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "baa",
          "caa"
        ],
        "projectIds": "2aa"
      }
    ]
  },
  {
    "projectIds": "3aa",
    "children": [
      {
        "email": "chiuewww@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "baa",
          "caa"
        ],
        "projectIds": "3aa"
      }
    ]
  },
  {
    "projectIds": "1aa",
    "children": [
      {
        "email": "lalaqq@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "caa"
        ],
        "projectIds": "1aa"
      }
    ]
  }
]

Expected Json Format:

const data = [
  {
    projectIds: "1aa",
    children: [
      {
        email: "alyssayo@xxx.com",
        permissionIds: null,
        roleIds: ["raa","baa","caa"],
        projectIds: "1aa",
      },
      {
        email: "chiuewww@xxx.com",
        permissionIds: null,
        roleIds: ["baa","caa"],
        projectIds: "1aa",
      },
      {
        email: "lalaqq@xxx.com",
        permissionIds: null,
        roleIds: ["caa"],
        projectIds: "1aa",
      }
    ]
  },
  {
    projectIds: "2aa",
    children: [
      {
        email: "chiuewww@xxx.com",
        permissionIds: null,
        roleIds: ["baa","caa"],
        projectIds: "2aa",
      }
    ]
  },
  {
    projectIds: "3aa",
    children: [
      {
        email: "alyssayo@xxx.com",
        permissionIds: null,
        roleIds: ["raa","baa","caa"],
        projectIds: "3aa",
      },    
      {
        email: "chiuewww@xxx.com",
        permissionIds: null,
        roleIds: ["baa","caa"],
        projectIds: "3aa",
      }
    ]
  }
];

Answer 1

u can use array reduce and array find,

 const data = [ { "projectIds": "1aa", "children": [ { "email": "alyssayo@xxx.com", "permissionIds": null, "roleIds": [ "raa", "baa", "caa" ], "projectIds": "1aa" } ] }, { "projectIds": "3aa", "children": [ { "email": "alyssayo@xxx.com", "permissionIds": null, "roleIds": [ "raa", "baa", "caa" ], "projectIds": "3aa" } ] }, { "projectIds": "1aa", "children": [ { "email": "chiuewww@xxx.com", "permissionIds": null, "roleIds": [ "baa", "caa" ], "projectIds": "1aa" } ] }, { "projectIds": "2aa", "children": [ { "email": "chiuewww@xxx.com", "permissionIds": null, "roleIds": [ "baa", "caa" ], "projectIds": "2aa" } ] }, { "projectIds": "3aa", "children": [ { "email": "chiuewww@xxx.com", "permissionIds": null, "roleIds": [ "baa", "caa" ], "projectIds": "3aa" } ] }, { "projectIds": "1aa", "children": [ { "email": "lalaqq@xxx.com", "permissionIds": null, "roleIds": [ "caa" ], "projectIds": "1aa" } ] } ] const findMatch = (arr, projectIds) => arr.find(item => item.projectIds === projectIds) const grouppingArray = (originalArr) => { return Array.isArray(originalArr)? originalArr.reduce((previousObj, obj) => { if (findMatch(previousObj, obj.projectIds)) { findMatch(previousObj, obj.projectIds).children.push(...obj.children) } else { previousObj.push(obj) } return previousObj }, []): 'Need an array' } console.log(grouppingArray(data))

Answer 2

You can try array.reduce() where initialData is your current data

const data = initialData.reduce(function (r, a) {
        r[a.projectIds] = r[a.projectIds] || [];
        r[a.projectIds].push(a);
        return r;
    }, Object.create(null));