From 82ba6eb9c363d79b5efd084ef56e86cf6d2b41bf Mon Sep 17 00:00:00 2001
From: Bilal ayachi <bilal.ayachi@hetmml.nl>
Date: Fri, 2 Feb 2018 22:10:30 +0100
Subject: Add relative week change message

---
 src/client/react/components/container/WeekSelector.js | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

(limited to 'src/client/react/components')

diff --git a/src/client/react/components/container/WeekSelector.js b/src/client/react/components/container/WeekSelector.js
index 5977c98..03f1880 100644
--- a/src/client/react/components/container/WeekSelector.js
+++ b/src/client/react/components/container/WeekSelector.js
@@ -10,6 +10,20 @@ import ArrowForwardIcon from 'react-icons/lib/md/arrow-forward';
 import purifyWeek from '../../lib/purifyWeek';
 import { weekFromLocation } from '../../lib/url';
 
+function weekName(week) {
+  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;
+}
+
 const WeekSelector = ({ location, history }) => {
   const week = weekFromLocation(location);
 
@@ -26,7 +40,7 @@ const WeekSelector = ({ location, history }) => {
   return (
     <div className="week-selector">
       <button onClick={() => updateWeek(-1)}><ArrowBackIcon /></button>
-      <div className="text">Week {week}</div>
+      <div className="text">{weekName(week)}</div>
       <button onClick={() => updateWeek(+1)}><ArrowForwardIcon /></button>
     </div>
   );
-- 
cgit v1.1