import {Component, PropTypes} from 'react';
//import {Card, CardHeader} from 'material-ui/Card';

export class UserConnected extends Component {
  constructor(props) {
    super(props);
    this.state = {
      userCount: '0'
    };

  }

  componentWillMount() {
    this.props.observableStream.subscribe((x) => {
      //Transform the Payload to a Object
      var count = x.message + '';
      this.setState({userCount: count});
      console.log(this.state.userCount);
    });
  }

  shouldComponentUpdate(nextProps, nextState) {
    console.log('Is not being called');
    return true;
  }

  render() {
    return (
      <div>
        <h1>HelloWord</h1>
        <h2>IT is {this.state.userCount}</h2>
      </div>
    );
  }
}