aaronpowell · March 26, 2015 00:33 · Mar 26, 2015
diff --git a/UserList.jsx b/UserList.jsx
@@ -0,0 +1,18 @@
+var UserList = React.createClass({
+  render() {
+    return (
+      <table>
+        <thead>
+          <tr>
+            <th>Name</th>
+            <th></th>
+          </tr>
+        </thead>
+
+        <tbody>
+          {this.props.users.filter(user => user.enabled).map(user => <UserRow user={user} />)}
+        </tbody>
+      </table>
+    );
+  }
+});
diff --git a/UserRow.jsx b/UserRow.jsx
@@ -0,0 +1,18 @@
+var UserRow = React.createClass({
+  contextTypes: {
+    userService: React.PropTypes.object
+  },
+
+  render() {
+    return (
+      <tr>
+        <td>{this.props.user.name}</td>
+        <td><button onClick={this.disable}>Disable</td>
+      </tr>
+    );
+  },
+
+  disable() {
+    this.context.userService.disable(this.props.userId);
+  }
+});
diff --git a/UserView.jsx b/UserView.jsx
@@ -0,0 +1,30 @@
+var UserView = React.createClass({
+  childContextTypes: {
+    userStore: React.PropTypes.shape({
+      disable: React.PropTypes.func
+    })
+  },
+
+  getInitialState() {
+    return {
+      users: []
+    }
+  },
+
+  getChildContext() {
+    return {
+      userStore: {
+        disable: userId => 
+          xhr.post(`/api/user/${userId}/disable`)
+            .then(() => xhr.get(`/api/user`))
+            .then(users => this.setState({ users }));
+      }
+    };
+  },
+
+  render() {
+    return (
+      <UserList users={this.state.users} />
+    );
+  }
+});