2016-11-05 23:20:05 +09:00
import { connect } from 'react-redux' ;
import PureRenderMixin from 'react-addons-pure-render-mixin' ;
import StatusListContainer from '../ui/containers/status_list_container' ;
import Column from '../ui/components/column' ;
import {
refreshTimeline ,
2016-11-10 08:47:47 +09:00
updateTimeline ,
deleteFromTimelines
2016-11-05 23:20:05 +09:00
} from '../../actions/timelines' ;
2017-01-30 23:22:04 +09:00
import ColumnBackButtonSlim from '../../components/column_back_button_slim' ;
2017-02-18 10:37:59 +09:00
import { FormattedMessage } from 'react-intl' ;
2017-02-04 08:34:31 +09:00
import createStream from '../../stream' ;
const mapStateToProps = state => ( {
2017-02-23 10:14:35 +09:00
hasUnread : state . getIn ( [ 'timelines' , 'tag' , 'unread' ] ) > 0 ,
2017-02-04 08:34:31 +09:00
accessToken : state . getIn ( [ 'meta' , 'access_token' ] )
} ) ;
2016-11-05 23:20:05 +09:00
const HashtagTimeline = React . createClass ( {
propTypes : {
params : React . PropTypes . object . isRequired ,
2017-02-04 08:34:31 +09:00
dispatch : React . PropTypes . func . isRequired ,
2017-02-23 10:14:35 +09:00
accessToken : React . PropTypes . string . isRequired ,
hasUnread : React . PropTypes . bool
2016-11-05 23:20:05 +09:00
} ,
mixins : [ PureRenderMixin ] ,
_subscribe ( dispatch , id ) {
2017-02-04 08:34:31 +09:00
const { accessToken } = this . props ;
this . subscription = createStream ( accessToken , ` hashtag&tag= ${ id } ` , {
received ( data ) {
switch ( data . event ) {
case 'update' :
dispatch ( updateTimeline ( 'tag' , JSON . parse ( data . payload ) ) ) ;
break ;
case 'delete' :
dispatch ( deleteFromTimelines ( data . payload ) ) ;
break ;
2016-11-05 23:20:05 +09:00
}
2017-02-04 08:34:31 +09:00
}
2016-11-05 23:20:05 +09:00
2017-02-04 08:34:31 +09:00
} ) ;
2016-11-05 23:20:05 +09:00
} ,
_unsubscribe ( ) {
if ( typeof this . subscription !== 'undefined' ) {
2017-02-04 08:34:31 +09:00
this . subscription . close ( ) ;
this . subscription = null ;
2016-11-05 23:20:05 +09:00
}
} ,
2017-02-04 08:34:31 +09:00
componentDidMount ( ) {
2016-11-05 23:20:05 +09:00
const { dispatch } = this . props ;
const { id } = this . props . params ;
2016-12-04 05:04:57 +09:00
dispatch ( refreshTimeline ( 'tag' , id ) ) ;
2016-11-05 23:20:05 +09:00
this . _subscribe ( dispatch , id ) ;
} ,
componentWillReceiveProps ( nextProps ) {
if ( nextProps . params . id !== this . props . params . id ) {
2016-12-04 05:04:57 +09:00
this . props . dispatch ( refreshTimeline ( 'tag' , nextProps . params . id ) ) ;
2016-11-05 23:20:05 +09:00
this . _unsubscribe ( ) ;
this . _subscribe ( this . props . dispatch , nextProps . params . id ) ;
}
} ,
componentWillUnmount ( ) {
this . _unsubscribe ( ) ;
} ,
render ( ) {
2017-02-23 10:14:35 +09:00
const { id , hasUnread } = this . props . params ;
2016-11-05 23:20:05 +09:00
return (
2017-02-23 10:14:35 +09:00
< Column icon = 'hashtag' active = { hasUnread } heading = { id } >
2017-01-30 23:22:04 +09:00
< ColumnBackButtonSlim / >
2017-02-18 10:37:59 +09:00
< StatusListContainer type = 'tag' id = { id } emptyMessage = { < FormattedMessage id = 'empty_column.hashtag' defaultMessage = 'There is nothing in this hashtag yet.' / > } / >
2016-11-05 23:20:05 +09:00
< / Column >
) ;
} ,
} ) ;
2017-02-04 08:34:31 +09:00
export default connect ( mapStateToProps ) ( HashtagTimeline ) ;