Creating the CollectionControls component
Now, when we understand what the Collection
component renders, let's discuss its child components. We'll start with CollectionControls
. Create the following ~/snapterest/source/components/CollectionControls.react.js
file:
var React = require('react'); var Header = require('./Header.react'); var Button = require('./Button.react'); var CollectionRenameForm = require('./CollectionRenameForm.react'); var CollectionExportForm = require('./CollectionExportForm.react'); var CollectionControls = React.createClass({ getInitialState: function () { return { name: 'new', isEditingName: false }; }, getHeaderText: function () { var numberOfTweetsInCollection = this.props.numberOfTweetsInCollection; var text = numberOfTweetsInCollection; if (numberOfTweetsInCollection === 1) { text = text + ' tweet in your'; } else { text = text + ' tweets in your'; } return ( <span> {text} <...