From 791b12fcaf7224470b9c78c75cc880a83a26e8fb Mon Sep 17 00:00:00 2001
From: Jason Hansen <jason_hansen@outlook.com>
Date: Fri, 25 Mar 2016 15:42:31 -0700
Subject: [PATCH 1/5] Update example.js

---
 public/scripts/example.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/public/scripts/example.js b/public/scripts/example.js
index c249427a..533bae8a 100644
--- a/public/scripts/example.js
+++ b/public/scripts/example.js
@@ -29,6 +29,7 @@ var Comment = React.createClass({
 });
 
 var CommentBox = React.createClass({
+
   loadCommentsFromServer: function() {
     $.ajax({
       url: this.props.url,
@@ -42,6 +43,7 @@ var CommentBox = React.createClass({
       }.bind(this)
     });
   },
+  
   handleCommentSubmit: function(comment) {
     var comments = this.state.data;
     // Optimistically set an id on the new comment. It will be replaced by an
@@ -64,13 +66,16 @@ var CommentBox = React.createClass({
       }.bind(this)
     });
   },
+  
   getInitialState: function() {
     return {data: []};
   },
+  
   componentDidMount: function() {
     this.loadCommentsFromServer();
     setInterval(this.loadCommentsFromServer, this.props.pollInterval);
   },
+  
   render: function() {
     return (
       <div className="commentBox">
@@ -80,6 +85,7 @@ var CommentBox = React.createClass({
       </div>
     );
   }
+
 });
 
 var CommentList = React.createClass({

From 13be99ac906e4f4a3142e41ebe18a2b745c2ce90 Mon Sep 17 00:00:00 2001
From: Jason Hansen <jason_hansen@outlook.com>
Date: Fri, 25 Mar 2016 15:43:21 -0700
Subject: [PATCH 2/5] Update example.js

---
 public/scripts/example.js | 21 +--------------------
 1 file changed, 1 insertion(+), 20 deletions(-)

diff --git a/public/scripts/example.js b/public/scripts/example.js
index 533bae8a..a858340a 100644
--- a/public/scripts/example.js
+++ b/public/scripts/example.js
@@ -45,26 +45,7 @@ var CommentBox = React.createClass({
   },
   
   handleCommentSubmit: function(comment) {
-    var comments = this.state.data;
-    // Optimistically set an id on the new comment. It will be replaced by an
-    // id generated by the server. In a production application you would likely
-    // not use Date.now() for this and would have a more robust system in place.
-    comment.id = Date.now();
-    var newComments = comments.concat([comment]);
-    this.setState({data: newComments});
-    $.ajax({
-      url: this.props.url,
-      dataType: 'json',
-      type: 'POST',
-      data: comment,
-      success: function(data) {
-        this.setState({data: data});
-      }.bind(this),
-      error: function(xhr, status, err) {
-        this.setState({data: comments});
-        console.error(this.props.url, status, err.toString());
-      }.bind(this)
-    });
+    ...
   },
   
   getInitialState: function() {

From 16af05b6825a87bb0dc0aed68be65373f006e969 Mon Sep 17 00:00:00 2001
From: Jason Hansen <jason_hansen@outlook.com>
Date: Sun, 27 Mar 2016 00:28:17 -0700
Subject: [PATCH 3/5] Update example.js

---
 public/scripts/example.js | 22 +++++++---------------
 1 file changed, 7 insertions(+), 15 deletions(-)

diff --git a/public/scripts/example.js b/public/scripts/example.js
index a858340a..01afba2c 100644
--- a/public/scripts/example.js
+++ b/public/scripts/example.js
@@ -30,22 +30,14 @@ var Comment = React.createClass({
 
 var CommentBox = React.createClass({
 
-  loadCommentsFromServer: function() {
-    $.ajax({
-      url: this.props.url,
-      dataType: 'json',
-      cache: false,
-      success: function(data) {
-        this.setState({data: data});
-      }.bind(this),
-      error: function(xhr, status, err) {
-        console.error(this.props.url, status, err.toString());
-      }.bind(this)
-    });
+  updateState: function() {
+    this.setState({
+      data: store.comments
+    })
   },
   
   handleCommentSubmit: function(comment) {
-    ...
+    actions.submitComment(comment);
   },
   
   getInitialState: function() {
@@ -53,8 +45,8 @@ var CommentBox = React.createClass({
   },
   
   componentDidMount: function() {
-    this.loadCommentsFromServer();
-    setInterval(this.loadCommentsFromServer, this.props.pollInterval);
+    store.subscribe(this.updateState);
+    actions.loadCommentsFromServer();
   },
   
   render: function() {

From 1b868e2c2f36eb9d6f6961dc5914f0c9c57c3c6a Mon Sep 17 00:00:00 2001
From: Jason Hansen <jason_hansen@outlook.com>
Date: Sun, 27 Mar 2016 00:34:02 -0700
Subject: [PATCH 4/5] Update example.js

---
 public/scripts/example.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/public/scripts/example.js b/public/scripts/example.js
index 01afba2c..2375c6e9 100644
--- a/public/scripts/example.js
+++ b/public/scripts/example.js
@@ -61,6 +61,12 @@ var CommentBox = React.createClass({
 
 });
 
+module.exports = connect(function(state) {
+  return {
+    comments: state.comments
+  }
+}, CommentBox);
+
 var CommentList = React.createClass({
   render: function() {
     var commentNodes = this.props.data.map(function(comment) {

From 2f1c151024a22913a12b04e47bc7a444c87876f2 Mon Sep 17 00:00:00 2001
From: Jason Hansen <jason_hansen@outlook.com>
Date: Sun, 27 Mar 2016 00:36:48 -0700
Subject: [PATCH 5/5] Update example.js

---
 public/scripts/example.js | 17 +++--------------
 1 file changed, 3 insertions(+), 14 deletions(-)

diff --git a/public/scripts/example.js b/public/scripts/example.js
index 2375c6e9..a6ea3e40 100644
--- a/public/scripts/example.js
+++ b/public/scripts/example.js
@@ -30,30 +30,19 @@ var Comment = React.createClass({
 
 var CommentBox = React.createClass({
 
-  updateState: function() {
-    this.setState({
-      data: store.comments
-    })
+  propTypes: {
+    comments: React.PropTypes.array.isRequired
   },
   
   handleCommentSubmit: function(comment) {
     actions.submitComment(comment);
   },
   
-  getInitialState: function() {
-    return {data: []};
-  },
-  
-  componentDidMount: function() {
-    store.subscribe(this.updateState);
-    actions.loadCommentsFromServer();
-  },
-  
   render: function() {
     return (
       <div className="commentBox">
         <h1>Comments</h1>
-        <CommentList data={this.state.data} />
+        <CommentList data={this.props.comments} />
         <CommentForm onCommentSubmit={this.handleCommentSubmit} />
       </div>
     );