From 8b59c0d0561e04c1742dc308ac5342cf9e18a577 Mon Sep 17 00:00:00 2001
From: "tainv.it93@gmail.com" <tainv.it93@gmail.com>
Date: Tue, 23 Apr 2019 22:29:33 +0700
Subject: [PATCH 1/3] add attribute 'hasChildren' as boolean to show Square
 icon in node

---
 src/lib/components/Row.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/Row.js b/src/lib/components/Row.js
index 7ee149e..bc96f2a 100644
--- a/src/lib/components/Row.js
+++ b/src/lib/components/Row.js
@@ -156,13 +156,14 @@ export default class Row extends React.Component {
             nodeIcon,
         } = this.props;
         const hasChildren = element.children && element.children.length > 0;
+        const showJunction = element.hasChildren
         return (
             <RowWrapper
                 first={depth === 0}
                 nodeSize={nodeSize}
             >
                 <FirstColumn nodeSize={nodeSize}>
-                    {this.renderJunction(hasChildren)}
+                    {this.renderJunction(showJunction)}
                     {!isLastParent &&
                         <VerticalLine
                             nodeSize={nodeSize}

From c6b1c9bb0bb61b12ebd8da5c23d683a64d50bcfe Mon Sep 17 00:00:00 2001
From: john-techfox <tainv.it93@gmail.com>
Date: Tue, 23 Apr 2019 23:54:59 +0700
Subject: [PATCH 2/3] can show empty childrens by attribute hasChildren

---
 src/demo/testData.js      | 12 ++++--------
 src/lib/components/Row.js |  7 ++++---
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/src/demo/testData.js b/src/demo/testData.js
index d439e1f..5835b77 100644
--- a/src/demo/testData.js
+++ b/src/demo/testData.js
@@ -2,24 +2,19 @@ const testData = [
     {
         id: 0,
         name: "Felidae",
+        hasChildren: true,
         children: [
             {
                 id: 1,
                 name: "Pantherinae",
+                hasChildren: true,
                 children: [
-                    {
-                        id: 2,
-                        name: "Neofelis",
-                    },
-                    {
-                        id: 3,
-                        name: "Panthera",
-                    }
                 ]
             },
             {
                 id: 4,
                 name: "Felinae",
+                hasChildren: true,
                 children: [
                     {
                         id: 5,
@@ -28,6 +23,7 @@ const testData = [
                     {
                         id: 6,
                         name: "Felis",
+                        hasChildren: true,
                         children: [{
                             name: "Fatty Oscar",
                         }]
diff --git a/src/lib/components/Row.js b/src/lib/components/Row.js
index bc96f2a..05bc9b7 100644
--- a/src/lib/components/Row.js
+++ b/src/lib/components/Row.js
@@ -155,8 +155,8 @@ export default class Row extends React.Component {
             nodeSize,
             nodeIcon,
         } = this.props;
-        const hasChildren = element.children && element.children.length > 0;
         const showJunction = element.hasChildren
+
         return (
             <RowWrapper
                 first={depth === 0}
@@ -188,7 +188,7 @@ export default class Row extends React.Component {
                                 src={nodeIcon}
                                 nodeSize={nodeSize}
                             />
-                            {hasChildren && isExpanded ?
+                            {showJunction && isExpanded ?
                                 <VerticalLine
                                     nodeSize={nodeSize}
                                     lineWidth={lineWidth}
@@ -201,7 +201,7 @@ export default class Row extends React.Component {
                         </Connector>
                         <Node>{renderNode(element)}</Node>
                     </NodeWrapper>
-                    {hasChildren && isExpanded && element.children.map((child, i) =>
+                    {showJunction && isExpanded && element.children.map((child, i) =>
                         (
                             <Row
                                 key={shortid.generate()}
@@ -218,6 +218,7 @@ export default class Row extends React.Component {
                                 lineAlpha={lineAlpha}
                                 expandButtonColor={expandButtonColor}
                                 nodeSize={nodeSize}
+                                nodeIcon={nodeIcon}
                             />
                         )
                     )}

From ea441b11ebfec55671396c01e31245300e9ffee1 Mon Sep 17 00:00:00 2001
From: john-techfox <john@techfox.io>
Date: Tue, 23 Apr 2019 23:57:59 +0700
Subject: [PATCH 3/3] fix readme

---
 README.md | 25 +++++++++++++++++++------
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/README.md b/README.md
index 7652f07..b3d91d7 100644
--- a/README.md
+++ b/README.md
@@ -19,6 +19,7 @@ import TreeView from 'react-expandable-treeview';
 ```javascript
     {
         id: 0,
+        hasChildren: true,
         children: [
             //...all the children elements*/
         ],
@@ -31,21 +32,27 @@ And an example of the `data` prop o be passed to `TreeView` component.
 const data = [
     {
         id: 0,
+        hasChildren: true,
         children: [
             {
-                id: 1
+                id: 1,
+                hasChildren: false
             },
             {
-                id: 2
+                id: 2,
+                hasChildren: false
             }
         ],
         id: 3,
+        hasChildren: true,
         children: [
             {
                 id: 4,
+                hasChildren: true,
                 children: [
                     {
-                        id: 5
+                        id: 5,
+                        hasChildren: false
                     }
                 ]
             }
@@ -60,26 +67,32 @@ In the example we add a custom `label` attribute to our `data` elements and we w
 const data = [
     {
         id: 0,
-        label: 'A Father'
+        label: 'A Father',
+        hasChildren: true,
         children: [
             {
                 id: 1,
-                label: 'A Son'
+                label: 'A Son',
+                hasChildren: false
             },
             {
                 id: 2,
-                label: 'Another Son'
+                label: 'Another Son',
+                hasChildren: false
             }
         ],
         id: 3,
         label: 'Another Father',
+        hasChildren: true,
         children: [
             {
                 id: 4,
+                hasChildren: true,
                 children: [
                     {
                         id: 5,
                         label: 'Yet Another Son',
+                        hasChildren: false
                     }
                 ]
             }