content: import React from 'react'
  import Store from '../store'
  import Monster from './monster'
  import Actions from '../actions'
  
  export default class Monsters extends React.Component {
    constructor(props) {
      super(props)
      this.state = {
        monsters: Store.getAllMonsters(),
      }
      this.updateState = this.updateState.bind(this)
    }
  
    getAllMonsters() {
      return this.state.monsters.map((monster)=> {
        return <Monster key={monster._id} monster={monster} />
      })
    }
  
    updateState() {
      this.setState({monsters: Store.getAllMonsters()})
    }
  
    componentDidMount() {
      Actions.loadMonsters()
      Store.addChangeListener(this.updateState)
    }
  
    newMonster() {
      Actions.new()
    }
  
    render() {
      let monsters = this.getAllMonsters()
      return <div>
        <button onClick={this.newMonster}>New</button>
        <ul>
          {monsters}
        </ul>
      </div>
    }
  }
  