From 63253bf9e36a1699696833e847c01567fc69040a Mon Sep 17 00:00:00 2001
From: Qstick <qstick@gmail.com>
Date: Sat, 13 Apr 2019 22:13:30 -0400
Subject: [PATCH] Fixed: Collapse calendar view buttons on smaller screens

---
 frontend/src/Calendar/Header/CalendarHeader.js   | 16 +++++++++++++++-
 .../Calendar/Header/CalendarHeaderConnector.js   |  1 +
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/frontend/src/Calendar/Header/CalendarHeader.js b/frontend/src/Calendar/Header/CalendarHeader.js
index a87938639..97052e0c8 100644
--- a/frontend/src/Calendar/Header/CalendarHeader.js
+++ b/frontend/src/Calendar/Header/CalendarHeader.js
@@ -84,6 +84,7 @@ class CalendarHeader extends Component {
       end,
       longDateFormat,
       isSmallScreen,
+      collapseViewButtons,
       onTodayPress,
       onPreviousPress,
       onNextPress
@@ -146,7 +147,7 @@ class CalendarHeader extends Component {
             }
 
             {
-              isSmallScreen ?
+              collapseViewButtons ?
                 <Menu
                   className={styles.viewMenu}
                   alignMenu={align.RIGHT}
@@ -159,6 +160,18 @@ class CalendarHeader extends Component {
                   </MenuButton>
 
                   <MenuContent>
+                    {
+                      isSmallScreen ?
+                        null :
+                        <ViewMenuItem
+                          name={calendarViews.MONTH}
+                          selectedView={view}
+                          onPress={this.onViewChange}
+                        >
+                          Month
+                        </ViewMenuItem>
+                    }
+
                     <ViewMenuItem
                       name={calendarViews.WEEK}
                       selectedView={view}
@@ -244,6 +257,7 @@ CalendarHeader.propTypes = {
   end: PropTypes.string.isRequired,
   view: PropTypes.oneOf(calendarViews.all).isRequired,
   isSmallScreen: PropTypes.bool.isRequired,
+  collapseViewButtons: PropTypes.bool.isRequired,
   longDateFormat: PropTypes.string.isRequired,
   onViewChange: PropTypes.func.isRequired,
   onTodayPress: PropTypes.func.isRequired,
diff --git a/frontend/src/Calendar/Header/CalendarHeaderConnector.js b/frontend/src/Calendar/Header/CalendarHeaderConnector.js
index c96cf2869..b73730ed9 100644
--- a/frontend/src/Calendar/Header/CalendarHeaderConnector.js
+++ b/frontend/src/Calendar/Header/CalendarHeaderConnector.js
@@ -23,6 +23,7 @@ function createMapStateToProps() {
       ]);
 
       result.isSmallScreen = dimensions.isSmallScreen;
+      result.collapseViewButtons = dimensions.isLargeScreen;
       result.longDateFormat = uiSettings.longDateFormat;
 
       return result;