is.js

    spymaster: PropTypes.bool.isRequired,
    double: PropTypes.string,
    toggleSpymaster: PropTypes.func
  }

    window.addEventListener('deviceorientation', this.onDeviceOrientation)
  }

    window.removeEventListener('deviceorientation', this.onDeviceOrientation)
  }

    if (this.props.spymaster) {
      if (-50 < beta && beta < 50 && -50 < gamma && gamma < 50) {
        this.props.toggleSpymaster()
      }
    }
  }

    return (
    )
  }
}

function mapStateToProps(state) {
  return {
    spymaster: state.spymaster,
    double: chain(state.words)
              .countBy('type')
              .value()
  }
}

function mapDispatchToProps(dispatch) {
  return {
      dispatch({ type: 'spymaster' })
    }
  }
}

not.js

import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { chain } from 'lodash'
import css from './app.css'
import Board from './board'
class App extends React.Component {
  static propTypes = {
  componentDidMount() {
  componentWillUnmount() {
  onDeviceOrientation = (e) => {
      const { beta, gamma } = e
  render() {
      <div {...css}>
        <div className="controls">
          <label>
            <input
              type="checkbox"
              checked={this.props.spymaster}
              onChange={this.props.toggleSpymaster} />
            {' '}
            I am spymaster
          </label>
          <span className="instructions">
            {this.props.double.toUpperCase()} goes first
          </span>
        </div>
        <Board />
      </div>
              .findKey(count => count === 9)
    toggleSpymaster() {
export default connect(mapStateToProps, mapDispatchToProps)(App)