import React from 'react'
import { Text, View } from 'react-native'

import TreeView from '@zaguini/react-native-tree-view'

class App extends React.PureComponent {
  state = {
    data: [
      {
        id: 'Grandparent',
        name: 'Grandpa',
        age: 78,
        children: [
          {
            id: 'Me',
            name: 'Me',
            age: 30,
            children: [
              {
                id: 'Erick',
                name: 'Erick',
                age: 10,
              },
              {
                id: 'Rose',
                name: 'Rose',
                age: 12,
              },
            ],
          },
        ],
      },
    ],
  }

  render() {
    return (
      <TreeView
        ref={ref => this.treeView = ref}
        data={this.state.data}
        deleteOnLongPress
        renderItem={(item, level) => (
          <View>
            <Text
              style={{
                marginLeft: 25 * level,
              }}
            >
              {
                item.collapsed !== null ?
                <Text>{item.collapsed ? ' > ' : ' \\/ '}</Text> :
                <Text> - </Text>
              }
              {item.name}
            </Text>
          </View>
        )}
      />
    )
  }
}

export default App