Alt StoreStateMixin

StoreStateMixin.js

import alt from 'data/alt'

export function StoreStateMixin( ...stores) {

  stores= stores.map(( store)=>{
    if( typeof( store) === 'string') {
      return alt.getStore( store)
    }
    else {
      return store
    }
  })

  return {
    
    getInitialState() {
      return (this.getStoreState) ? this.getStoreState() : {}
    },

    componentWillMount() {
      if( this.getStoreState) {
        stores.forEach(( store)=>{
          store.listen( this._updateStateFromStores)
        })
      }
    },

    componentWillUnmount() {
      stores.forEach(( store)=>{
        store.unlisten( this._updateStateFromStores)
      })
    },

    _updateStateFromStores() {
      this.setState( this.getStoreState())
    }
  }
}

UsageExample.js

import {StoreStateMixin} from 'mixins' // app-specific, obviously
import {StoreA, StoreB} from 'data' // or wherever

export let MyComponent= React.createClass({

  mixins: [
    StoreStateMixin( StoreA, StoreB)
  ],

  getStoreState() {
    return {
      whatever: StoreA.getWhatever(),
      storeB: StoreB.getState()
    }
  },

  render() {
    let {whatever, storeB}= this.state
    return (
      <div>
        { whatever}
      </div>
    )
  },
})