# Вложенная таблица
## Макет для референса

## Структура входных данных

const data = [
    {
        id: 212, // user id
        level: 0,
        user: 'John',
        wallet: '...',
        volume: 12,
        balance: 15
        children: [{
            id: 122, // user id
            level: 1,
            user: 'Lydia',
            wallet: '...',
            volume: 12,
            balance: 56,
            children: [{
                id: 172, // user id
                level: 2,
                user: 'Casey',
                wallet: '...',
                volume: 12,
                balance: 56,
                children: [{}]   
            }]
        }]
    }
]

## Как это рисовать?

const recursiveRow = data.map(rootRow => 
 (
    <>
        <!--For the first cell, margins are calculated by the `level` field-->
        <tr key={rootRow.id}>{columnKeys.map(key => (<td key={key}>{ rootRow[key] }</td>))}</tr>
        <!-- if there are no cildren, array is empty and nothing is drown -->
        { rootRow.children.map(child => recursiveRow(child)) }
    </>
 )
)