From 61b7d5c3893219ea14743278a1043f42812de915 Mon Sep 17 00:00:00 2001
From: Fernando Ferreira <fernando.ferreira.tbe@gmail.com>
Date: Mon, 12 Aug 2019 16:38:31 -0300
Subject: [PATCH] Implement two-way-binding

- Implement a new way of get and handle some contents in different components
---
 src/app/components/Home.js | 12 ++++++++++--
 src/app/index.js           |  4 +++-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/app/components/Home.js b/src/app/components/Home.js
index bd0d7c0..4a20ad1 100644
--- a/src/app/components/Home.js
+++ b/src/app/components/Home.js
@@ -8,7 +8,7 @@ export class Home extends React.Component {
         this.state = {
             age: props.initialAge,
             status: 0,
-            homeLink: "Changed Link"
+            homeLink: props.initialLinkName
         }
 
         // Just to observe Virtual DOM updating behavior.
@@ -31,6 +31,12 @@ export class Home extends React.Component {
         this.props.changeLink(this.state.homeLink);
     }
 
+    onHandleChange(event) {
+        this.setState({
+            homeLink: event.target.value
+        });
+    }
+
     render() {
         return(
             <div>
@@ -43,6 +49,7 @@ export class Home extends React.Component {
                 <hr />
                 <button onClick={this.props.greet} className="btn btn-primary">Greet</button>
                 <hr />
+                <input type="text" value={this.state.homeLink} onChange={(event) => this.onHandleChange(event)}/>
                 <button onClick={this.onChangeLink.bind(this)} className="btn btn-primary">Change Header Link</button>
             </div>
         );
@@ -52,5 +59,6 @@ export class Home extends React.Component {
 Home.propTypes = {
     name: PropTypes.string,
     initialAge: PropTypes.number,
-    greet: PropTypes.func
+    greet: PropTypes.func,
+    initialLinkName: PropTypes.string
 }
\ No newline at end of file
diff --git a/src/app/index.js b/src/app/index.js
index 9169a32..d84ab99 100644
--- a/src/app/index.js
+++ b/src/app/index.js
@@ -37,7 +37,9 @@ class App extends React.Component {
                             name={"Fernando"} 
                             initialAge={32} 
                             greet={this.onGreet} 
-                            changeLink={this.onChangeLinkName.bind(this)} />
+                            changeLink={this.onChangeLinkName.bind(this)} 
+                            initialLinkName={this.state.homeLink}
+                        />
                     </div>
                 </div>