update

.firebase/hosting.YnVpbGQ.cache

-asset-manifest.json,1592372919635,c312bb70da8ac0d70e1842132fdd5db46ba3e1aedaa9bad87f5b037643099393
-index.html,1592372919635,d48ef71c73b88253d2dbdd4b0ee32e405fd5aa8896800575e033c116b98ad2f2
-precache-manifest.0107ca3eca3ee2410845ac2a70c03ed3.js,1592372919635,87b476aa219bbbb3a9271c685d46df215684cb23444550de00e6108d2c38a16b
-service-worker.js,1592372919635,cbf86d50bf517818433d9e89bdb8d42f21cb8f76c9ee7c20d06666bb8803b07f
+asset-manifest.json,1593590234816,1b5a195eef4b766f96663a1b633ad7c3a07d7e9c42ffbb7176343cbf93794c5d
+precache-manifest.8aa1bd7a5bd976f5b492c39cdf0068ef.js,1593590234815,8302bb4db34c40c08daf677fa3e3ce0556795c12a2642890f68b1c6c263788b2
+index.html,1593590234815,f2a9a0540ab4403db6adba13c1c94010b8dbf531b6b6dc4560aaa27e4867746b
+service-worker.js,1593590234815,d1fcce4d8f135ef8f5ef0b4d3783272252b40ea77850e769119f4f0e87689a6a
 manifest.json,1581659498318,851311324495b7eadd44a9e70f013e60f6ac9965a5a155cb4734894fd0e7dd5f
 home.png,1581659498317,d3b21fd280b3304b29b980aab96dce3fb728c5a6c31f04c8dcf94480770e19ef
-static/css/2.38695c78.chunk.css,1592372919691,df7c74b70fea8b04fd0985d5d2a2a2e7d14eb9920dbd0f99d131abbaf3fd44ce
-static/css/2.38695c78.chunk.css.map,1592372919695,aee7adea8d3da5aba91a0208f66abdbbfcad0c53c36e3e69a24c51de68e4f62d
-static/js/runtime~main.a8a9905a.js,1592372919690,e1af5f94fdd13901b2e433d0d7607e27c01458151c35b1fe4b7feda2a32b7aa9
-static/js/runtime~main.a8a9905a.js.map,1592372919696,c337bf8b58896da637a6e50ab8cfc779eb1ec42c55f8ec429030a03454a549db
-static/js/main.97ebb589.chunk.js,1592372919636,9da75fb6ff9aa9d52d9b95ebb0f2b8a44a95fd009cac98d417ba54ada521028c
-static/css/main.93c33a43.chunk.css,1592372919642,20bf61433c569ccd069908c4e498759cb46dfccb12d8bf1aba9ccb8e61bd8b86
-static/js/main.97ebb589.chunk.js.map,1592372919691,4e0d27bd197db5e810b5999e9a41f2fabd426bf5913f193fac020119f1d61b6a
-static/css/main.93c33a43.chunk.css.map,1592372919696,a48d1e6da1a0ce76bde9786f2a1e10b880e0c11d0a38b09e296cfe0c4ac41c87
-static/js/2.186a91dc.chunk.js,1592372919690,000d797529029197f835136af981e23d365d8765d9e6349a8c232d30d070e73f
-static/js/2.186a91dc.chunk.js.map,1592372919695,6b57fb017c77e244464ce70b5ff3c1eb08354ce93ec43e08bc432220c2ebc135
+static/css/2.38695c78.chunk.css,1593590234878,df7c74b70fea8b04fd0985d5d2a2a2e7d14eb9920dbd0f99d131abbaf3fd44ce
+static/css/2.38695c78.chunk.css.map,1593590234878,aee7adea8d3da5aba91a0208f66abdbbfcad0c53c36e3e69a24c51de68e4f62d
+static/js/main.3dfc207e.chunk.js,1593590234823,6dde5417964af25079acd2bb4eed1a10548c26805d0bebd1df7a989968ac8b24
+static/js/runtime~main.a8a9905a.js,1593590234873,e1af5f94fdd13901b2e433d0d7607e27c01458151c35b1fe4b7feda2a32b7aa9
+static/js/runtime~main.a8a9905a.js.map,1593590234878,c337bf8b58896da637a6e50ab8cfc779eb1ec42c55f8ec429030a03454a549db
+static/css/main.93c33a43.chunk.css,1593590234817,20bf61433c569ccd069908c4e498759cb46dfccb12d8bf1aba9ccb8e61bd8b86
+static/js/main.3dfc207e.chunk.js.map,1593590234877,f81c9a69167a6e40f8e7c8f6111015a8d930e191c8b090584ea7b279b9afa69b
+static/css/main.93c33a43.chunk.css.map,1593590234872,a48d1e6da1a0ce76bde9786f2a1e10b880e0c11d0a38b09e296cfe0c4ac41c87
+static/js/2.186a91dc.chunk.js,1593590234873,000d797529029197f835136af981e23d365d8765d9e6349a8c232d30d070e73f
+static/js/2.186a91dc.chunk.js.map,1593590234877,6b57fb017c77e244464ce70b5ff3c1eb08354ce93ec43e08bc432220c2ebc135

src/components/GetDataSelection.js

@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { Col, Form, Button, Spinner, InputGroup, FormControl } from 'react-bootstrap';
 import moment from 'moment';
 import DateRangePicker from 'react-bootstrap-daterangepicker';
-import { FaRegCalendarAlt } from 'react-icons/fa';
+import { FaRegCalendarAlt, FaGalacticSenate } from 'react-icons/fa';
 import 'bootstrap-daterangepicker/daterangepicker.css';
 import { connect } from 'react-redux';
 import { getSelectedFeed } from '../redux/actions/selectedFeedAction';
@@ -30,7 +30,15 @@ class GetDataSelection extends Component {
 					.endOf('month'),
 			],
 		},
-		type: this.props.allLocationInfo[0].type
+		type: this.props.allLocationInfo[0].type,
+		disableMinutes: false,
+		disableHours: false,
+		disableDays: false,
+		disableWeeks: false,
+		disableMonths: false,
+		selectMin: true,
+		selectMiddle: false,
+		selectMax: false
 	};
 
 	submitSelectedRange = () => {
@@ -57,6 +65,64 @@ class GetDataSelection extends Component {
 			startDate: picker.startDate,
 			endDate: picker.endDate,
 		});
+		const startDateTimeStamp = moment(picker.startDate).valueOf();
+		const endDateTimeStamp = moment(picker.endDate).valueOf();
+		const oneDay = 24 * 60 * 60 * 1000; // hours*minutes*seconds*milliseconds
+
+		const diffDays = Math.round(Math.abs((startDateTimeStamp - endDateTimeStamp) / oneDay));
+		const dayMonth = 31
+		const dayYear = 366
+		if (diffDays <= dayMonth) {
+			if (this.state.selectMin != true) {
+				this.setState({
+					selectMin: true,
+					breakdown: "minutes",
+					selectMiddle: false,
+					selectMax: false
+				})
+			}
+			this.setState({
+				disableMinutes: false,
+				disableHours: false,
+				disableDays: false,
+				disableWeeks: false,
+				disableMonths: false
+			});
+		}
+		else if (diffDays > dayMonth && diffDays <= dayYear) {
+			if (this.state.selectMiddle != true) {
+				this.setState({
+					selectMiddle: true,
+					breakdown: "days",
+					selectMin: false,
+					selectMax: false
+				})
+			}
+			this.setState({
+				disableMinutes: true,
+				disableHours: true,
+				disableDays: false,
+				disableWeeks: false,
+				disableMonths: false
+			});
+		}
+		else {
+			if (this.state.selectMax != true) {
+				this.setState({
+					selectMax: true,
+					breakdown: "weeks",
+					selectMin: false,
+					selectMiddle: false
+				})
+			}
+			this.setState({
+				disableMinutes: true,
+				disableHours: true,
+				disableDays: true,
+				disableWeeks: false,
+				disableMonths: false
+			});
+		}
 	};
 
 	componentDidMount = () => {
@@ -69,6 +135,8 @@ class GetDataSelection extends Component {
 		}
 	};
 
+
+
 	render() {
 		const { allDeviceId, allDeviceInfo, allLocationId, allLocationInfo } = this.props;
 		let start = this.state.startDate.format('DD MMM YY');
@@ -125,16 +193,16 @@ class GetDataSelection extends Component {
 					<Col md={3}>
 						<Form.Control
 							as="select"
-							defaultValue={this.state.breakdown}
+							value={this.state.breakdown}
 							onChange={e => {
 								this.setState({ breakdown: e.target.value });
 							}}
 						>
-							<option value="minutes">Breakdown by minute</option>
-							<option value="hours">Breakdown by hour</option>
-							<option value="days">Breakdown by day</option>
-							<option value="weeks">Breakdown by week</option>
-							<option value="months">Breakdown by month</option>
+							<option value="minutes" disabled={this.state.disableMinutes}>Breakdown by minute</option>
+							<option value="hours" disabled={this.state.disableHours}>Breakdown by hour</option>
+							<option value="days" disabled={this.state.disableDays}>Breakdown by day</option>
+							<option value="weeks" disabled={this.state.disableWeeks}>Breakdown by week</option>
+							<option value="months" disabled={this.state.disableMonths}>Breakdown by month</option>
 						</Form.Control>
 					</Col>
 					<Col md={1}>

src/redux/actions/feedDataAction.js

@@ -52,6 +52,8 @@ export const getFeedData = () => async (dispatch, getState) => {
 				{ tag: 'Keycard', aggregator: 'sum' }
 			]
 		}
+		let newBreakdown = breakdown != "minutes" ? "hours" : breakdown
+		console.log("newBreakdown", newBreakdown)
 		attrList.forEach(element => {
 			const metric = {
 				name: device,
@@ -69,7 +71,7 @@ export const getFeedData = () => async (dispatch, getState) => {
 						name: element.aggregator,
 						sampling: {
 							value: 1,
-							unit: breakdown == "days" ? "hours" : breakdown
+							unit: newBreakdown
 						},
 					},
 				],