import React from 'react' import { Helmet } from 'react-helmet' import { connect } from 'react-redux' import ActivitiesFilter from './ActivitiesFilter' import ActivitiesList from './ActivitiesList' import { getData } from '../../actions' import { getMoreActivities } from '../../actions/activities' class Activities extends React.Component { constructor(props, context) { super(props, context) this.state = { params: { page: 1, per_page: 10, }, } } componentDidMount() { this.props.loadActivities(this.state.params) } setParams(e) { const { params } = this.state if (e.target.value === '') { delete params[e.target.name] } else { params[e.target.name] = e.target.value } params.page = 1 this.setState(params) } render() { const { activities, loadActivities, loadMoreActivities, message, sports } = this.props const { params } = this.state const paginationEnd = activities.length > 0 ? activities[activities.length - 1].previous_activity === null : true return (
FitTrackee - Workouts {message ? ( {message} ) : (
loadActivities(params)} updateParams={e => this.setParams(e)} />
{!paginationEnd && { params.page += 1 loadMoreActivities(params) this.setState(params) }} /> }
)}
) } } export default connect( state => ({ activities: state.activities.data, message: state.message, sports: state.sports.data, }), dispatch => ({ loadActivities: params => { dispatch(getData('activities', params)) }, loadMoreActivities: params => { dispatch(getMoreActivities(params)) }, }) )(Activities)