Creating the TweetList component
As you know, our Collection component has two child components: CollectionControls and TweetList.
We'll first build the TweetList component. Create the following ~/snapterest/source/components/TweetList.react.js file:
var React = require('react');
var Tweet = require('./Tweet.react.js');
var listStyle = {
padding: '0'
};
var listItemStyle = {
display: 'inline-block',
listStyle: 'none'
};
var TweetList = React.createClass({
getListOfTweetIds: function () {
return Object.keys(this.props.tweets);
},
getTweetElement: function (tweetId) {
var tweet = this.props.tweets[tweetId];
var handleRemoveTweetFromCollection = this.props.onRemoveTweetFromCollection;
var tweetElement;
if (handleRemoveTweetFromCollection) {
tweetElement = (
<Tweet
tweet={tweet}
onImageClick={handleRemoveTweetFromCollection} />
);
} else {
tweetElement = <Tweet tweet={tweet} />;
}
return...