import { Action$, toReact } from 'react-xstream';

// Step 1. Listen to the Action$
Action$
  .ofType('LOGIN')
  .map(function(){
    /* do stuff */
    return { name: 'Mark', role: 'Admin'}
  })
  // Step 2. Publish data to React
  .map(user => ({ user }))
  .compose(toReact('user'))

import { withStream, dispatch } from 'react-xstream';

// In your component
class MyComponent() extends Component {
  componentWillReceiveProps(props){
    this.setState(props)
  }

  // Step 3. Render your data in react
  render() {
    <div>Current user: { this.props.user.name }</div>;
  }  

  // Step 4. Dispatch actions, goto step 1
  onLoginClick(){
    dispatch('LOGIN', {username: '...', password: '...' })
  }
}

export default withStream(['user'])(MyComponent)