From 03249f2c40f3d5485a3e196859779e311f31d7e3 Mon Sep 17 00:00:00 2001
From: Rohit Sarkar <rohitsarkar5398@gmail.com>
Date: Sun, 27 Jan 2019 22:27:19 +0530
Subject: [PATCH 1/3] fix: Uncomment all commented rooms

---
 .../ClassroomComponent/BookingComponent/Rooms.js       |  2 +-
 .../ClassroomComponent/ViewBookingsComponent/Rooms.js  | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/ClassroomComponent/BookingComponent/Rooms.js b/src/components/ClassroomComponent/BookingComponent/Rooms.js
index a39e8cee..c21c713a 100644
--- a/src/components/ClassroomComponent/BookingComponent/Rooms.js
+++ b/src/components/ClassroomComponent/BookingComponent/Rooms.js
@@ -150,7 +150,7 @@ class RoomsContainer extends Component {
               <MyRaisedButton id={5203} />
               <MyRaisedButton id={5205} />
               <MyRaisedButton id={5206} />
-              {/* <MyRaisedButton id={5207} /> SC */}
+              <MyRaisedButton id={5207} />
               <MyRaisedButton id={5208} />
             </div>
             <div style={styles.buttonsRow}>
diff --git a/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js b/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
index 761d5b8d..6a64a260 100644
--- a/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
+++ b/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
@@ -90,20 +90,20 @@ class RoomsContainer extends Component {
 
           <div style={{ width: this.props.isMobile ? '100%' : '35%', backgroundColor: '', display: 'flex', flexDirection: 'column', justifyContent: 'space-around' }}>
             <h4>NLH</h4>
-            {/* <div style={styles.buttonsRow}>
+            <div style={styles.buttonsRow}>
               <MyRaisedButton id={3102} />
               <MyRaisedButton id={3103} />
               <MyRaisedButton id={3104} />
               <MyRaisedButton id={3105} />
-            </div> */}
+            </div>
             <div style={styles.buttonsRow}>
               <MyRaisedButton id={3202} />
-              {/* <MyRaisedButton id={3203} /> DIRECTOR */}
+              <MyRaisedButton id={3203} />
               <MyRaisedButton id={3204} />
               <MyRaisedButton id={3205} />
             </div>
             <div style={styles.buttonsRow}>
-              {/* <MyRaisedButton id={3302} /> PARIKSHIT */}
+              <MyRaisedButton id={3302} />
               <MyRaisedButton id={3303} />
               <MyRaisedButton id={3304} />
               <MyRaisedButton id={3305} />
@@ -126,7 +126,7 @@ class RoomsContainer extends Component {
               <MyRaisedButton id={5203} />
               <MyRaisedButton id={5205} />
               <MyRaisedButton id={5206} />
-              {/* <MyRaisedButton id={5207} /> SC */}
+              <MyRaisedButton id={5207} />
               <MyRaisedButton id={5208} />
             </div>
             <div style={styles.buttonsRow}>

From b1b5d0c4ea718de6e748be776b38dfb4b9263d1d Mon Sep 17 00:00:00 2001
From: Rohit Sarkar <rohitsarkar5398@gmail.com>
Date: Sun, 27 Jan 2019 23:31:51 +0530
Subject: [PATCH 2/3] feat: Handle blocked rooms in View Bookings

---
 src/Services/firebaseDBService.js                        | 5 +++--
 .../ClassroomComponent/ViewBookingsComponent/Rooms.js    | 7 ++++---
 .../ViewBookingsComponent/ViewBookingsComponent.js       | 9 +++++++--
 3 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/Services/firebaseDBService.js b/src/Services/firebaseDBService.js
index b395da31..b6aba6d8 100644
--- a/src/Services/firebaseDBService.js
+++ b/src/Services/firebaseDBService.js
@@ -128,7 +128,8 @@ function extractRooms (avl) {
   })
 }
 
-async function getBlockedRooms (dates) {
+export const getBlockedRooms = async (startDate, endDate) => {
+  let dates = getDateArr(startDate, endDate)
   let rooms = []
   let blocked
   await firebaseDB.ref('blocked/').once('value')
@@ -147,7 +148,7 @@ async function getBlockedRooms (dates) {
 export const fetchRooms = async (startDate, endDate, callback) => {
   let dateArr = getDateArr(startDate, endDate)
   let blockedRooms
-  await getBlockedRooms(dateArr).then(rooms => {
+  await getBlockedRooms(startDate, endDate).then(rooms => {
     blockedRooms = rooms
   })
   return new Promise((resolve, reject) => {
diff --git a/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js b/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
index 6a64a260..b431d3a2 100644
--- a/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
+++ b/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
@@ -16,7 +16,8 @@ class RoomsContainer extends Component {
   componentWillReceiveProps (newProps) {
     let tempTaken = newProps.takenRooms ? newProps.takenRooms : this.state.takenRooms
     let tempApproved = newProps.approvedRooms ? newProps.approvedRooms : this.state.approvedRooms
-    this.setState({ takenRooms: tempTaken, approvedRooms: tempApproved })
+    let tempBlocked = newProps.blockedRooms ? newProps.blockedRooms : this.state.blockedRooms
+    this.setState({ takenRooms: tempTaken, approvedRooms: tempApproved, blockedRooms: tempBlocked })
   }
 
   render () {
@@ -58,8 +59,8 @@ class RoomsContainer extends Component {
           label={label}
           style={styles.roomButton}
           labelStyle={styles.roomButtonLabel}
-          // disabledBackgroundColor={'#FAE0DE'}
-          disabled={!(scope.state.takenRooms).includes(props.id)}
+          disabledBackgroundColor={(scope.state.blockedRooms).includes(props.id) ? '#FAE0DE' : ''}
+          disabled={!(scope.state.takenRooms).includes(props.id) || (scope.state.blockedRooms).includes(props.id)}
           // color={(scope.state.takenRooms).includes(props.id) ? 'default' : 'secondary'}
           default={(scope.state.takenRooms).includes(props.id)}
           secondary={(scope.state.approvedRooms).includes(props.id)}
diff --git a/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js b/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js
index bdd90f86..e9ffa714 100644
--- a/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js
+++ b/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js
@@ -4,7 +4,7 @@ import DatePicker from 'material-ui/DatePicker'
 import RoomsContainer from './Rooms'
 import { connect } from 'react-redux'
 import moment from 'moment'
-import { fetchRooms, getDisabledDates, getBookingDetails, fetchApprovedRooms } from '../../../Services/firebaseDBService'
+import { fetchRooms, getDisabledDates, getBookingDetails, fetchApprovedRooms, getBlockedRooms } from '../../../Services/firebaseDBService'
 import { EventDetails } from './EventDetailsComponent'
 
 class ViewBooking extends React.Component {
@@ -21,6 +21,7 @@ class ViewBooking extends React.Component {
       dateSelected: false,
       takenRooms: [],
       approvedRooms: [],
+      blockedRooms: [],
       fetchingRooms: true,
       isRoomSelected: false,
       selectedRoom: null,
@@ -64,6 +65,10 @@ class ViewBooking extends React.Component {
       .catch(function (error) {
         console.log(error)
       })
+    getBlockedRooms(this.state.selectedDate, this.state.selectedDate)
+      .then(function (res) {
+        scope.setState({ blockedRooms: res })
+      })
   }
 
   handleDate (event, date) {
@@ -108,7 +113,7 @@ class ViewBooking extends React.Component {
                     required
                   />
                 </div>
-                <RoomsContainer datesSelected={this.state.dateSelected} fetchingRooms={this.state.fetchingRooms} takenRooms={this.state.takenRooms} approvedRooms={this.state.approvedRooms} handleSelectedRoom={(temp) => this.handleSelectedRoom(temp)} />
+                <RoomsContainer datesSelected={this.state.dateSelected} fetchingRooms={this.state.fetchingRooms} takenRooms={this.state.takenRooms} approvedRooms={this.state.approvedRooms} blockedRooms={this.state.blockedRooms} handleSelectedRoom={(temp) => this.handleSelectedRoom(temp)} />
                 <div style={{ marginTop: '20px', textAlign: 'left' }}>
                   <EventDetails isRoomSelected={this.state.isRoomSelected} fetchingEventData={this.state.fetchingEventData} eventDetails={this.state.eventDetails} />
                 </div>

From 49496a61270d2c4af63ab69c0b1613668e76ea9f Mon Sep 17 00:00:00 2001
From: Rohit Sarkar <rohitsarkar5398@gmail.com>
Date: Sun, 27 Jan 2019 17:21:37 +0530
Subject: [PATCH 3/3] [UI changes] Minor changes to View Bookings UI, enables
 differentiating b/w approved bookings and pending.

[UI fix] Changes to View Bookings. A few UI changes, one can differentiate between approved bookings and pending booking requests.
---
 .../BookingComponent/Rooms.js                 |  2 +-
 .../EventDetailsComponent.js                  | 70 ++++++++++++++++---
 .../ViewBookingsComponent/Rooms.js            | 10 +--
 .../ViewBookingsComponent.js                  |  4 +-
 4 files changed, 67 insertions(+), 19 deletions(-)

diff --git a/src/components/ClassroomComponent/BookingComponent/Rooms.js b/src/components/ClassroomComponent/BookingComponent/Rooms.js
index a39e8cee..c21c713a 100644
--- a/src/components/ClassroomComponent/BookingComponent/Rooms.js
+++ b/src/components/ClassroomComponent/BookingComponent/Rooms.js
@@ -150,7 +150,7 @@ class RoomsContainer extends Component {
               <MyRaisedButton id={5203} />
               <MyRaisedButton id={5205} />
               <MyRaisedButton id={5206} />
-              {/* <MyRaisedButton id={5207} /> SC */}
+              <MyRaisedButton id={5207} />
               <MyRaisedButton id={5208} />
             </div>
             <div style={styles.buttonsRow}>
diff --git a/src/components/ClassroomComponent/ViewBookingsComponent/EventDetailsComponent.js b/src/components/ClassroomComponent/ViewBookingsComponent/EventDetailsComponent.js
index eacd56bf..4a1f72d4 100644
--- a/src/components/ClassroomComponent/ViewBookingsComponent/EventDetailsComponent.js
+++ b/src/components/ClassroomComponent/ViewBookingsComponent/EventDetailsComponent.js
@@ -2,7 +2,18 @@ import React from 'react'
 import { Card, CardTitle, CardText } from 'material-ui/Card'
 import Divider from 'material-ui/Divider'
 import CircularProgress from 'material-ui/CircularProgress'
+import { List, ListItem } from 'material-ui/List'
+import Subheader from 'material-ui/Subheader'
+import CheckCircleIcon from 'material-ui/svg-icons/action/check-circle'
 
+const Subtitle = (props) => {
+  return (
+    <div style={{ display: 'flex', justifyContent: 'center' }}>
+      <h5> {props.title} </h5>
+      {props.approved && <CheckCircleIcon style={{ color: '#558B2F' }} hoverColor={'#33691E'} data-tip='Approved' /> }
+    </div>
+  )
+}
 function getRoomsString (rooms) {
   let roomList = ''
   // determines the academic block according to the first digit as array index
@@ -29,23 +40,60 @@ export const EventDetails = (props) => {
   if (props.isRoomSelected) {
     if (props.fetchingEventData) {
       return (
-        <div>
+        <div style={{ margin: 'auto', width: 300 }}>
           <p>Fetching Event...</p>
           <CircularProgress size={60} />
         </div>
       )
     } else {
+      console.log(props.eventDetails)
       return (
-        <Card>
-          <CardTitle style={{ fontWeight: 'bold' }} title={props.eventDetails.clubName} subtitle={props.eventDetails.title} />
-          <CardText>
-            <p><b> Starts </b> {props.eventDetails.startDate}</p>
-            <Divider style={{ margin: '5px' }} />
-            <p><b> Ends </b> {props.eventDetails.endDate}</p>
-            <Divider style={{ margin: '5px' }} />
-            <p><b> Rooms </b> {getRoomsString(props.eventDetails.rooms)} </p>
-            <Divider style={{ margin: '5px' }} />
-            <p><b> Contact </b> {props.eventDetails.booker_name} : {props.eventDetails.booker_contact} </p>
+        <Card style={{}}>
+          <CardTitle style={{ fontWeight: 'bold', textAlign: 'center' }} title={props.eventDetails.clubName} subtitle={<Subtitle title={props.eventDetails.title} approved={props.eventDetails.SO_appr === 'approved'} />} />
+          <CardText style={{ display: 'flex', flexDirection: props.isMobile ? 'column' : 'row', justifyContent: 'space-between' }}>
+            <div>
+              <List>
+                <div style={{ display: 'flex', flexDirection: props.isMobile ? 'column' : 'row' }}>
+                  <Subheader> Start </Subheader>
+                  <ListItem
+                    primaryText={props.eventDetails.startDate}
+                    disabled
+                    style={{ minWidth: 300 }}
+                  />
+                </div>
+                <Divider />
+                <div style={{ display: 'flex', flexDirection: props.isMobile ? 'column' : 'row' }}>
+                  <Subheader> End </Subheader>
+                  <ListItem
+                    primaryText={props.eventDetails.endDate}
+                    disabled
+                    style={{ minWidth: 300 }}
+                  />
+                <Divider />
+                </div>
+              </List>
+            </div>
+            <div>
+              <List>
+                <div style={{ display: 'flex', flexDirection: props.isMobile ? 'column' : 'row' }}>
+                  <Subheader> Rooms </Subheader>
+                  <ListItem
+                    primaryText={getRoomsString(props.eventDetails.rooms)}
+                    disabled
+                    style={{ minWidth: 300 }}
+                  />
+                </div>
+                <Divider style={{ margin: '5px' }} />
+                <div style={{ display: 'flex', flexDirection: props.isMobile ? 'column' : 'row' }}>
+                  <Subheader> Contact </Subheader>
+                  <ListItem
+                    primaryText={props.eventDetails.booker_name + ': ' + props.eventDetails.booker_contact}
+                    disabled
+                    style={{ minWidth: 300 }}
+                  />
+                </div>
+              </List>
+            </div>
           </CardText>
         </Card>
       )
diff --git a/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js b/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
index 761d5b8d..e456ac50 100644
--- a/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
+++ b/src/components/ClassroomComponent/ViewBookingsComponent/Rooms.js
@@ -90,20 +90,20 @@ class RoomsContainer extends Component {
 
           <div style={{ width: this.props.isMobile ? '100%' : '35%', backgroundColor: '', display: 'flex', flexDirection: 'column', justifyContent: 'space-around' }}>
             <h4>NLH</h4>
-            {/* <div style={styles.buttonsRow}>
+            <div style={styles.buttonsRow}>
               <MyRaisedButton id={3102} />
               <MyRaisedButton id={3103} />
               <MyRaisedButton id={3104} />
               <MyRaisedButton id={3105} />
-            </div> */}
+            </div>
             <div style={styles.buttonsRow}>
               <MyRaisedButton id={3202} />
-              {/* <MyRaisedButton id={3203} /> DIRECTOR */}
+              <MyRaisedButton id={3203} /> DIRECTOR
               <MyRaisedButton id={3204} />
               <MyRaisedButton id={3205} />
             </div>
             <div style={styles.buttonsRow}>
-              {/* <MyRaisedButton id={3302} /> PARIKSHIT */}
+              <MyRaisedButton id={3302} /> PARIKSHIT
               <MyRaisedButton id={3303} />
               <MyRaisedButton id={3304} />
               <MyRaisedButton id={3305} />
@@ -126,7 +126,7 @@ class RoomsContainer extends Component {
               <MyRaisedButton id={5203} />
               <MyRaisedButton id={5205} />
               <MyRaisedButton id={5206} />
-              {/* <MyRaisedButton id={5207} /> SC */}
+              <MyRaisedButton id={5207} />
               <MyRaisedButton id={5208} />
             </div>
             <div style={styles.buttonsRow}>
diff --git a/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js b/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js
index bdd90f86..96b20b39 100644
--- a/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js
+++ b/src/components/ClassroomComponent/ViewBookingsComponent/ViewBookingsComponent.js
@@ -93,7 +93,7 @@ class ViewBooking extends React.Component {
           <div style={{ backgroundColor: '', width: '100%', alignSelf: 'center', display: 'flex', textAlign: 'center', justifyContent: 'center' }}>
             <div style={{ width: this.props.isMobile ? '95%' : '85%' }}>
               <div className='locationContainer' style={{ marginBottom: 50 }}>
-                <div style={{ backgroundColor: '', display: 'flex', flexDirection: this.props.isMobile ? 'column' : 'row', justifyContent: 'space-between', alignItems: 'center' }}>
+                <div style={{ backgroundColor: '', display: 'flex', flexDirection: this.props.isMobile ? 'column' : 'row', justifyContent: 'center', alignItems: 'center' }}>
                   <DatePicker
                     floatingLabelText='Date'
                     mode={this.props.isMobile ? 'portrait' : 'landscape'}
@@ -110,7 +110,7 @@ class ViewBooking extends React.Component {
                 </div>
                 <RoomsContainer datesSelected={this.state.dateSelected} fetchingRooms={this.state.fetchingRooms} takenRooms={this.state.takenRooms} approvedRooms={this.state.approvedRooms} handleSelectedRoom={(temp) => this.handleSelectedRoom(temp)} />
                 <div style={{ marginTop: '20px', textAlign: 'left' }}>
-                  <EventDetails isRoomSelected={this.state.isRoomSelected} fetchingEventData={this.state.fetchingEventData} eventDetails={this.state.eventDetails} />
+                  <EventDetails isMobile={this.props.isMobile} isRoomSelected={this.state.isRoomSelected} fetchingEventData={this.state.fetchingEventData} eventDetails={this.state.eventDetails} />
                 </div>
               </div>
             </div>