From 3b98d4c4f13424c89a10580065075998d37ae857 Mon Sep 17 00:00:00 2001
From: Noah Loomans <noahloomans@gmail.com>
Date: Sun, 28 Jan 2018 16:06:56 +0100
Subject: Improve week logic
---
src/client/react/components/container/WeekSelector.js | 13 +++++++------
src/client/react/components/page/User.js | 6 +++---
src/client/react/lib/purifyWeek.js | 9 +++++++++
3 files changed, 19 insertions(+), 9 deletions(-)
create mode 100644 src/client/react/lib/purifyWeek.js
(limited to 'src/client')
diff --git a/src/client/react/components/container/WeekSelector.js b/src/client/react/components/container/WeekSelector.js
index c9174ca..eef8d8d 100644
--- a/src/client/react/components/container/WeekSelector.js
+++ b/src/client/react/components/container/WeekSelector.js
@@ -1,17 +1,18 @@
import React from 'react';
import PropTypes from 'prop-types';
import moment from 'moment';
-import momentPropTypes from 'react-moment-proptypes';
import queryString from 'query-string';
import { withRouter } from 'react-router-dom';
+import purifyWeek from '../../lib/purifyWeek';
+
const WeekSelector = ({ urlWeek, location, history }) => {
const updateWeek = (change) => {
- const newWeek = moment().week(urlWeek.week() + change);
- const isCurrentWeek = moment().week() === newWeek.week();
+ const newWeek = purifyWeek(urlWeek + change);
+ const isCurrentWeek = moment().week() === newWeek;
const query = queryString.stringify({
- week: isCurrentWeek ? undefined : newWeek.week(),
+ week: isCurrentWeek ? undefined : newWeek,
});
history.push(`${location.pathname}?${query}`);
};
@@ -19,14 +20,14 @@ const WeekSelector = ({ urlWeek, location, history }) => {
return (
<div>
<button onClick={() => updateWeek(-1)}>Prev</button>
- Week {urlWeek.week()}
+ Week {urlWeek}
<button onClick={() => updateWeek(+1)}>Next</button>
</div>
);
};
WeekSelector.propTypes = {
- urlWeek: momentPropTypes.momentObj.isRequired,
+ urlWeek: PropTypes.number.isRequired,
history: PropTypes.shape({
push: PropTypes.func.isRequired,
}).isRequired,
diff --git a/src/client/react/components/page/User.js b/src/client/react/components/page/User.js
index 72e92c2..10d608d 100644
--- a/src/client/react/components/page/User.js
+++ b/src/client/react/components/page/User.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
import { Redirect } from 'react-router-dom';
import queryString from 'query-string';
import moment from 'moment';
+import purifyWeek from '../../lib/purifyWeek';
import Search from '../container/Search';
import View from '../container/View';
import users from '../../users';
@@ -11,7 +12,7 @@ import WeekSelector from '../container/WeekSelector';
const App = ({ match, location }) => {
const user = `${match.params.type}/${match.params.value}`;
const weekStr = queryString.parse(location.search).week;
- const week = weekStr ? moment().week(weekStr) : moment();
+ const week = purifyWeek(weekStr ? parseInt(weekStr, 10) : moment().week());
if (!users.allIds.includes(user)) {
// Invalid user, redirect to index.
@@ -26,8 +27,7 @@ const App = ({ match, location }) => {
<WeekSelector urlWeek={week} />
</div>
</div>
- {/* The View object just wants the week number. */}
- <View user={user} week={week.week()} />
+ <View user={user} week={week} />
</div>
);
};
diff --git a/src/client/react/lib/purifyWeek.js b/src/client/react/lib/purifyWeek.js
new file mode 100644
index 0000000..939f5af
--- /dev/null
+++ b/src/client/react/lib/purifyWeek.js
@@ -0,0 +1,9 @@
+import moment from 'moment';
+
+export default function purifyWeek(week) {
+ // This ensures that week 0 will become week 52 and that week 53 will become
+ // week 1. This also accounts for leap years. Because date logic can be so
+ // complicated we off load it to moment.js so that we can be sure it's bug
+ // free.
+ return moment().week(week).week();
+}
--
cgit v1.1