2022-02-25 08:34:33 +09:00
import PropTypes from 'prop-types' ;
2023-05-28 23:38:10 +09:00
import { PureComponent } from 'react' ;
2022-02-25 08:34:33 +09:00
import { FormattedMessage } from 'react-intl' ;
2023-05-28 23:38:10 +09:00
import ImmutablePropTypes from 'react-immutable-proptypes' ;
2022-02-25 08:34:33 +09:00
import { connect } from 'react-redux' ;
2023-05-28 23:38:10 +09:00
2022-04-07 05:53:29 +09:00
import { debounce } from 'lodash' ;
2023-05-28 23:38:10 +09:00
import { fetchTrendingStatuses , expandTrendingStatuses } from 'flavours/glitch/actions/trends' ;
2023-07-08 18:12:20 +09:00
import { DismissableBanner } from 'flavours/glitch/components/dismissable_banner' ;
2023-05-28 23:38:10 +09:00
import StatusList from 'flavours/glitch/components/status_list' ;
2023-06-23 06:48:40 +09:00
import { getStatusList } from 'flavours/glitch/selectors' ;
2022-02-25 08:34:33 +09:00
const mapStateToProps = state => ( {
2023-06-23 06:48:40 +09:00
statusIds : getStatusList ( state , 'trending' ) ,
2022-02-25 08:34:33 +09:00
isLoading : state . getIn ( [ 'status_lists' , 'trending' , 'isLoading' ] , true ) ,
2022-04-07 05:53:29 +09:00
hasMore : ! ! state . getIn ( [ 'status_lists' , 'trending' , 'next' ] ) ,
2022-02-25 08:34:33 +09:00
} ) ;
2023-05-28 21:18:23 +09:00
class Statuses extends PureComponent {
2022-02-25 08:34:33 +09:00
static propTypes = {
statusIds : ImmutablePropTypes . list ,
isLoading : PropTypes . bool ,
2022-04-07 05:53:29 +09:00
hasMore : PropTypes . bool ,
2022-02-25 08:34:33 +09:00
multiColumn : PropTypes . bool ,
dispatch : PropTypes . func . isRequired ,
} ;
componentDidMount ( ) {
const { dispatch } = this . props ;
dispatch ( fetchTrendingStatuses ( ) ) ;
}
2022-04-07 05:53:29 +09:00
handleLoadMore = debounce ( ( ) => {
const { dispatch } = this . props ;
dispatch ( expandTrendingStatuses ( ) ) ;
2023-02-04 04:52:07 +09:00
} , 300 , { leading : true } ) ;
2022-04-07 05:53:29 +09:00
2022-02-25 08:34:33 +09:00
render ( ) {
2022-04-07 05:53:29 +09:00
const { isLoading , hasMore , statusIds , multiColumn } = this . props ;
2022-02-25 08:34:33 +09:00
const emptyMessage = < FormattedMessage id = 'empty_column.explore_statuses' defaultMessage = 'Nothing is trending right now. Check back later!' / > ;
return (
2023-10-20 11:08:13 +09:00
< StatusList
trackScroll
prepend = { < DismissableBanner id = 'explore/statuses' > < FormattedMessage id = 'dismissable_banner.explore_statuses' defaultMessage = 'These are posts from across the social web that are gaining traction today. Newer posts with more boosts and favorites are ranked higher.' / > < / DismissableBanner > }
alwaysPrepend
timelineId = 'explore'
statusIds = { statusIds }
scrollKey = 'explore-statuses'
hasMore = { hasMore }
isLoading = { isLoading }
onLoadMore = { this . handleLoadMore }
emptyMessage = { emptyMessage }
bindToDocument = { ! multiColumn }
withCounters
/ >
2022-02-25 08:34:33 +09:00
) ;
}
}
2023-03-25 07:15:25 +09:00
export default connect ( mapStateToProps ) ( Statuses ) ;