vis.js/Javascript/React: получение групп из базы данных

Question

В настоящее время я использую REACT в качестве внешнего интерфейса и обращаюсь к данным из базы данных Neo4j. Также я использую vis.js для рендеринга временной шкалы событий. В настоящее время я пытаюсь найти лучший способ отображения моих данных в группах в пользовательском интерфейсе REACT. Большинство примеров vis.js, которые я видел, используют статические данные в коде. Я также просмотрел документацию по vis.js, но это не помогло. Хедз-ап Я новичок в РЕАКТ /JS.

Прямо сейчас, следующий код отображает все данные на экране.

const nArray = data.abs.map((abs, index) => ({id: index + 1, content: abs.Des[0], start: abs.time, title: abs.Trace, end: null, group: 1}))

const groups = ([{id: 1, content: 'Prog'}])

    <div className="timeline">
        <Timeline 
            groups={groups}
            items={nArray}
            options={options}
            container={container}
          />;
    </div>

В моей БД у меня есть 4 типа узлов, и сейчас все они отображаются в одной группе, Prog, Я хотел бы отобразить 4 группы узлов в своих соответствующих группах на временной шкале, используя vis.js, но я не уверен, как фильтровать данные с помощью функции карты или это лучшее решение. Будем весьма благодарны за любые предложения о том, как решить эту проблему.