2017-05-03 02:04:16 +02:00
import React from 'react' ;
2017-02-23 02:14:35 +01:00
import { connect } from 'react-redux' ;
2017-04-21 20:05:35 +02:00
import PropTypes from 'prop-types' ;
2016-10-12 13:17:17 +02:00
import StatusListContainer from '../ui/containers/status_list_container' ;
2017-06-04 01:39:38 +02:00
import Column from '../../components/column' ;
import ColumnHeader from '../../components/column_header' ;
import { addColumn , removeColumn , moveColumn } from '../../actions/columns' ;
2017-02-18 02:37:59 +01:00
import { defineMessages , injectIntl , FormattedMessage } from 'react-intl' ;
2017-01-10 17:25:10 +01:00
import ColumnSettingsContainer from './containers/column_settings_container' ;
2017-05-18 19:14:03 +02:00
import Link from 'react-router/lib/Link' ;
2016-11-18 15:36:16 +01:00
const messages = defineMessages ( {
2017-05-20 17:31:47 +02:00
title : { id : 'column.home' , defaultMessage : 'Home' } ,
2016-11-18 15:36:16 +01:00
} ) ;
2016-10-12 13:17:17 +02:00
2017-02-23 02:14:35 +01:00
const mapStateToProps = state => ( {
2017-05-04 23:41:34 +02:00
hasUnread : state . getIn ( [ 'timelines' , 'home' , 'unread' ] ) > 0 ,
2017-05-20 17:31:47 +02:00
hasFollows : state . getIn ( [ 'accounts_counters' , state . getIn ( [ 'meta' , 'me' ] ) , 'following_count' ] ) > 0 ,
2017-02-23 02:14:35 +01:00
} ) ;
2017-04-21 20:05:35 +02:00
class HomeTimeline extends React . PureComponent {
2016-10-12 13:17:17 +02:00
2017-05-12 14:44:10 +02:00
static propTypes = {
2017-06-04 01:39:38 +02:00
dispatch : PropTypes . func . isRequired ,
2017-05-12 14:44:10 +02:00
intl : PropTypes . object . isRequired ,
hasUnread : PropTypes . bool ,
2017-05-20 17:31:47 +02:00
hasFollows : PropTypes . bool ,
2017-06-04 01:39:38 +02:00
columnId : PropTypes . string ,
multiColumn : PropTypes . bool ,
2017-05-12 14:44:10 +02:00
} ;
2017-06-04 01:39:38 +02:00
handlePin = ( ) => {
const { columnId , dispatch } = this . props ;
if ( columnId ) {
dispatch ( removeColumn ( columnId ) ) ;
} else {
dispatch ( addColumn ( 'HOME' , { } ) ) ;
}
}
handleMove = ( dir ) => {
const { columnId , dispatch } = this . props ;
dispatch ( moveColumn ( columnId , dir ) ) ;
}
handleHeaderClick = ( ) => {
this . column . scrollTop ( ) ;
}
setRef = c => {
this . column = c ;
}
2016-10-12 13:17:17 +02:00
render ( ) {
2017-06-04 01:39:38 +02:00
const { intl , hasUnread , hasFollows , columnId , multiColumn } = this . props ;
const pinned = ! ! columnId ;
2017-05-04 23:41:34 +02:00
let emptyMessage ;
if ( hasFollows ) {
2017-05-20 17:31:47 +02:00
emptyMessage = < FormattedMessage id = 'empty_column.home.inactivity' defaultMessage = "Your home feed is empty. If you have been inactive for a while, it will be regenerated for you soon." / > ;
2017-05-04 23:41:34 +02:00
} else {
emptyMessage = < FormattedMessage id = 'empty_column.home' defaultMessage = "You aren't following anyone yet. Visit {public} or use search to get started and meet other users." values = { { public : < Link to = '/timelines/public' > < FormattedMessage id = 'empty_column.home.public_timeline' defaultMessage = 'the public timeline' / > < /Link> }} / > ;
}
2016-11-16 17:20:52 +01:00
2016-10-12 13:17:17 +02:00
return (
2017-06-04 01:39:38 +02:00
< Column ref = { this . setRef } >
< ColumnHeader
icon = 'home'
active = { hasUnread }
title = { intl . formatMessage ( messages . title ) }
onPin = { this . handlePin }
onMove = { this . handleMove }
onClick = { this . handleHeaderClick }
pinned = { pinned }
multiColumn = { multiColumn }
>
< ColumnSettingsContainer / >
< / C o l u m n H e a d e r >
2017-05-04 23:41:34 +02:00
< StatusListContainer
{ ... this . props }
2017-06-05 15:20:46 +02:00
trackScroll = { ! pinned }
2017-06-04 01:39:38 +02:00
scrollKey = { ` home_timeline- ${ columnId } ` }
2017-05-04 23:41:34 +02:00
type = 'home'
emptyMessage = { emptyMessage }
/ >
2016-10-12 13:17:17 +02:00
< / C o l u m n >
) ;
2017-04-21 20:05:35 +02:00
}
2016-10-12 13:17:17 +02:00
2017-04-21 20:05:35 +02:00
}
2017-02-23 02:14:35 +01:00
export default connect ( mapStateToProps ) ( injectIntl ( HomeTimeline ) ) ;