Funkcja Map z JSON

Cześć.

Pracuje nad pewnym projektem w React i mam problem z odpowiednim zmapowaniem obiektu JSON, który dostaje z API. Chcę uzyskać tabelkę taką jak poniżej:

(https://drive.google.com/file/d/1l1D7xBsj51vJEDfVqRD0le9mg4VyMRXe/view?usp=sharing

a obiekt JSON wygląda tak:

{
    "userName": "user1",
    "memberCommunity": [
        {
            "userName": "user5",
            "community": [
                {
                    "level": 1,
                    "members": 3
                },
                {
                    "level": 2,
                    "members": 3
                },
                {
                    "level": 3,
                    "members": 1
                }
            ]
        },
        {
            "userName": "user18",
            "community": []
        },
        {
            "userName": "user2",
            "community": [
                {
                    "level": 1,
                    "members": 3
                },
                {
                    "level": 2,
                    "members": 4
                },
                {
                    "level": 3,
                    "members": 3
                },
                {
                    "level": 4,
                    "members": 6
                },
                {
                    "level": 5,
                    "members": 2
                },
                {
                    "level": 6,
                    "members": 1
                }
            ]
        }
    ]
}

Obraz tabelki został utworzony dokładnie na tych danych, które podałem. Problemem jest tu dla mnie odpowiednie użycie funkcji Map, dzięki której i uzyskam rekordy z trzema userami i dla każdego z nich odpowiednia wartość w polu level. Podejrzewam że, można to zrobić jakoś np. użyć map dla komponentu 1 a w nim użyć jeszcze komponent 2 dla którego zostanie przekazana druga tablica z levelami. Mam nadzieje, że nie namieszam i wiadomo o co chodzi :) Proszę o pomoc.

Jeżeli chodzi o nagłówki:

const getHeaders = data => {
  const duplicatedLevels = data
    .flatMap(({ community }) => community)
    .map(({ level }) => level)
    .sort((a, b) => a - b)
    .map(level => `Level ${level}`);

  return [...new Set(duplicatedLevels)];
};

Funkcja znajduje wszystkie pola 'level', a następnie sortuje je i pozbywa się duplikatów. W ten sposób otrzymujemy naszą listę nagłówków kolumn.

Następnie należy przepisać kolejne obiekty do postaci [username, level1, level2, level3, level4, level5, level6] lub podobnej. Wiedząc, że za pomocą new Array(len).fill(val) możesz zainicjalizować tablicę o podanej długości powinieneś już dać sobie radę. Wystarczy przeliterować po kolejnych obiektach i przepisać wartości do tablicy na indeks level - 1

Ogólnie, takie zadanka najprzyjemniej rozwiązuje się za pomocą lodash lub RxJS. Zainteresuj się nimi :)