React-expandable-treeview with array data

Question

I'm using react-expandable-treeview component to display my data array for a family tree project.

By using recursion as it is shown in documentation, I've ended up with passing my data array into the TreeView component like that:

<TreeView data={data} renderNode={({label}) => <div>{label}</div>}/>

where data contains ids,first names and children of each individual of the family, starting from the root parent and its children, then children of children, etc.

Here is how the data looks like in the console. Now I am struggling with how to access each of the array's data to display it properly in a collapsible treeview structure.

     var n=0

     const data = [{
       id: n,
       label: items.first_name,
       children: items.children
   }] 

And here is how I see it on the website after clicking on the root name and its first child.

I am not sure how exactly I should access the children to display each of them correctly. Here I can't see their names and they all collapse at once instead of doing so one by one after clicking on each node. I've tried using mapping on children field in the const data, but that only gave me syntax error.

How can I do so correctly? Would appreciate any help on that.