import React from 'react'; import PropTypes from 'prop-types'; import moment from 'moment'; import queryString from 'query-string'; import { withRouter } from 'react-router-dom'; import ArrowBackIcon from 'react-icons/lib/md/arrow-back'; import ArrowForwardIcon from 'react-icons/lib/md/arrow-forward'; import purifyWeek from '../../lib/purifyWeek'; import { weekFromLocation } from '../../lib/url'; class WeekSelector extends React.Component { static propTypes = { // react-router location: PropTypes.object.isRequired, history: PropTypes.object.isRequired, }; getWeekText() { const week = weekFromLocation(this.props.location); const currentWeek = moment().week(); if (currentWeek === week) { return `Huidige week • ${week}`; } else if (currentWeek + 1 === week) { return `Volgende week • ${week}`; } else if (currentWeek - 1 === week) { return `Vorige week • ${week}`; } return `Week ${week}`; } updateWeek(change) { const week = weekFromLocation(this.props.location); const newWeek = purifyWeek(week + change); const isCurrentWeek = moment().week() === newWeek; const query = queryString.stringify({ week: isCurrentWeek ? undefined : newWeek, }); this.props.history.push(`${this.props.location.pathname}?${query}`); } render() { return (
{this.getWeekText()}
); } } export default withRouter(WeekSelector);