Как преобразовать данные?
 

Ребята, подскажите, пожалуйста, как преобразовать данные.
Исходные данные:

const widgets = [
    {
        type: "Title",
        data: {
            title: "title1",
            subTitle: "subTitle1"
        }
    },
    {
        type: "Title",
        data: {
            title: "title2",
            subTitle: "subTitle2"
        }
    },
    {
        type: "Title",
        data: {
            title: "title3",
            subTitle: "subTitle3"
        }
    },
    {
        type: "New",
        data: {
            title: "new title1",
            subTitle: "new subTitle1"
        }
    },
    {
        type: "New",
        data: {
            title: "new title2",
            subTitle: "new subTitle2"
        }
    },
    {
        type: "NewTitle",
        data: {
            title: "NewTitle title1",
            subTitle: "NewTitle subTitle1"
        }
    },
]

Данные которые необходимо получить (объединение одинаковых типов в массив):

const widgetsTransform = [
    {
        type: "SectionTitle",
        children: [
            {
                type: "Title",
                data: {
                    title: "title1",
                    subTitle: "subTitle1"
                }
            },
            {
                type: "Title",
                data: {
                    title: "title2",
                    subTitle: "subTitle2"
                }
            },
            {
                type: "Title",
                data: {
                    title: "title3",
                    subTitle: "subTitle3"
                }
            }
        ]
    },
    {
        type: "SectionNew",
        children: [
            {
                type: "New",
                data: {
                    title: "new title1",
                    subTitle: "new subTitle1"
                }
            },
            {
                type: "New",
                data: {
                    title: "new title2",
                    subTitle: "new subTitle2"
                }
            }
        ]
    },
    {
        type: "NewTitle",
        data: {
            title: "NewTitle title1",
            subTitle: "NewTitle subTitle1"
        }
    },
]

gsdev99,
как формируется SectionTitle SectionNew NewTitle?

gsdev99,
пока неизвестно, как формируется новое type, вариант такой

const widgets = [
    {
        type: "Title",
        data: {
            title: "title1",
            subTitle: "subTitle1"
        }
    },
    {
        type: "Title",
        data: {
            title: "title2",
            subTitle: "subTitle2"
        }
    },
    {
        type: "Title",
        data: {
            title: "title3",
            subTitle: "subTitle3"
        }
    },
    {
        type: "New",
        data: {
            title: "new title1",
            subTitle: "new subTitle1"
        }
    },
    {
        type: "New",
        data: {
            title: "new title2",
            subTitle: "new subTitle2"
        }
    },
    {
        type: "NewTitle",
        data: {
            title: "NewTitle title1",
            subTitle: "NewTitle subTitle1"
        }
    },
];

const create = arr => {
    const map = new Map;
    arr.forEach(o => {
        let {type, data} = o;
        //type = "Section" + type;
        if(map.has(type)) map.get(type).children.push(data);
        else map.set(type, {type, children : [data]})
    })
    return [...map.values()]
};
const widgetsTransform = create(widgets)
console.log(widgetsTransform)

Спасибо. А если у меня задача преобразовать не все типы, а только определенные. Т.е., что я имею в виду.
В моем примере, я говорю, для типов Title и New, преобразование необходимо с сохранением своего расположения, как в исходном массиве, а остальные типы остаются с такой же структурой и в том же месте.
Исходный массив

const widgets = [
    {
        type: "Title",
        data: {
            title: "title1",
            subTitle: "subTitle1"
        }
    },
    {
        type: "Title",
        data: {
            title: "title2",
            subTitle: "subTitle2"
        }
    },
    {
        type: "Title",
        data: {
            title: "title3",
            subTitle: "subTitle3"
        }
    },
    {
        type: "TitleTwo",
        data: {
            title: "TitleTwo title",
            subTitle: "TitleTwo subTitle"
        }
    },
    {
        type: "TitleTwo",
        data: {
            title: "TitleTwo title",
            subTitle: "TitleTwo subTitle"
        }
    },
    {
        type: "New",
        data: {
            title: "new title1",
            subTitle: "new subTitle1"
        }
    },
    {
        type: "New",
        data: {
            title: "new title2",
            subTitle: "new subTitle2"
        }
    },
    {
        type: "NewTitle",
        data: {
            title: "NewTitle title1",
            subTitle: "NewTitle subTitle1"
        }
    },
    {
        type: "NewTitleTwo",
        data: {
            title: "NewTitleTwo title",
            subTitle: "NewTitleTwo subTitle"
        }
    }
]

Новое состояние:

const widgetsTransform = [
    {
        type: "SectionTitle",
        children: [
            {
                type: "Title",
                data: {
                    title: "title1",
                    subTitle: "subTitle1"
                }
            },
            {
                type: "Title",
                data: {
                    title: "title2",
                    subTitle: "subTitle2"
                }
            },
            {
                type: "Title",
                data: {
                    title: "title3",
                    subTitle: "subTitle3"
                }
            }
        ]
    },
    {
        type: "TitleTwo",
        data: {
            title: "TitleTwo title",
            subTitle: "TitleTwo subTitle"
        }
    },
    {
        type: "TitleTwo",
        data: {
            title: "TitleTwo title",
            subTitle: "TitleTwo subTitle"
        }
    },
    {
        type: "SectionNew",
        children: [
            {
                type: "New",
                data: {
                    title: "new title1",
                    subTitle: "new subTitle1"
                }
            },
            {
                type: "New",
                data: {
                    title: "new title2",
                    subTitle: "new subTitle2"
                }
            }
        ]
    },
    {
        type: "NewTitle",
        data: {
            title: "NewTitle title1",
            subTitle: "NewTitle subTitle1"
        }
    },
    {
        type: "NewTitleTwo",
        data: {
            title: "NewTitleTwo title",
            subTitle: "NewTitleTwo subTitle"
        }
    }
]

gsdev99,

<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">


</head>
<body>
<pre></pre>
<script>
const widgets = [
    {
        type: "Title",
        data: {
            title: "title1",
            subTitle: "subTitle1"
        }
    },
    {
        type: "Title",
        data: {
            title: "title2",
            subTitle: "subTitle2"
        }
    },
    {
        type: "Title",
        data: {
            title: "title3",
            subTitle: "subTitle3"
        }
    },
    {
        type: "TitleTwo",
        data: {
            title: "TitleTwo title",
            subTitle: "TitleTwo subTitle"
        }
    },
    {
        type: "TitleTwo",
        data: {
            title: "TitleTwo title",
            subTitle: "TitleTwo subTitle"
        }
    },
    {
        type: "New",
        data: {
            title: "new title1",
            subTitle: "new subTitle1"
        }
    },
    {
        type: "New",
        data: {
            title: "new title2",
            subTitle: "new subTitle2"
        }
    },
    {
        type: "NewTitle",
        data: {
            title: "NewTitle title1",
            subTitle: "NewTitle subTitle1"
        }
    },
    {
        type: "NewTitleTwo",
        data: {
            title: "NewTitleTwo title",
            subTitle: "NewTitleTwo subTitle"
        }
    }
];


const create = (arr, arrType) => {
    const map = new Map, newArr = [];
    arr.forEach(o => {
        let {type, data} = o;
        if(arrType.includes(type)) {
        type = `Section${type}`;
        if(map.has(type)) map.get(type).push(data);
        else {
        const children = [data];
        map.set(type, children);
        newArr.push({type, children})
        }
        }
        else newArr.push(o)
    })
    return newArr
};
const widgetsTransform = create(widgets, ["Title", "New"]);
document.querySelector("pre").append(JSON.stringify(widgetsTransform, "", 4));
console.log(widgetsTransform)
  </script>
</body>
</html>

Рони, большое тебе человеческое спасибо.