Update content dinamically (#53)

* Added dynamiccontent example

* Update content

* Ingore dist folder

* Ignore .tsx files

* Move source folder

* Fix issue

* Fix typescript issue

* Fix tests issues

* Generated more tests

* Fix tslint issue

* ignore source

* remove unnecessary method

Author: Javier Morant

.gitignore

@@ -7,4 +7,6 @@ lib/
 
 # Jest
 #
-.jest/
+.jest/
+
+dist/

.npmignore

@@ -1,3 +1,4 @@
 examples
 flow-typed
-node_modules
+node_modules
+src

examples/DynamicContentExample.js

@@ -0,0 +1,145 @@
+/* @flow */
+
+import React from 'react'
+import {
+  Alert,
+  StyleSheet,
+  Text,
+  View,
+  type Props,
+  type State,
+  Button,
+} from 'react-native'
+import NestedListView from 'react-native-nested-listview'
+
+const data = [
+  {
+    name: 'Books Genders',
+    descendants: [
+      {
+        name: 'Adventure',
+      },
+      {
+        name: 'Romance',
+      },
+    ],
+  },
+  {
+    name: 'Movies',
+    descendants: [
+      {
+        name: 'Drama',
+      },
+      {
+        name: 'Action',
+      },
+    ],
+  },
+  {
+    name: 'Technology',
+    descendants: [
+      {name: 'Phones', descendants: [{name: 'Samsung'}, {name: 'iPhone'}]},
+    ],
+  },
+]
+
+const data2 = [
+  {
+    name: 'Music',
+    descendants: [
+      {
+        name: 'Rock',
+      },
+      {
+        name: 'Heavy Metal',
+      },
+      {
+        name: 'Pop',
+      },
+    ],
+  },
+  {
+    name: 'Food',
+    descendants: [
+      {
+        name: 'Dairy',
+      },
+      {
+        name: 'Sweet',
+        descendants: [
+          {
+            name: 'Chocolat',
+          },
+          {
+            name: 'Sugar',
+          },
+          {
+            name: 'Biscuits',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    name: 'Technology',
+    descendants: [{name: 'Laptop', descendants: [{name: 'Pc', name: 'Mac'}]}],
+  },
+]
+
+const styles = StyleSheet.create({
+  container: {flex: 1, backgroundColor: 'rgb(255, 255, 255)', padding: 15},
+  node: {
+    flex: 1,
+    padding: 10,
+    borderWidth: 1,
+    borderColor: 'rgb(0, 0, 0)',
+  },
+})
+export default class ExampleApp extends React.Component<Props, State> {
+  nestedListView: any
+
+  state = {
+    dataSource: 'data',
+  }
+
+  renderNode = (node: Object, level: number) => {
+    const paddingLeft = (level + 1) * 30
+
+    return (
+      <View style={[styles.node, {backgroundColor: 'white', paddingLeft}]}>
+        <Text>{node.name}</Text>
+      </View>
+    )
+  }
+
+  getChildrenName = (node: Object) => {
+    return 'descendants'
+  }
+  onPressUpdate = () => {
+    if (this.state.dataSource === 'data') {
+      this.setState({
+        dataSource: 'data2',
+      })
+    } else {
+      this.setState({
+        dataSource: 'data',
+      })
+    }
+  }
+
+  render = () => {
+    return (
+      <View style={styles.container}>
+        <View style={{margin: 10}}>
+          <Button onPress={this.onPressUpdate} title="Update Content" />
+        </View>
+        <NestedListView
+          data={this.state.dataSource === 'data' ? data : data2}
+          getChildrenName={this.getChildrenName}
+          onNodePressed={this.onNodePressed}
+          renderNode={this.renderNode}
+        />
+      </View>
+    )
+  }
+}

examples/HomeScreen.js

@@ -19,6 +19,10 @@ const options = [
     screen: 'NestedRowExample',
     title: 'NestedRow',
   },
+  {
+    screen: 'DynamicContentExample',
+    title: 'Dynamic Content',
+  },
 ]
 
 export default class HomeScreen extends React.Component {
@@ -38,8 +42,7 @@ export default class HomeScreen extends React.Component {
               borderWidth: 1,
               borderColor: 'rgb(0, 0, 0)',
             }}
-            onPress={() => this.props.navigation.navigate(option.screen)}
-          >
+            onPress={() => this.props.navigation.navigate(option.screen)}>
             <Text style={{color: 'rgb(0, 0, 0)'}}>{option.title}</Text>
           </TouchableOpacity>
         ))}

examples/index.js

@@ -4,6 +4,7 @@ import CustomNodeExample from './CustomNodeExample'
 import StateChangeNodeExample from './StateChangeNodeExample'
 import ErrorMessageExample from './ErrorMessageExample'
 import NestedRowExample from './NestedRowExample'
+import DynamicContentExample from './DynamicContentExample'
 
 import HomeScreen from './HomeScreen'
 
@@ -15,6 +16,7 @@ const SimpleApp = StackNavigator({
   StateChangeNodeExample: {screen: StateChangeNodeExample},
   ErrorMessageExample: {screen: ErrorMessageExample},
   NestedRowExample: {screen: NestedRowExample},
+  DynamicContentExample: {screen: DynamicContentExample},
 })
 
 AppRegistry.registerComponent('example', () => SimpleApp)

examples/package.json

@@ -13,7 +13,7 @@
     "react": "16.0.0",
     "react-native": "~0.49.3",
     "react-native-nested-listview": "file:../",
-    "react-navigation": "^1.0.0-beta.13",
+    "react-navigation": "1.5.8",
     "shortid": "^2.2.8"
   },
   "devDependencies": {