fake redux simulator

index.js

/** @jsx React.DOM */

var store = {
  name: "Chris",
  position: "there"
};

var reduce = function (state, action) {
  if (action.type === "CHANGE_NAME") {
    state.name = action.payload;
  }
  
  return state;
}

var Provider = React.createClass({
  getInitialState: function() {
    return store;
  },
  
  dispatch: function(action) {
    var newState = reduce(store, action);
    this.setState(newState);
  },
  
  render: function() {
    return <HPModule {...this.state} dispatch={this.dispatch} />;
  }
});

// This is our specific component
var HPModule = React.createClass({
  changeName: function(newName) {
    this.props.dispatch({
      type: "CHANGE_NAME",
      payload: newName
    });  
  },
  
  render: function() {
    return (
      <div>
        <h1>{"Shortlist Buttons Are " + this.props.position + "!"}</h1>
        <ShortlistButton {...this.props} changeName={this.changeName} />
      </div>
    );
  }
});

var ShortlistButton = React.createClass({
   onClick: function(e) {
     this.props.changeName("Super Chris");
   },
  
   render: function() {
     return (
       <button onClick={this.onClick}>
         {"Hey " + this.props.name + "!"}
       </button>
     )
   }
});
 
React.renderComponent(<Provider />, document.getElementById("page"));