Shared component actions

So, how do we change from a PageView class to a PageEditor class? For that, we need to hook into browser events and fiddle with the state:

class Page extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            "isEditing": false
        };
    }

    render() {
        if (this.state.isEditing) {
            return <PageEditor
                {...this.props}
                onCancel={this.onCancel.bind(this)}
                />;
        }

        return <PageView
            {...this.props}
            onPageEdit={this.onEdit.bind(this)}
            />;
    }

    onEdit() {
        this.setState({
            "isEditing": true
        });
    }

    onCancel() {
        this.setState({
            "isEditing": false
        });
    }
}

We're providing a way for child components to call methods in parent components by passing down methods child components can use. When...