How can I map and group array data by datatype?

I have an array of data I’m pulling into a React application –

const knowledgeData = [
  {
    id: 'connect',
    catTitle: 'Connectivity',
    subTitle:'Very Slow - Loader Stays on',
    subData:'<><p>Lorem Ipsum Solar denar.</p><p>lorem imsum again.</p></>'

  },
  {
    id: '`cms`',
    catTitle: 'CMS ISSUES',
    subTitle:'UNABLE TO LOG IN',
    subData:'<><p>Lorem Ipsum Solar denar.</p><p>lorem imsum again.</p></>'

  },
  {
    id: '`cms`',
    catTitle: 'CMS ISSUES',
    subTitle:'UNABLE TO PRINT REPORT',
    subData:'<><p>Lorem Ipsum Solar denar.</p><p>lorem imsum again.</p></>'

  },
  {
    id: '`cms`',
    catTitle: 'CMS ISSUES',
    subTitle:'Unable To Covert a PDF',
    subData:'<><p>Lorem Ipsum Solar denar.</p><p>lorem imsum again.</p></>'

  },
  {
    id: 'app',
    catTitle: 'Staff App Issues',
    subTitle:'Unable to access photos',
    subData:'<><p>Lorem Ipsum Solar denar.</p><p>lorem imsum again.</p></>'

  },
];

The data is used for a staff wiki – I need to display the data in a grouped arrangement – grouped by ID as each data group is separated in the design into its own grid – so for example all CMS related issues are grouped under the title CMS ISSUES etc.

I’ve got as far as a map statement and I’m stumped with an approach to solve the issue –

returnFields = () =>{
  
    this.state.knowledgeData.map((data,i) => {
     //for each datatype:(
        //return(
          //HTML containing mapped data here with group title wrap

          
     
    }); 
}

Can anyone please suggest a good solution here?

>Solution :

Are you getting the results you want?

const result = knowledgeData.reduce((acc, cur) => {
  acc[cur.id] = [...(acc[cur.id] || []), cur];

  return acc;
}, {});