2017-05-02 20:04:16 -04:00
import React from 'react' ;
2017-02-22 20:14:35 -05:00
import { connect } from 'react-redux' ;
2018-03-24 10:25:15 -04:00
import { expandHomeTimeline } from '../../actions/timelines' ;
2017-04-21 14:05:35 -04:00
import PropTypes from 'prop-types' ;
2016-10-12 07:17:17 -04:00
import StatusListContainer from '../ui/containers/status_list_container' ;
2017-06-03 19:39:38 -04:00
import Column from '../../components/column' ;
import ColumnHeader from '../../components/column_header' ;
import { addColumn , removeColumn , moveColumn } from '../../actions/columns' ;
2017-02-17 20:37:59 -05:00
import { defineMessages , injectIntl , FormattedMessage } from 'react-intl' ;
2017-01-10 11:25:10 -05:00
import ColumnSettingsContainer from './containers/column_settings_container' ;
2017-10-07 20:55:58 -04:00
import { Link } from 'react-router-dom' ;
2020-01-23 16:00:13 -05:00
import AnnouncementsContainer from 'mastodon/features/getting_started/containers/announcements_container' ;
2016-11-18 09:36:16 -05:00
const messages = defineMessages ( {
2017-05-20 11:31:47 -04:00
title : { id : 'column.home' , defaultMessage : 'Home' } ,
2016-11-18 09:36:16 -05:00
} ) ;
2016-10-12 07:17:17 -04:00
2017-02-22 20:14:35 -05:00
const mapStateToProps = state => ( {
2017-05-04 17:41:34 -04:00
hasUnread : state . getIn ( [ 'timelines' , 'home' , 'unread' ] ) > 0 ,
2019-03-01 05:11:35 -05:00
isPartial : state . getIn ( [ 'timelines' , 'home' , 'isPartial' ] ) ,
2017-02-22 20:14:35 -05:00
} ) ;
2018-09-14 11:59:48 -04:00
export default @ connect ( mapStateToProps )
2017-06-23 13:36:54 -04:00
@ injectIntl
2018-09-14 11:59:48 -04:00
class HomeTimeline extends React . PureComponent {
2016-10-12 07:17:17 -04:00
2017-05-12 08:44:10 -04:00
static propTypes = {
2017-06-03 19:39:38 -04:00
dispatch : PropTypes . func . isRequired ,
2018-07-29 10:52:06 -04:00
shouldUpdateScroll : PropTypes . func ,
2017-05-12 08:44:10 -04:00
intl : PropTypes . object . isRequired ,
hasUnread : PropTypes . bool ,
2018-01-17 17:56:03 -05:00
isPartial : PropTypes . bool ,
2017-06-03 19:39:38 -04:00
columnId : PropTypes . string ,
multiColumn : PropTypes . bool ,
2017-05-12 08:44:10 -04:00
} ;
2017-06-03 19:39:38 -04: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 ;
}
2018-03-24 10:25:15 -04:00
handleLoadMore = maxId => {
this . props . dispatch ( expandHomeTimeline ( { maxId } ) ) ;
2017-06-11 11:07:35 -04:00
}
2018-01-17 17:56:03 -05:00
componentDidMount ( ) {
this . _checkIfReloadNeeded ( false , this . props . isPartial ) ;
}
componentDidUpdate ( prevProps ) {
this . _checkIfReloadNeeded ( prevProps . isPartial , this . props . isPartial ) ;
}
componentWillUnmount ( ) {
this . _stopPolling ( ) ;
}
_checkIfReloadNeeded ( wasPartial , isPartial ) {
const { dispatch } = this . props ;
if ( wasPartial === isPartial ) {
return ;
} else if ( ! wasPartial && isPartial ) {
this . polling = setInterval ( ( ) => {
2018-03-24 10:25:15 -04:00
dispatch ( expandHomeTimeline ( ) ) ;
2018-01-17 17:56:03 -05:00
} , 3000 ) ;
} else if ( wasPartial && ! isPartial ) {
this . _stopPolling ( ) ;
}
}
_stopPolling ( ) {
if ( this . polling ) {
clearInterval ( this . polling ) ;
this . polling = null ;
}
}
2016-10-12 07:17:17 -04:00
render ( ) {
2018-07-29 10:52:06 -04:00
const { intl , shouldUpdateScroll , hasUnread , columnId , multiColumn } = this . props ;
2017-06-03 19:39:38 -04:00
const pinned = ! ! columnId ;
2017-05-04 17:41:34 -04:00
2016-10-12 07:17:17 -04:00
return (
2019-08-01 13:17:17 -04:00
< Column bindToDocument = { ! multiColumn } ref = { this . setRef } label = { intl . formatMessage ( messages . title ) } >
2017-06-03 19:39:38 -04:00
< 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 17:41:34 -04:00
< StatusListContainer
2020-01-23 16:00:13 -05:00
prepend = { < AnnouncementsContainer / > }
alwaysPrepend
2017-06-05 09:20:46 -04:00
trackScroll = { ! pinned }
2017-06-03 19:39:38 -04:00
scrollKey = { ` home_timeline- ${ columnId } ` }
2018-03-24 10:25:15 -04:00
onLoadMore = { this . handleLoadMore }
2017-06-11 11:07:35 -04:00
timelineId = 'home'
2017-10-13 10:44:16 -04:00
emptyMessage = { < FormattedMessage id = 'empty_column.home' defaultMessage = 'Your home timeline is empty! 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> }} / > }
2018-07-29 10:52:06 -04:00
shouldUpdateScroll = { shouldUpdateScroll }
2019-07-19 03:25:22 -04:00
bindToDocument = { ! multiColumn }
2017-05-04 17:41:34 -04:00
/ >
2016-10-12 07:17:17 -04:00
< / C o l u m n >
) ;
2017-04-21 14:05:35 -04:00
}
2016-10-12 07:17:17 -04:00
2017-04-21 14:05:35 -04:00
}