gab-social/app/javascript/gabsocial/features/home_timeline.js

100 lines
2.5 KiB
JavaScript
Raw Normal View History

import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
2020-02-19 23:57:07 +00:00
import { defineMessages, injectIntl } from 'react-intl'
import { withRouter } from 'react-router-dom'
import throttle from 'lodash.throttle'
import {
expandHomeTimeline,
forceDequeueTimeline,
} from '../actions/timelines'
2020-04-11 23:29:19 +01:00
import StatusList from '../components/status_list'
2019-07-02 08:10:25 +01:00
class HomeTimeline extends React.PureComponent {
2019-07-02 08:10:25 +01:00
componentDidMount () {
2020-02-19 23:57:07 +00:00
this._checkIfReloadNeeded(false, this.props.isPartial)
2019-07-02 08:10:25 +01:00
}
componentDidUpdate (prevProps) {
2020-02-19 23:57:07 +00:00
this._checkIfReloadNeeded(prevProps.isPartial, this.props.isPartial)
//Check if clicked on "home" button, if so, reload
if (prevProps.location.key !== this.props.location.key &&
prevProps.location.pathname === '/home' &&
this.props.location.pathname === '/home') {
this.handleReload()
}
2019-07-02 08:10:25 +01:00
}
componentWillUnmount () {
2020-02-19 23:57:07 +00:00
this._stopPolling()
2019-07-02 08:10:25 +01:00
}
handleLoadMore = (maxId) => {
this.props.onExpandHomeTimeline({ maxId })
}
handleReload = throttle(() => {
this.props.onExpandHomeTimeline()
}, 5000)
2019-07-02 08:10:25 +01:00
_checkIfReloadNeeded (wasPartial, isPartial) {
const { onExpandHomeTimeline } = this.props
2019-07-02 08:10:25 +01:00
2020-02-19 23:57:07 +00:00
if (!wasPartial && isPartial) {
2019-07-02 08:10:25 +01:00
this.polling = setInterval(() => {
onExpandHomeTimeline()
2020-02-19 23:57:07 +00:00
}, 3000)
2019-07-02 08:10:25 +01:00
} else if (wasPartial && !isPartial) {
2020-02-19 23:57:07 +00:00
this._stopPolling()
2019-07-02 08:10:25 +01:00
}
}
_stopPolling () {
if (this.polling) {
2020-02-19 23:57:07 +00:00
clearInterval(this.polling)
this.polling = null
2019-07-02 08:10:25 +01:00
}
}
render () {
2020-02-19 23:57:07 +00:00
const { intl } = this.props
const emptyMessage = intl.formatMessage(messages.empty)
2019-07-02 08:10:25 +01:00
return (
2020-04-11 23:29:19 +01:00
<StatusList
2020-02-19 23:57:07 +00:00
scrollKey='home_timeline'
onLoadMore={this.handleLoadMore}
timelineId='home'
emptyMessage={emptyMessage}
/>
)
2019-07-02 08:10:25 +01:00
}
}
const messages = defineMessages({
title: { id: 'column.home', defaultMessage: 'Home' },
empty: { id: 'empty_timeline.home', defaultMessage: 'Your home timeline is empty. Start following other users to receive their content here.' },
})
const mapStateToProps = (state) => ({
isPartial: state.getIn(['timelines', 'home', 'isPartial']),
})
const mapDispatchToProps = (dispatch) => ({
onExpandHomeTimeline(options) {
if (!options) dispatch(forceDequeueTimeline('home'))
dispatch(expandHomeTimeline(options))
},
})
HomeTimeline.propTypes = {
intl: PropTypes.object.isRequired,
isPartial: PropTypes.bool,
onExpandHomeTimeline: PropTypes.func.isRequired,
}
export default injectIntl(withRouter(connect(mapStateToProps, mapDispatchToProps)(HomeTimeline)))