Radzenie sobie z zagnieżdżonymi Obiektami JS / React / TypeJS

Cześć :)

Jestem dość początkujący na froncie, mam nastepujący problem, mianowicie pobieram z API coś takiego:

const extrass: number[] = [168,167];
const popularExtras: any[] = extrass.map((x)=> Object.values(res.menu.dealsCategories
.find((one: any) => one.id === x).products)
.sort((a: any, b: any) => b.priority - a.priority));

Produkty są zwracane prawidłowo, tyle, że są zagnieżdżone w dwóch podobiektach. Potrzebuję nauczyć się albo pisać jakoś innaczej zapynie, albo wyciagnąć z OBJECT produkty i dodać je do nowej listy? Pomoże ktoś?

Tu jak widać rezustat jest podzielony na 2 grupki, a ja chcę aby wszystkie produkty były w głównej tablicy, a nie osobnych podtablicach

No to masz jeszcze możliwość skorzystania z reduce na tablicach. Jako initial value podajesz pustą tablicę, a jako wynik - concat akumulatora i obecnej wartości.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce

Najprościej:

const mergedArr = myArr.flat()

Nie możesz grzebnąć w backendzie i dostosować dane na serwerze już w taki sposób, żebyś nie musiał tego robić w przeglądarce?