Refactoring the StreamTweet component
StreamTweet renders a tweet image that a user can click on to add it to a collection of tweets. You might have already guessed that we're going to create and dispatch a new action when a user clicks on that tweet image.
First, we import the CollectionActionCreators module to the StreamTweet component:
var CollectionActionCreators = require('../actions/CollectionActionCreators');Then, we add a new addTweetToCollection() method to it:
addTweetToCollection: function (tweet) {
CollectionActionCreators.addTweetToCollection(tweet);
},The addTweetToCollection() is a callback function that should be invoked when a user clicks on a tweet image. Let's take a look at this line in the render() method:
<Tweet tweet={tweet} onImageClick={this.props.onAddTweetToCollection} />We replace it with this line of code:
<Tweet tweet={tweet} onImageClick={this.addTweetToCollection} />The StreamTweet component is done.
