From f759a4706a43b0d20efb7c7fc4dc869d281200c0 Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Tue, 25 Aug 2020 12:06:47 +0200
Subject: [PATCH] Calandar next month disable (when none) (#3508)

---
 packages/page-calendar/src/Month.tsx | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/packages/page-calendar/src/Month.tsx b/packages/page-calendar/src/Month.tsx
index 2ef67ef5f8..f8f8a4085e 100644
--- a/packages/page-calendar/src/Month.tsx
+++ b/packages/page-calendar/src/Month.tsx
@@ -21,6 +21,7 @@ interface Props {
 
 interface DateState {
   dateMonth: Date;
+  dateMonthNext: Date;
   dateSelected: Date;
   days: number[];
   startClass: string;
@@ -55,10 +56,11 @@ function prevMonth (date: Date): Date {
 
 function getDateState (_dateMonth: Date, _dateSelected: Date): DateState {
   const dateMonth = newZeroDate(_dateMonth);
-  const dateSelected = newZeroDate(_dateSelected);
 
   dateMonth.setDate(1);
 
+  const dateMonthNext = nextMonth(dateMonth);
+  const dateSelected = newZeroDate(_dateSelected);
   const numDays = nextMonth(dateMonth, 0).getDate();
   const days: number[] = [];
 
@@ -68,6 +70,7 @@ function getDateState (_dateMonth: Date, _dateSelected: Date): DateState {
 
   return {
     dateMonth,
+    dateMonthNext,
     dateSelected,
     days,
     startClass: `start${DAYS[dateMonth.getDay()]}`
@@ -76,11 +79,20 @@ function getDateState (_dateMonth: Date, _dateSelected: Date): DateState {
 
 function Month ({ className, now, onChange, scheduled }: Props): React.ReactElement<Props> {
   const { t } = useTranslation();
-  const [{ dateMonth, dateSelected, days, startClass }, setDate] = useState(getDateState(now, now));
+  const [{ dateMonth, dateMonthNext, dateSelected, days, startClass }, setDate] = useState(getDateState(now, now));
 
   const dayOfWeekRef = useRef(DAYS.map((d) => t(d)));
   const monthRef = useRef(MONTHS.map((m) => t(m)));
 
+  const hasNextMonth = useMemo(
+    (): boolean => {
+      const nextTime = dateMonthNext.getTime();
+
+      return scheduled.some(({ dateTime }) => dateTime >= nextTime);
+    },
+    [dateMonthNext, scheduled]
+  );
+
   const _nextMonth = useCallback(
     () => setDate(({ dateMonth, dateSelected }) => getDateState(nextMonth(dateMonth), dateSelected)),
     []
@@ -129,6 +141,7 @@ function Month ({ className, now, onChange, scheduled }: Props): React.ReactElem
           <div>{monthRef.current[dateMonth.getMonth()]} {dateMonth.getFullYear()}</div>
           <Button
             icon='chevron-right'
+            isDisabled={!hasNextMonth}
             onClick={_nextMonth}
           />
         </div>