diff --git a/myems-web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js b/myems-web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js
index e26695c6eb..ea4c723b0f 100644
--- a/myems-web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js
+++ b/myems-web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js
@@ -230,7 +230,7 @@ const EnergyFlowDiagram = ({ setRedirect, setRedirectUrl, t }) => {
       setReportingPeriodDateRange([null, null]);
       setSubmitButtonDisabled(true);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationDetails.js b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationDetails.js
index 3fbdf7aa7c..b138fa5afc 100644
--- a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationDetails.js
+++ b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationDetails.js
@@ -1,28 +1,16 @@
 import React, { Fragment, useState, useEffect } from 'react';
-import {
-  Card,
-  CardBody,
-  Col,
-  CustomInput,
-  Form,
-  FormGroup,
-  Label,
-  Row,
-  Table,
-  Spinner,
-} from 'reactstrap';
+import { Card, CardBody, Col, CustomInput, Form, FormGroup, Label, Row, Table, Spinner } from 'reactstrap';
 import FalconCardHeader from '../../common/FalconCardHeader';
 import MultipleLineChart from '../common/MultipleLineChart';
 import { getCookieValue, createCookie, checkEmpty } from '../../../helpers/utils';
 import withRedirect from '../../../hoc/withRedirect';
 import { withTranslation } from 'react-i18next';
-import {v4 as uuid} from 'uuid';
+import { v4 as uuid } from 'uuid';
 import { APIBaseURL, settings } from '../../../config';
 import useInterval from '../../../hooks/useInterval';
 import { useLocation } from 'react-router-dom';
 import Datetime from 'react-datetime';
 
-
 const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) => {
   const location = useLocation();
   const energyStoragePowerStationUUID = location.search.split('=')[1];
@@ -33,7 +21,7 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
     let user_display_name = getCookieValue('user_display_name');
     let user_uuid = getCookieValue('user_uuid');
     let token = getCookieValue('token');
-    if (checkEmpty(is_logged_in) || checkEmpty(token)|| checkEmpty(user_uuid) || !is_logged_in) {
+    if (checkEmpty(is_logged_in) || checkEmpty(token) || checkEmpty(user_uuid) || !is_logged_in) {
       setRedirectUrl(`/authentication/basic/login`);
       setRedirect(true);
     } else {
@@ -57,7 +45,6 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
     return () => clearInterval(timer);
   }, [setRedirect, setRedirectUrl]);
 
-
   // State
   const [chargeStartTime1, setChargeStartTime1] = useState(null);
   const [chargeEndTime1, setChargeEndTime1] = useState(null);
@@ -109,134 +96,130 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
 
   useEffect(() => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-        '/reports/energystoragepowerstationdetails?uuid=' +
-        energyStoragePowerStationUUID, {
+    fetch(APIBaseURL + '/reports/energystoragepowerstationdetails?uuid=' + energyStoragePowerStationUUID, {
       method: 'GET',
       headers: {
         'Content-type': 'application/json',
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        console.log(json);
-        setEnergyStoragePowerStationName(json['energy_storage_power_station']['name']);
-        setEnergyStoragePowerStationAddress(json['energy_storage_power_station']['address']);
-        setEnergyStoragePowerStationPostalCode(json['energy_storage_power_station']['postal_code']);
-        setEnergyStoragePowerStationCapacity(json['energy_storage_power_station']['capacity']);
-        setEnergyStoragePowerStationLatitude(json['energy_storage_power_station']['latitude']);
-        setEnergyStoragePowerStationLongitude(json['energy_storage_power_station']['longitude']);
-        setEnergyStoragePowerStationSVG({__html: json['energy_storage_power_station']['svg']});
-        let timestamps = {}
-        json['parameters']['timestamps'].forEach((currentValue, index) => {
-          timestamps['a' + index] = currentValue;
-        });
-        setParameterLineChartLabels(timestamps);
-
-        let values = {}
-        json['parameters']['values'].forEach((currentValue, index) => {
-          values['a' + index] = currentValue;
-        });
-        setParameterLineChartData(values);
+      body: null
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          console.log(json);
+          setEnergyStoragePowerStationName(json['energy_storage_power_station']['name']);
+          setEnergyStoragePowerStationAddress(json['energy_storage_power_station']['address']);
+          setEnergyStoragePowerStationPostalCode(json['energy_storage_power_station']['postal_code']);
+          setEnergyStoragePowerStationCapacity(json['energy_storage_power_station']['capacity']);
+          setEnergyStoragePowerStationLatitude(json['energy_storage_power_station']['latitude']);
+          setEnergyStoragePowerStationLongitude(json['energy_storage_power_station']['longitude']);
+          setEnergyStoragePowerStationSVG({ __html: json['energy_storage_power_station']['svg'] });
+          let timestamps = {};
+          json['parameters']['timestamps'].forEach((currentValue, index) => {
+            timestamps['a' + index] = currentValue;
+          });
+          setParameterLineChartLabels(timestamps);
 
-        let names = Array();
-        json['parameters']['names'].forEach((currentValue, index) => {
+          let values = {};
+          json['parameters']['values'].forEach((currentValue, index) => {
+            values['a' + index] = currentValue;
+          });
+          setParameterLineChartData(values);
 
-          names.push({ 'value': 'a' + index, 'label': currentValue });
-        });
-        setParameterLineChartOptions(names);
+          let names = Array();
+          json['parameters']['names'].forEach((currentValue, index) => {
+            names.push({ value: 'a' + index, label: currentValue });
+          });
+          setParameterLineChartOptions(names);
 
-        setChargeStartTime1(json['schedule']['charge_start_time1'])
-        setChargeEndTime1(json['schedule']['charge_end_time1'])
-        setChargeStartTime2(json['schedule']['charge_start_time2'])
-        setChargeEndTime2(json['schedule']['charge_end_time2'])
-        setChargeStartTime3(json['schedule']['charge_start_time3'])
-        setChargeEndTime3(json['schedule']['charge_end_time3'])
-        setChargeStartTime4(json['schedule']['charge_start_time4'])
-        setChargeEndTime4(json['schedule']['charge_end_time4'])
+          setChargeStartTime1(json['schedule']['charge_start_time1']);
+          setChargeEndTime1(json['schedule']['charge_end_time1']);
+          setChargeStartTime2(json['schedule']['charge_start_time2']);
+          setChargeEndTime2(json['schedule']['charge_end_time2']);
+          setChargeStartTime3(json['schedule']['charge_start_time3']);
+          setChargeEndTime3(json['schedule']['charge_end_time3']);
+          setChargeStartTime4(json['schedule']['charge_start_time4']);
+          setChargeEndTime4(json['schedule']['charge_end_time4']);
 
-        setDischargeStartTime1(json['schedule']['discharge_start_time1'])
-        setDischargeEndTime1(json['schedule']['discharge_end_time1'])
-        setDischargeStartTime2(json['schedule']['discharge_start_time2'])
-        setDischargeEndTime2(json['schedule']['discharge_end_time2'])
-        setDischargeStartTime3(json['schedule']['discharge_start_time3'])
-        setDischargeEndTime3(json['schedule']['discharge_end_time3'])
-        setDischargeStartTime4(json['schedule']['discharge_start_time4'])
-        setDischargeEndTime4(json['schedule']['discharge_end_time4'])
+          setDischargeStartTime1(json['schedule']['discharge_start_time1']);
+          setDischargeEndTime1(json['schedule']['discharge_end_time1']);
+          setDischargeStartTime2(json['schedule']['discharge_start_time2']);
+          setDischargeEndTime2(json['schedule']['discharge_end_time2']);
+          setDischargeStartTime3(json['schedule']['discharge_start_time3']);
+          setDischargeEndTime3(json['schedule']['discharge_end_time3']);
+          setDischargeStartTime4(json['schedule']['discharge_start_time4']);
+          setDischargeEndTime4(json['schedule']['discharge_end_time4']);
 
-        setChargeStartTime1CommandID(json['schedule']['charge_start_time1_command_id'])
-        setChargeEndTime1CommandID(json['schedule']['charge_end_time1_command_id'])
-        setChargeStartTime2CommandID(json['schedule']['charge_start_time2_command_id'])
-        setChargeEndTime2CommandID(json['schedule']['charge_end_time2_command_id'])
-        setChargeStartTime3CommandID(json['schedule']['charge_start_time3_command_id'])
-        setChargeEndTime3CommandID(json['schedule']['charge_end_time3_command_id'])
-        setChargeStartTime4CommandID(json['schedule']['charge_start_time4_command_id'])
-        setChargeEndTime4CommandID(json['schedule']['charge_end_time4_command_id'])
+          setChargeStartTime1CommandID(json['schedule']['charge_start_time1_command_id']);
+          setChargeEndTime1CommandID(json['schedule']['charge_end_time1_command_id']);
+          setChargeStartTime2CommandID(json['schedule']['charge_start_time2_command_id']);
+          setChargeEndTime2CommandID(json['schedule']['charge_end_time2_command_id']);
+          setChargeStartTime3CommandID(json['schedule']['charge_start_time3_command_id']);
+          setChargeEndTime3CommandID(json['schedule']['charge_end_time3_command_id']);
+          setChargeStartTime4CommandID(json['schedule']['charge_start_time4_command_id']);
+          setChargeEndTime4CommandID(json['schedule']['charge_end_time4_command_id']);
 
-        setDischargeStartTime1CommandID(json['schedule']['discharge_start_time1_command_id'])
-        setDischargeEndTime1CommandID(json['schedule']['discharge_end_time1_command_id'])
-        setDischargeStartTime2CommandID(json['schedule']['discharge_start_time2_command_id'])
-        setDischargeEndTime2CommandID(json['schedule']['discharge_end_time2_command_id'])
-        setDischargeStartTime3CommandID(json['schedule']['discharge_start_time3_command_id'])
-        setDischargeEndTime3CommandID(json['schedule']['discharge_end_time3_command_id'])
-        setDischargeStartTime4CommandID(json['schedule']['discharge_start_time4_command_id'])
-        setDischargeEndTime4CommandID(json['schedule']['discharge_end_time4_command_id'])
-      }
-    })
-    .catch(err => {
-      console.log(err);
-    });
-  }, [energyStoragePowerStationUUID, ]);
+          setDischargeStartTime1CommandID(json['schedule']['discharge_start_time1_command_id']);
+          setDischargeEndTime1CommandID(json['schedule']['discharge_end_time1_command_id']);
+          setDischargeStartTime2CommandID(json['schedule']['discharge_start_time2_command_id']);
+          setDischargeEndTime2CommandID(json['schedule']['discharge_end_time2_command_id']);
+          setDischargeStartTime3CommandID(json['schedule']['discharge_start_time3_command_id']);
+          setDischargeEndTime3CommandID(json['schedule']['discharge_end_time3_command_id']);
+          setDischargeStartTime4CommandID(json['schedule']['discharge_start_time4_command_id']);
+          setDischargeEndTime4CommandID(json['schedule']['discharge_end_time4_command_id']);
+        }
+      })
+      .catch(err => {
+        console.log(err);
+      });
+  }, [energyStoragePowerStationUUID]);
 
   const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';
 
-  const refreshSVGData =()=> {
+  const refreshSVGData = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-        '/reports/pointrealtime', {
+    fetch(APIBaseURL + '/reports/pointrealtime', {
       method: 'GET',
       headers: {
         'Content-type': 'application/json',
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        console.log(json);
-        json.forEach((currentPoint) => {
-          let textElement=document.getElementById("PT"+currentPoint['point_id'])
-          if(textElement){
-            let tspanList = textElement.getElementsByTagName('tspan')
-            if (tspanList && tspanList.length > 0) {
-              let tspanElement = tspanList[tspanList.length - 1]
-              tspanElement.textContent = parseFloat(currentPoint['value']).toFixed(2)
-            } else {
-              textElement.textContent=parseFloat(currentPoint['value']).toFixed(2)
-            }
-          }
-        });
-      }
+      body: null
     })
-    .catch(err => {
-      console.log(err);
-    });
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          console.log(json);
+          json.forEach(currentPoint => {
+            let textElement = document.getElementById('PT' + currentPoint['point_id']);
+            if (textElement) {
+              let tspanList = textElement.getElementsByTagName('tspan');
+              if (tspanList && tspanList.length > 0) {
+                let tspanElement = tspanList[tspanList.length - 1];
+                tspanElement.textContent = parseFloat(currentPoint['value']).toFixed(2);
+              } else {
+                textElement.textContent = parseFloat(currentPoint['value']).toFixed(2);
+              }
+            }
+          });
+        }
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   useInterval(() => {
@@ -244,17 +227,13 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
   }, 1000 * 10);
 
   // Callback fired when ChargeStartTime1 change
-  const onChargeStartTime1Change = (moment) => {
+  const onChargeStartTime1Change = moment => {
     setChargeStartTime1(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime1 close
   const onChargeStartTime1Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-        '/commands/' +
-        chargeStartTime1CommandID +
-        '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeStartTime1CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -262,28 +241,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime1.substring(0, 2)) * 256 + parseInt(chargeStartTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime1.substring(0, 2)) * 256 + parseInt(chargeStartTime1.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime1 change
-  const onChargeEndTime1Change = (moment) => {
+  const onChargeEndTime1Change = moment => {
     setChargeEndTime1(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime1 close
   const onChargeEndTime1Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-        '/commands/' +
-        chargeEndTime1CommandID +
-        '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeEndTime1CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -291,28 +270,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime1.substring(0, 2)) * 256 + parseInt(chargeEndTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime1.substring(0, 2)) * 256 + parseInt(chargeEndTime1.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime1 change
-  const onDischargeStartTime1Change = (moment) => {
+  const onDischargeStartTime1Change = moment => {
     setDischargeStartTime1(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime1 close
   const onDischargeStartTime1Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-        '/commands/' +
-        dischargeStartTime1CommandID +
-        '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeStartTime1CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -320,27 +299,30 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime1.substring(0, 2)) * 256 + parseInt(dischargeStartTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime1.substring(0, 2)) * 256 + parseInt(dischargeStartTime1.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime1 change
-  const onDischargeEndTime1Change = (moment) => {
+  const onDischargeEndTime1Change = moment => {
     setDischargeEndTime1(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime1 close
   const onDischargeEndTime1Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-        '/commands/' +
-        dischargeEndTime1CommandID + '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeEndTime1CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -348,29 +330,31 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime1.substring(0, 2)) * 256 + parseInt(dischargeEndTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime1.substring(0, 2)) * 256 + parseInt(dischargeEndTime1.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   // Callback fired when ChargeStartTime2 change
-  const onChargeStartTime2Change = (moment) => {
+  const onChargeStartTime2Change = moment => {
     setChargeStartTime2(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime2 close
   const onChargeStartTime2Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      chargeStartTime2CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeStartTime2CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -378,28 +362,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime2.substring(0, 2)) * 256 + parseInt(chargeStartTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime2.substring(0, 2)) * 256 + parseInt(chargeStartTime2.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime2 change
-  const onChargeEndTime2Change = (moment) => {
+  const onChargeEndTime2Change = moment => {
     setChargeEndTime2(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime2 close
   const onChargeEndTime2Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      chargeEndTime2CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeEndTime2CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -407,28 +391,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime2.substring(0, 2)) * 256 + parseInt(chargeEndTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime2.substring(0, 2)) * 256 + parseInt(chargeEndTime2.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime2 change
-  const onDischargeStartTime2Change = (moment) => {
+  const onDischargeStartTime2Change = moment => {
     setDischargeStartTime2(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime2 close
   const onDischargeStartTime2Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      dischargeStartTime2CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeStartTime2CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -436,28 +420,30 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime2.substring(0, 2)) * 256 + parseInt(dischargeStartTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime2.substring(0, 2)) * 256 + parseInt(dischargeStartTime2.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime2 change
-  const onDischargeEndTime2Change = (moment) => {
+  const onDischargeEndTime2Change = moment => {
     setDischargeEndTime2(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime2 close
   const onDischargeEndTime2Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      dischargeEndTime2CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeEndTime2CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -465,29 +451,31 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime2.substring(0, 2)) * 256 + parseInt(dischargeEndTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime2.substring(0, 2)) * 256 + parseInt(dischargeEndTime2.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   // Callback fired when ChargeStartTime3 change
-  const onChargeStartTime3Change = (moment) => {
+  const onChargeStartTime3Change = moment => {
     setChargeStartTime3(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime3 close
   const onChargeStartTime3Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      chargeStartTime3CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeStartTime3CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -495,28 +483,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime3.substring(0, 2)) * 256 + parseInt(chargeStartTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime3.substring(0, 2)) * 256 + parseInt(chargeStartTime3.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime3 change
-  const onChargeEndTime3Change = (moment) => {
+  const onChargeEndTime3Change = moment => {
     setChargeEndTime3(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime3 close
   const onChargeEndTime3Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      chargeEndTime3CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeEndTime3CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -524,28 +512,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime3.substring(0, 2)) * 256 + parseInt(chargeEndTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime3.substring(0, 2)) * 256 + parseInt(chargeEndTime3.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime3 change
-  const onDischargeStartTime3Change = (moment) => {
+  const onDischargeStartTime3Change = moment => {
     setDischargeStartTime3(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime3 close
   const onDischargeStartTime3Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      dischargeStartTime3CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeStartTime3CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -553,28 +541,30 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime3.substring(0, 2)) * 256 + parseInt(dischargeStartTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime3.substring(0, 2)) * 256 + parseInt(dischargeStartTime3.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime3 change
-  const onDischargeEndTime3Change = (moment) => {
+  const onDischargeEndTime3Change = moment => {
     setDischargeEndTime3(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime3 close
   const onDischargeEndTime3Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      dischargeEndTime3CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeEndTime3CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -582,29 +572,31 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime3.substring(0, 2)) * 256 + parseInt(dischargeEndTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime3.substring(0, 2)) * 256 + parseInt(dischargeEndTime3.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   // Callback fired when ChargeStartTime4 change
-  const onChargeStartTime4Change = (moment) => {
+  const onChargeStartTime4Change = moment => {
     setChargeStartTime4(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime4 close
   const onChargeStartTime4Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      chargeStartTime4CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeStartTime4CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -612,28 +604,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime4.substring(0, 2)) * 256 + parseInt(chargeStartTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime4.substring(0, 2)) * 256 + parseInt(chargeStartTime4.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime4 change
-  const onChargeEndTime4Change = (moment) => {
+  const onChargeEndTime4Change = moment => {
     setChargeEndTime4(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime4 close
   const onChargeEndTime4Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      chargeEndTime4CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + chargeEndTime4CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -641,28 +633,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime4.substring(0, 2)) * 256 + parseInt(chargeEndTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime4.substring(0, 2)) * 256 + parseInt(chargeEndTime4.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime4 change
-  const onDischargeStartTime4Change = (moment) => {
+  const onDischargeStartTime4Change = moment => {
     setDischargeStartTime4(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime4 close
   const onDischargeStartTime4Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      dischargeStartTime4CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeStartTime4CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -670,28 +662,30 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime4.substring(0, 2)) * 256 + parseInt(dischargeStartTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime4.substring(0, 2)) * 256 + parseInt(dischargeStartTime4.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime4 change
-  const onDischargeEndTime4Change = (moment) => {
+  const onDischargeEndTime4Change = moment => {
     setDischargeEndTime4(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime4 close
   const onDischargeEndTime4Close = () => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/commands/' +
-      dischargeEndTime4CommandID +
-      '/send', {
+    fetch(APIBaseURL + '/commands/' + dischargeEndTime4CommandID + '/send', {
       method: 'PUT',
       headers: {
         'Content-type': 'application/json',
@@ -699,15 +693,21 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime4.substring(0, 2)) * 256 + parseInt(dischargeEndTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime4.substring(0, 2)) * 256 + parseInt(dischargeEndTime4.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   return (
@@ -721,39 +721,28 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
             <FalconCardHeader title={t('General Information')} light={false} titleClass="text-lightSlateGray mb-0" />
             <CardBody className="bg-light">
               <h6 className="mt-4">{t('Name')}</h6>
-              <div className="mb-1">
-                {energyStoragePowerStationName}
-              </div>
+              <div className="mb-1">{energyStoragePowerStationName}</div>
               <h6 className="mt-4">{t('Address')}</h6>
-              <div className="mb-1">
-                {energyStoragePowerStationAddress}
-              </div>
+              <div className="mb-1">{energyStoragePowerStationAddress}</div>
               <h6 className="mt-4">{t('Postal Code')}</h6>
-              <div className="mb-1">
-                {energyStoragePowerStationPostalCode}
-              </div>
+              <div className="mb-1">{energyStoragePowerStationPostalCode}</div>
               <h6 className="mt-4">{t('Capacity')} (kW)</h6>
-              <div className="mb-1">
-                {energyStoragePowerStationCapacity}
-              </div>
+              <div className="mb-1">{energyStoragePowerStationCapacity}</div>
               <h6 className="mt-4">{t('Latitude')}</h6>
-              <div className="mb-1">
-                {energyStoragePowerStationLatitude}
-              </div>
+              <div className="mb-1">{energyStoragePowerStationLatitude}</div>
               <h6 className="mt-4">{t('Longitude')}</h6>
-              <div className="mb-1">
-                {energyStoragePowerStationLongitude}
-              </div>
+              <div className="mb-1">{energyStoragePowerStationLongitude}</div>
             </CardBody>
           </Card>
         </Col>
       </Row>
-      <MultipleLineChart reportingTitle={t('Operating Characteristic Curve')}
-            baseTitle=''
-            labels={parameterLineChartLabels}
-            data={parameterLineChartData}
-            options={parameterLineChartOptions}>
-      </MultipleLineChart>
+      <MultipleLineChart
+        reportingTitle={t('Operating Characteristic Curve')}
+        baseTitle=""
+        labels={parameterLineChartLabels}
+        data={parameterLineChartData}
+        options={parameterLineChartOptions}
+      />
       <Card className="mb-3 fs--1">
         <FalconCardHeader title={t('Charging Schedule')} light={false} titleClass="text-lightSlateGray mb-0" />
         <CardBody className="bg-light">
@@ -770,31 +759,159 @@ const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) =>
             <tbody>
               <tr>
                 <th scope="row">1</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime1} onChange={onChargeStartTime1Change} onClose={onChargeStartTime1Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime1} onChange={onChargeEndTime1Change}  onClose={onChargeEndTime1Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime1} onChange={onDischargeStartTime1Change} onClose={onDischargeStartTime1Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime1} onChange={onDischargeEndTime1Change} onClose={onDischargeEndTime1Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime1}
+                    onChange={onChargeStartTime1Change}
+                    onClose={onChargeStartTime1Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime1}
+                    onChange={onChargeEndTime1Change}
+                    onClose={onChargeEndTime1Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime1}
+                    onChange={onDischargeStartTime1Change}
+                    onClose={onDischargeStartTime1Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime1}
+                    onChange={onDischargeEndTime1Change}
+                    onClose={onDischargeEndTime1Close}
+                  />
+                </td>
               </tr>
               <tr>
                 <th scope="row">2</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime2} onChange={onChargeStartTime2Change} onClose={onChargeStartTime2Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime2} onChange={onChargeEndTime2Change} onClose={onChargeEndTime2Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime2} onChange={onDischargeStartTime2Change} onClose={onDischargeStartTime2Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime2} onChange={onDischargeEndTime2Change} onClose={onDischargeEndTime2Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime2}
+                    onChange={onChargeStartTime2Change}
+                    onClose={onChargeStartTime2Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime2}
+                    onChange={onChargeEndTime2Change}
+                    onClose={onChargeEndTime2Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime2}
+                    onChange={onDischargeStartTime2Change}
+                    onClose={onDischargeStartTime2Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime2}
+                    onChange={onDischargeEndTime2Change}
+                    onClose={onDischargeEndTime2Close}
+                  />
+                </td>
               </tr>
               <tr>
                 <th scope="row">3</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime3} onChange={onChargeStartTime3Change} onClose={onChargeStartTime3Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime3} onChange={onChargeEndTime3Change} onClose={onChargeEndTime3Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime3} onChange={onDischargeStartTime3Change} onClose={onDischargeStartTime3Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime3} onChange={onDischargeEndTime3Change} onClose={onDischargeEndTime3Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime3}
+                    onChange={onChargeStartTime3Change}
+                    onClose={onChargeStartTime3Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime3}
+                    onChange={onChargeEndTime3Change}
+                    onClose={onChargeEndTime3Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime3}
+                    onChange={onDischargeStartTime3Change}
+                    onClose={onDischargeStartTime3Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime3}
+                    onChange={onDischargeEndTime3Change}
+                    onClose={onDischargeEndTime3Close}
+                  />
+                </td>
               </tr>
               <tr>
                 <th scope="row">4</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime4} onChange={onChargeStartTime4Change} onClose={onChargeStartTime4Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime4} onChange={onChargeEndTime4Change} onClose={onChargeEndTime4Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime4} onChange={onDischargeStartTime4Change} onClose={onDischargeStartTime4Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime4} onChange={onDischargeEndTime4Change} onClose={onDischargeEndTime4Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime4}
+                    onChange={onChargeStartTime4Change}
+                    onClose={onChargeStartTime4Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime4}
+                    onChange={onChargeEndTime4Change}
+                    onClose={onChargeEndTime4Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime4}
+                    onChange={onDischargeStartTime4Change}
+                    onClose={onDischargeStartTime4Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime4}
+                    onChange={onDischargeEndTime4Change}
+                    onClose={onDischargeEndTime4Close}
+                  />
+                </td>
               </tr>
             </tbody>
           </Table>
diff --git a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationList.js b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationList.js
index d886332d7c..aeafaf0424 100644
--- a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationList.js
+++ b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationList.js
@@ -13,7 +13,7 @@ import {
   FormGroup,
   Input,
   Label,
-  Spinner,
+  Spinner
 } from 'reactstrap';
 import Loader from '../../common/Loader';
 import { isIterableArray } from '../../../helpers/utils';
@@ -29,7 +29,6 @@ import { toast } from 'react-toastify';
 import { APIBaseURL, settings } from '../../../config';
 import CustomizeMapBox from '../common/CustomizeMapBox';
 
-
 const EnergyStoragePowerStationList = ({ setRedirect, setRedirectUrl, t }) => {
   useEffect(() => {
     let is_logged_in = getCookieValue('is_logged_in');
@@ -37,7 +36,7 @@ const EnergyStoragePowerStationList = ({ setRedirect, setRedirectUrl, t }) => {
     let user_display_name = getCookieValue('user_display_name');
     let user_uuid = getCookieValue('user_uuid');
     let token = getCookieValue('token');
-    if (checkEmpty(is_logged_in) || checkEmpty(token)|| checkEmpty(user_uuid) || !is_logged_in) {
+    if (checkEmpty(is_logged_in) || checkEmpty(token) || checkEmpty(user_uuid) || !is_logged_in) {
       setRedirectUrl(`/authentication/basic/login`);
       setRedirect(true);
     } else {
@@ -71,89 +70,90 @@ const EnergyStoragePowerStationList = ({ setRedirect, setRedirectUrl, t }) => {
 
   useEffect(() => {
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/reports/energystoragepowerstationlist', {
+    fetch(APIBaseURL + '/reports/energystoragepowerstationlist', {
       method: 'GET',
       headers: {
         'Content-type': 'application/json',
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      console.log(response);
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      console.log(json);
-      if (isResponseOK) {
+      body: null
+    })
+      .then(response => {
+        console.log(response);
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
         console.log(json);
-        setEnergyStoragePowerStationArray([]);
-        setEnergyStoragePowerStationIds([]);
-        let energyStoragePowerStationArray = [];
-        let energyStoragePowerStationIds = [];
-        let geojsonData = [];
-        if (json.length > 0) {
-          setRootLongitude(json[0]['longitude']);
-          setRootLatitude(json[0]['latitude']);
-          json.forEach((currentValue, index) => {
-            let energyStoragePowerStation = {}
-            energyStoragePowerStation['id'] = json[index]['id'];
-            energyStoragePowerStation['name'] = json[index]['name'];
-            energyStoragePowerStation['uuid'] = json[index]['uuid'];
-            energyStoragePowerStation['address'] = json[index]['address'];
-            energyStoragePowerStation['postal_code'] = json[index]['postal_code'];
-            energyStoragePowerStation['latitude'] = json[index]['latitude'];
-            energyStoragePowerStation['longitude'] = json[index]['longitude'];
-            energyStoragePowerStation['serial_number'] = json[index]['serial_number'];
-            energyStoragePowerStation['files'] = [{ id: json[index]['uuid'], src: require('./EnergyStoragePowerStation.jpeg'), }];
-            energyStoragePowerStation['batteryOperatingState'] = json[index]['battery_operating_state'];
-            energyStoragePowerStation['batterySocPointValue'] = json[index]['battery_soc_point_value'];
-            energyStoragePowerStation['batteryPowerPointValue'] = json[index]['battery_power_point_value'];
-            energyStoragePowerStation['photovoltaicPowerPointValue'] = json[index]['photovoltaic_power_point_value'];
-            energyStoragePowerStation['loadPowerPointValue'] = json[index]['load_power_point_value'];
-            energyStoragePowerStation['gridPowerPointValue'] = json[index]['grid_power_point_value'];
-            energyStoragePowerStation['PCSRunState'] = json[index]['pcs_run_state'];
-            energyStoragePowerStation['alarms'] = ['supply temperature is high', 'return temperature is low'];
-            energyStoragePowerStation['isOnline'] = json[index]['is_online'];
-
-            energyStoragePowerStationArray.push(energyStoragePowerStation);
-            energyStoragePowerStationIds.push(energyStoragePowerStation['id']);
-            geojsonData.push({
-              'type': 'Feature',
-              'geometry': {
-                'type': 'Point',
-                'coordinates': [json[index]['longitude'], json[index]['latitude']]
+        if (isResponseOK) {
+          console.log(json);
+          setEnergyStoragePowerStationArray([]);
+          setEnergyStoragePowerStationIds([]);
+          let energyStoragePowerStationArray = [];
+          let energyStoragePowerStationIds = [];
+          let geojsonData = [];
+          if (json.length > 0) {
+            setRootLongitude(json[0]['longitude']);
+            setRootLatitude(json[0]['latitude']);
+            json.forEach((currentValue, index) => {
+              let energyStoragePowerStation = {};
+              energyStoragePowerStation['id'] = json[index]['id'];
+              energyStoragePowerStation['name'] = json[index]['name'];
+              energyStoragePowerStation['uuid'] = json[index]['uuid'];
+              energyStoragePowerStation['address'] = json[index]['address'];
+              energyStoragePowerStation['postal_code'] = json[index]['postal_code'];
+              energyStoragePowerStation['latitude'] = json[index]['latitude'];
+              energyStoragePowerStation['longitude'] = json[index]['longitude'];
+              energyStoragePowerStation['serial_number'] = json[index]['serial_number'];
+              energyStoragePowerStation['files'] = [
+                { id: json[index]['uuid'], src: require('./EnergyStoragePowerStation.jpeg') }
+              ];
+              energyStoragePowerStation['batteryOperatingState'] = json[index]['battery_operating_state'];
+              energyStoragePowerStation['batterySocPointValue'] = json[index]['battery_soc_point_value'];
+              energyStoragePowerStation['batteryPowerPointValue'] = json[index]['battery_power_point_value'];
+              energyStoragePowerStation['photovoltaicPowerPointValue'] = json[index]['photovoltaic_power_point_value'];
+              energyStoragePowerStation['loadPowerPointValue'] = json[index]['load_power_point_value'];
+              energyStoragePowerStation['gridPowerPointValue'] = json[index]['grid_power_point_value'];
+              energyStoragePowerStation['PCSRunState'] = json[index]['pcs_run_state'];
+              energyStoragePowerStation['alarms'] = ['supply temperature is high', 'return temperature is low'];
+              energyStoragePowerStation['isOnline'] = json[index]['is_online'];
+
+              energyStoragePowerStationArray.push(energyStoragePowerStation);
+              energyStoragePowerStationIds.push(energyStoragePowerStation['id']);
+              geojsonData.push({
+                type: 'Feature',
+                geometry: {
+                  type: 'Point',
+                  coordinates: [json[index]['longitude'], json[index]['latitude']]
                 },
-              'properties': {
-                'title': json[index]['name'],
-                'description': json[index]['description'],
-                'uuid': json[index]['uuid'],
-                'url': '/energystoragepowerstation/details'
+                properties: {
+                  title: json[index]['name'],
+                  description: json[index]['description'],
+                  uuid: json[index]['uuid'],
+                  url: '/energystoragepowerstation/details'
                 }
-            })
-          });
+              });
+            });
+          }
+          setEnergyStoragePowerStationArray(energyStoragePowerStationArray);
+          setEnergyStoragePowerStationIds(energyStoragePowerStationIds);
+          console.log('energyStoragePowerStationArray:');
+          console.log(energyStoragePowerStationArray);
+          console.log('energyStoragePowerStationIds:');
+          console.log(energyStoragePowerStationIds);
+          setIsLoading(false);
+          setGeojson(geojsonData);
+        } else {
+          toast.error(t(json.description));
         }
-        setEnergyStoragePowerStationArray(energyStoragePowerStationArray);
-        setEnergyStoragePowerStationIds(energyStoragePowerStationIds);
-        console.log('energyStoragePowerStationArray:');
-        console.log(energyStoragePowerStationArray);
-        console.log('energyStoragePowerStationIds:');
-        console.log(energyStoragePowerStationIds);
-        setIsLoading(false);
-        setGeojson(geojsonData);
-      } else {
-        toast.error(t(json.description));
-      }
-    }).catch(err => {
-      console.log(err);
-    });
-
-  }, [t, ]);
+      })
+      .catch(err => {
+        console.log(err);
+      });
+  }, [t]);
 
   const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';
 
@@ -165,35 +165,43 @@ const EnergyStoragePowerStationList = ({ setRedirect, setRedirectUrl, t }) => {
   };
 
   // Hook
-  const { data: paginationData, meta: paginationMeta, handler: paginationHandler } = usePagination(energyStoragePowerStationIds);
+  const { data: paginationData, meta: paginationMeta, handler: paginationHandler } = usePagination(
+    energyStoragePowerStationIds
+  );
   const { total, itemsPerPage, from, to } = paginationMeta;
   const { perPage } = paginationHandler;
 
   const isList = true;
   const isGrid = false;
 
-
   return (
     <Fragment>
       <Card>
         <CardBody className={classNames({ 'p-0  overflow-hidden': isList, 'pb-0': isGrid })}>
           <Row>
             <Col xs={8}>
-            {isLoading ? (
-              <Loader />
-            ) : (
+              {isLoading ? (
+                <Loader />
+              ) : (
                 <Row noGutters={isList}>
                   {isIterableArray(energyStoragePowerStationArray) &&
                     energyStoragePowerStationArray
                       .filter(energyStoragePowerStation => paginationData.includes(energyStoragePowerStation.id))
-                      .map((energyStoragePowerStation, index) => <EnergyStoragePowerStationListItem {...energyStoragePowerStation} sliderSettings={sliderSettings} key={energyStoragePowerStation.id} index={index} />)}
+                      .map((energyStoragePowerStation, index) => (
+                        <EnergyStoragePowerStationListItem
+                          {...energyStoragePowerStation}
+                          sliderSettings={sliderSettings}
+                          key={energyStoragePowerStation.id}
+                          index={index}
+                        />
+                      ))}
                 </Row>
               )}
             </Col>
             <Col>
-              <CustomizeMapBox Latitude={rootLatitude} Longitude={rootLongitude} Zoom={10} Geojson={geojson}></CustomizeMapBox>
+              <CustomizeMapBox Latitude={rootLatitude} Longitude={rootLongitude} Zoom={10} Geojson={geojson} />
             </Col>
-            </Row>
+          </Row>
         </CardBody>
         <EnergyStoragePowerStationFooter meta={paginationMeta} handler={paginationHandler} />
       </Card>
@@ -201,9 +209,7 @@ const EnergyStoragePowerStationList = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody>
           <Row className="justify-content-between align-items-center">
             <Col sm="auto" className="mb-2 mb-sm-0" tag={Flex} align="center">
-              <h6 className="mb-0 text-nowrap ml-2">
-                {t('Show Up to')}
-              </h6>
+              <h6 className="mb-0 text-nowrap ml-2">{t('Show Up to')}</h6>
               <CustomInput
                 id="itemsPerPage"
                 type="select"
@@ -216,11 +222,8 @@ const EnergyStoragePowerStationList = ({ setRedirect, setRedirectUrl, t }) => {
                 <option value={20}>20</option>
                 <option value={total}>{t('All')}</option>
               </CustomInput>
-              <h6 className="mb-0 text-nowrap ml-2">
-                {t('FROM - TO of TOTAL', { 'FROM': from, 'TO': to, 'TOTAL': total })}
-              </h6>
+              <h6 className="mb-0 text-nowrap ml-2">{t('FROM - TO of TOTAL', { FROM: from, TO: to, TOTAL: total })}</h6>
             </Col>
-
           </Row>
         </CardBody>
       </Card>
diff --git a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationListItem.js b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationListItem.js
index 65a52f126a..d5123f5ee4 100644
--- a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationListItem.js
+++ b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationListItem.js
@@ -32,7 +32,7 @@ const EnergyStoragePowerStationListItem = ({
   t
 }) => {
   const { isDark } = useContext(AppContext);
-  const {  favouriteItemsDispatch } = useContext(ProductContext);
+  const { favouriteItemsDispatch } = useContext(ProductContext);
   const [cartLoading, setCartLoading] = useState(false);
 
   const handleAddToCart = () => {
@@ -48,15 +48,25 @@ const EnergyStoragePowerStationListItem = ({
         <Row>
           <Col sm={5} md={4}>
             <div className="position-relative h-sm-100">
-              <Link className="d-block h-100" to={`/energystoragepowerstation/details?uuid=${uuid}`} target = "_blank">
+              <Link className="d-block h-100" to={`/energystoragepowerstation/details?uuid=${uuid}`} target="_blank">
                 <img
                   className="img-fluid fit-cover w-sm-100 h-sm-100 rounded absolute-sm-centered"
-                      src={files[0]['src']}
+                  src={files[0]['src']}
                 />
-                </Link>
+              </Link>
               {isOnline && (
                 <Badge color="success" pill className="position-absolute t-0 r-0 mr-2 mt-2 fs--2 z-index-2">
-                  {PCSRunState === 'Running' ? t('PCS Running') : PCSRunState === 'Initializing' ? t('PCS Initializing') : PCSRunState === 'Standby' ? t('PCS Standby') : PCSRunState === 'Shutdown' ? t('PCS Shutdown') : PCSRunState === 'Fault' ? t('PCS Fault') : t('PCS Unknown')}
+                  {PCSRunState === 'Running'
+                    ? t('PCS Running')
+                    : PCSRunState === 'Initializing'
+                    ? t('PCS Initializing')
+                    : PCSRunState === 'Standby'
+                    ? t('PCS Standby')
+                    : PCSRunState === 'Shutdown'
+                    ? t('PCS Shutdown')
+                    : PCSRunState === 'Fault'
+                    ? t('PCS Fault')
+                    : t('PCS Unknown')}
                 </Badge>
               )}
             </div>
@@ -65,50 +75,89 @@ const EnergyStoragePowerStationListItem = ({
             <Row>
               <Col lg={7}>
                 <h5 className="mt-3 mt-sm-0">
-                  <Link to={`/energystoragepowerstation/details?uuid=${uuid}`} target = "_blank">{name}</Link>
+                  <Link to={`/energystoragepowerstation/details?uuid=${uuid}`} target="_blank">
+                    {name}
+                  </Link>
                 </h5>
-                <p className="fs--1 mb-2 mb-md-3">
-                    {address}
-                </p>
-                <p className="fs--1 mb-2 mb-md-3">
-                    {postal_code}
-                </p>
-                <p className="fs--1 mb-2 mb-md-3">
-                    {serial_number}
-                </p>
+                <p className="fs--1 mb-2 mb-md-3">{address}</p>
+                <p className="fs--1 mb-2 mb-md-3">{postal_code}</p>
+                <p className="fs--1 mb-2 mb-md-3">{serial_number}</p>
                 <div className="d-none d-lg-block">
-                    <p className="fs--1 mb-1">{t('Battery Power')}:<strong>{batteryPowerPointValue} kW</strong></p>
-                    <p className="fs--1 mb-1">{t('Grid Power')}:<strong>{gridPowerPointValue} kW</strong></p>
-                    {/* <p className="fs--1 mb-1">{t('Photovoltaic Power')}:<strong>{photovoltaicPowerPointValue} kW</strong></p>
+                  <p className="fs--1 mb-1">
+                    {t('Battery Power')}:<strong>{batteryPowerPointValue} kW</strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('Grid Power')}:<strong>{gridPowerPointValue} kW</strong>
+                  </p>
+                  {/* <p className="fs--1 mb-1">{t('Photovoltaic Power')}:<strong>{photovoltaicPowerPointValue} kW</strong></p>
                     <p className="fs--1 mb-1">{t('Load Power')}:<strong>{loadPowerPointValue} kW</strong></p> */}
-                  </div>
+                </div>
               </Col>
               <Col lg={5} tag={Flex} justify="between" column>
                 <div>
-                  <h4 className="fs-1 fs-md-2 text-warning mb-0">
-                    SoC: {batterySocPointValue} %
-                  </h4>
+                  <h4 className="fs-1 fs-md-2 text-warning mb-0">SoC: {batterySocPointValue} %</h4>
                   <p className="fs--1 mb-1">
-                      {t('Communication Status')}:{' '}
-                      <strong className={classNames({ 'text-success': isOnline, 'text-danger': !isOnline })}>
-                        {isOnline ? t('Communication Online') : t('Communication Offline')}
-                      </strong>
-                    </p>
-                    <p className="fs--1 mb-1">
-                      {t('Battery Operating State')}:{' '}
-                      <strong className={classNames({ 'text-success': batteryOperatingState === 'Normal' || batteryOperatingState === 'Standby'  || batteryOperatingState === 'ProhibitDisCharging' || batteryOperatingState === 'ProhibitCharging',
-                      'text-danger':  batteryOperatingState === 'Unknown' || batteryOperatingState === 'Fault' || batteryOperatingState === 'Warning'})}>
-                        {batteryOperatingState === 'Normal' ? t('Battery Normal') : batteryOperatingState === 'Standby' ? t('Battery Standby') : batteryOperatingState === 'ProhibitDisCharging' ? t('Battery Prohibit DisCharging') : batteryOperatingState === 'ProhibitCharging' ? t('Battery Prohibit Charging') : batteryOperatingState === 'Fault' ? t('Battery Fault') : batteryOperatingState === 'Warning' ? t('Battery Warning') : t('Battery Unknown')}
-                      </strong>
-                    </p>
-                    <p className="fs--1 mb-1">
-                      {t('PCS Run State')}:{' '}
-                      <strong className={classNames({ 'text-success': PCSRunState === 'Running',
-                      'text-danger':  PCSRunState === 'Unknown' || PCSRunState === 'Initializing' || PCSRunState === 'Standby' || PCSRunState === 'Shutdown' || PCSRunState === 'Fault'})}>
-                        {PCSRunState === 'Running' ? t('PCS Running') : PCSRunState === 'Initializing' ? t('PCS Initializing') : PCSRunState === 'Standby' ? t('PCS Standby') : PCSRunState === 'Shutdown' ? t('PCS Shutdown') : PCSRunState === 'Fault' ? t('PCS Fault') : t('PCS Unknown')}
-                      </strong>
-                    </p>
-
+                    {t('Communication Status')}:{' '}
+                    <strong className={classNames({ 'text-success': isOnline, 'text-danger': !isOnline })}>
+                      {isOnline ? t('Communication Online') : t('Communication Offline')}
+                    </strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('Battery Operating State')}:{' '}
+                    <strong
+                      className={classNames({
+                        'text-success':
+                          batteryOperatingState === 'Normal' ||
+                          batteryOperatingState === 'Standby' ||
+                          batteryOperatingState === 'ProhibitDisCharging' ||
+                          batteryOperatingState === 'ProhibitCharging',
+                        'text-danger':
+                          batteryOperatingState === 'Unknown' ||
+                          batteryOperatingState === 'Fault' ||
+                          batteryOperatingState === 'Warning'
+                      })}
+                    >
+                      {batteryOperatingState === 'Normal'
+                        ? t('Battery Normal')
+                        : batteryOperatingState === 'Standby'
+                        ? t('Battery Standby')
+                        : batteryOperatingState === 'ProhibitDisCharging'
+                        ? t('Battery Prohibit DisCharging')
+                        : batteryOperatingState === 'ProhibitCharging'
+                        ? t('Battery Prohibit Charging')
+                        : batteryOperatingState === 'Fault'
+                        ? t('Battery Fault')
+                        : batteryOperatingState === 'Warning'
+                        ? t('Battery Warning')
+                        : t('Battery Unknown')}
+                    </strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('PCS Run State')}:{' '}
+                    <strong
+                      className={classNames({
+                        'text-success': PCSRunState === 'Running',
+                        'text-danger':
+                          PCSRunState === 'Unknown' ||
+                          PCSRunState === 'Initializing' ||
+                          PCSRunState === 'Standby' ||
+                          PCSRunState === 'Shutdown' ||
+                          PCSRunState === 'Fault'
+                      })}
+                    >
+                      {PCSRunState === 'Running'
+                        ? t('PCS Running')
+                        : PCSRunState === 'Initializing'
+                        ? t('PCS Initializing')
+                        : PCSRunState === 'Standby'
+                        ? t('PCS Standby')
+                        : PCSRunState === 'Shutdown'
+                        ? t('PCS Shutdown')
+                        : PCSRunState === 'Fault'
+                        ? t('PCS Fault')
+                        : t('PCS Unknown')}
+                    </strong>
+                  </p>
                 </div>
                 <div className="mt-md-2">
                   <ButtonIcon
@@ -138,7 +187,7 @@ const EnergyStoragePowerStationListItem = ({
                       'border-300': !isOnline
                     })}
                     icon={[isOnline ? 'fas' : 'far', 'exclamation-triangle']}
-                      onClick={() => window.open('notification', '_blank')}
+                    onClick={() => window.open('notification', '_blank')}
                   >
                     {t('Fault Alarms')}({alarms.length})
                   </ButtonIcon>
@@ -153,7 +202,6 @@ const EnergyStoragePowerStationListItem = ({
                   >
                     {t('Maintenance')}
                   </ButtonIcon>
-
                 </div>
               </Col>
             </Row>
diff --git a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationReporting.js b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationReporting.js
index 3ba60fcfa7..0a10f4502c 100644
--- a/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationReporting.js
+++ b/myems-web/src/components/MyEMS/EnergyStoragePowerStation/EnergyStoragePowerStationReporting.js
@@ -30,9 +30,9 @@ import ButtonIcon from '../../common/ButtonIcon';
 import { APIBaseURL, settings } from '../../../config';
 import { periodTypeOptions } from '../common/PeriodTypeOptions';
 import { comparisonTypeOptions } from '../common/ComparisonTypeOptions';
-import { endOfDay} from 'date-fns';
+import { endOfDay } from 'date-fns';
 import AppContext from '../../../context/Context';
-import {Link, useLocation} from 'react-router-dom';
+import { Link, useLocation } from 'react-router-dom';
 import DateRangePickerWrapper from '../common/DateRangePickerWrapper';
 
 const DetailedDataTable = loadable(() => import('../common/DetailedDataTable'));
@@ -48,7 +48,7 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
     let user_display_name = getCookieValue('user_display_name');
     let user_uuid = getCookieValue('user_uuid');
     let token = getCookieValue('token');
-    if (checkEmpty(is_logged_in) || checkEmpty(token)|| checkEmpty(user_uuid) || !is_logged_in) {
+    if (checkEmpty(is_logged_in) || checkEmpty(token) || checkEmpty(user_uuid) || !is_logged_in) {
       setRedirectUrl(`/authentication/basic/login`);
       setRedirect(true);
     } else {
@@ -59,7 +59,7 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
       createCookie('user_uuid', user_uuid, settings.cookieExpireTime);
       createCookie('token', token, settings.cookieExpireTime);
     }
-    if (uuid === null || !uuid ){
+    if (uuid === null || !uuid) {
       setSpaceCascaderHidden(false);
       setEnergyStoragePowerStationSearchHidden(false);
     } else {
@@ -78,9 +78,25 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
   const [comparisonType, setComparisonType] = useState('month-on-month');
   const [periodType, setPeriodType] = useState('daily');
   const [cascaderOptions, setCascaderOptions] = useState(undefined);
-  const [basePeriodDateRange, setBasePeriodDateRange] = useState([current_moment.clone().subtract(1, 'weeks').subtract(1, 'months').toDate(), current_moment.clone().subtract(1, 'months').toDate()]);
+  const [basePeriodDateRange, setBasePeriodDateRange] = useState([
+    current_moment
+      .clone()
+      .subtract(1, 'weeks')
+      .subtract(1, 'months')
+      .toDate(),
+    current_moment
+      .clone()
+      .subtract(1, 'months')
+      .toDate()
+  ]);
   const [basePeriodDateRangePickerDisabled, setBasePeriodDateRangePickerDisabled] = useState(true);
-  const [reportingPeriodDateRange, setReportingPeriodDateRange] = useState([current_moment.clone().subtract(1, 'weeks').toDate(), current_moment.toDate()]);
+  const [reportingPeriodDateRange, setReportingPeriodDateRange] = useState([
+    current_moment
+      .clone()
+      .subtract(1, 'weeks')
+      .toDate(),
+    current_moment.toDate()
+  ]);
   const dateRangePickerLocale = {
     sunday: t('sunday'),
     monday: t('monday'),
@@ -98,7 +114,7 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
     last7Days: t('last7Days'),
     formattedMonthPattern: 'yyyy-MM-dd'
   };
-  const dateRangePickerStyle = { display: 'block', zIndex: 10};
+  const dateRangePickerStyle = { display: 'block', zIndex: 10 };
   const { language } = useContext(AppContext);
   // buttons
   const [submitButtonDisabled, setSubmitButtonDisabled] = useState(true);
@@ -117,117 +133,140 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
   const [energyStoragePowerStationSVG, setEnergyStoragePowerStationSVG] = useState();
 
   const [cardSummaryList, setCardSummaryList] = useState([]);
-  const [energyStoragePowerStationBaseLabels, setEnergyStoragePowerStationBaseLabels] = useState({'a0': []});
-  const [energyStoragePowerStationBaseData, setEnergyStoragePowerStationBaseData] = useState({'a0': []});
-  const [energyStoragePowerStationReportingNames, setEnergyStoragePowerStationReportingNames] = useState({"a0":""});
-  const [energyStoragePowerStationReportingUnits, setEnergyStoragePowerStationReportingUnits] = useState({"a0":"()"});
-  const [energyStoragePowerStationReportingSubtotals, setEnergyStoragePowerStationReportingSubtotals] = useState({"a0": (0).toFixed(2)});
-  const [energyStoragePowerStationReportingLabels, setEnergyStoragePowerStationReportingLabels] = useState({"a0": []});
-  const [energyStoragePowerStationReportingData, setEnergyStoragePowerStationReportingData] = useState({"a0": []});
+  const [energyStoragePowerStationBaseLabels, setEnergyStoragePowerStationBaseLabels] = useState({ a0: [] });
+  const [energyStoragePowerStationBaseData, setEnergyStoragePowerStationBaseData] = useState({ a0: [] });
+  const [energyStoragePowerStationReportingNames, setEnergyStoragePowerStationReportingNames] = useState({ a0: '' });
+  const [energyStoragePowerStationReportingUnits, setEnergyStoragePowerStationReportingUnits] = useState({ a0: '()' });
+  const [energyStoragePowerStationReportingSubtotals, setEnergyStoragePowerStationReportingSubtotals] = useState({
+    a0: (0).toFixed(2)
+  });
+  const [energyStoragePowerStationReportingLabels, setEnergyStoragePowerStationReportingLabels] = useState({ a0: [] });
+  const [energyStoragePowerStationReportingData, setEnergyStoragePowerStationReportingData] = useState({ a0: [] });
   const [energyStoragePowerStationReportingOptions, setEnergyStoragePowerStationReportingOptions] = useState([]);
   const [parameterLineChartLabels, setParameterLineChartLabels] = useState([]);
   const [parameterLineChartData, setParameterLineChartData] = useState({});
   const [parameterLineChartOptions, setParameterLineChartOptions] = useState([]);
-  const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]);
+  const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([
+    { dataField: 'startdatetime', text: t('Datetime'), sort: true }
+  ]);
   const [detailedDataTableData, setDetailedDataTableData] = useState([]);
   const [excelBytesBase64, setExcelBytesBase64] = useState(undefined);
 
   useEffect(() => {
     let isResponseOK = false;
-    if (uuid === null || !uuid ){
-      fetch(
-        APIBaseURL +
-        '/spaces/tree', {
+    if (uuid === null || !uuid) {
+      fetch(APIBaseURL + '/spaces/tree', {
         method: 'GET',
         headers: {
           'Content-type': 'application/json',
           'User-UUID': getCookieValue('user_uuid'),
           Token: getCookieValue('token')
         },
-        body: null,
-
-      }).then(response => {
-        console.log(response);
-        if (response.ok) {
-          isResponseOK = true;
-        }
-        return response.json();
-      }).then(json => {
-        console.log(json);
-        if (isResponseOK) {
-          // rename keys
-          json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
-          setCascaderOptions(json);
-          setSelectedSpaceName([json[0]].map(o => o.label));
-          setSelectedSpaceID([json[0]].map(o => o.value));
-          // get EnergyStoragePowerStations by root Space ID
-          let isResponseOK = false;
-          fetch(
-            APIBaseURL +
-            '/spaces/' +
-            [json[0]].map(o => o.value) +
-            '/energystoragepowerstations', {
-            method: 'GET',
-            headers: {
-              'Content-type': 'application/json',
-              'User-UUID': getCookieValue('user_uuid'),
-              Token: getCookieValue('token')
-            },
-            body: null,
-
-          }).then(response => {
-            if (response.ok) {
-              isResponseOK = true;
-            }
-            return response.json();
-          }).then(json => {
-            if (isResponseOK) {
-              json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
-              console.log(json);
-              setEnergyStoragePowerStationList(json[0]);
-              setFilteredEnergyStoragePowerStationList(json[0]);
-              if (json[0].length > 0) {
-                setSelectedEnergyStoragePowerStation(json[0][0].value);
-                // enable submit button
-                setSubmitButtonDisabled(false);
-              } else {
-                setSelectedEnergyStoragePowerStation(undefined);
-                // disable submit button
-                setSubmitButtonDisabled(true);
-              }
-            } else {
-              toast.error(t(json.description))
-            }
-          }).catch(err => {
-            console.log(err);
-          });
-          // end of get EnergyStoragePowerStations by root Space ID
-        } else {
-          toast.error(t(json.description));
-        }
-      }).catch(err => {
-        console.log(err);
-      });
+        body: null
+      })
+        .then(response => {
+          console.log(response);
+          if (response.ok) {
+            isResponseOK = true;
+          }
+          return response.json();
+        })
+        .then(json => {
+          console.log(json);
+          if (isResponseOK) {
+            // rename keys
+            json = JSON.parse(
+              JSON.stringify([json])
+                .split('"id":')
+                .join('"value":')
+                .split('"name":')
+                .join('"label":')
+            );
+            setCascaderOptions(json);
+            setSelectedSpaceName([json[0]].map(o => o.label));
+            setSelectedSpaceID([json[0]].map(o => o.value));
+            // get EnergyStoragePowerStations by root Space ID
+            let isResponseOK = false;
+            fetch(APIBaseURL + '/spaces/' + [json[0]].map(o => o.value) + '/energystoragepowerstations', {
+              method: 'GET',
+              headers: {
+                'Content-type': 'application/json',
+                'User-UUID': getCookieValue('user_uuid'),
+                Token: getCookieValue('token')
+              },
+              body: null
+            })
+              .then(response => {
+                if (response.ok) {
+                  isResponseOK = true;
+                }
+                return response.json();
+              })
+              .then(json => {
+                if (isResponseOK) {
+                  json = JSON.parse(
+                    JSON.stringify([json])
+                      .split('"id":')
+                      .join('"value":')
+                      .split('"name":')
+                      .join('"label":')
+                  );
+                  console.log(json);
+                  setEnergyStoragePowerStationList(json[0]);
+                  setFilteredEnergyStoragePowerStationList(json[0]);
+                  if (json[0].length > 0) {
+                    setSelectedEnergyStoragePowerStation(json[0][0].value);
+                    // enable submit button
+                    setSubmitButtonDisabled(false);
+                  } else {
+                    setSelectedEnergyStoragePowerStation(undefined);
+                    // disable submit button
+                    setSubmitButtonDisabled(true);
+                  }
+                } else {
+                  toast.error(t(json.description));
+                }
+              })
+              .catch(err => {
+                console.log(err);
+              });
+            // end of get EnergyStoragePowerStations by root Space ID
+          } else {
+            toast.error(t(json.description));
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
     } else {
-      let url = APIBaseURL + '/reports/energystoragepowerstationreporting?' +
-        'uuid=' + uuid +
-        '&periodtype=' + periodType +
-        '&baseperiodstartdatetime=' + (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-        '&baseperiodenddatetime=' + (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-        '&reportingperiodstartdatetime=' + moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
-        '&reportingperiodenddatetime=' + moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
-        '&language=' + language;
+      let url =
+        APIBaseURL +
+        '/reports/energystoragepowerstationreporting?' +
+        'uuid=' +
+        uuid +
+        '&periodtype=' +
+        periodType +
+        '&baseperiodstartdatetime=' +
+        (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+        '&baseperiodenddatetime=' +
+        (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+        '&reportingperiodstartdatetime=' +
+        moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
+        '&reportingperiodenddatetime=' +
+        moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
+        '&language=' +
+        language;
       loadData(url);
     }
   }, []);
 
-  const loadData = (url) => {
+  const loadData = url => {
     // disable submit button
     setSubmitButtonDisabled(true);
     // show spinner
     setSpinnerHidden(false);
     // hide export button
-    setExportButtonHidden(true)
+    setExportButtonHidden(true);
 
     // Reinitialize tables
     setDetailedDataTableData([]);
@@ -240,116 +279,117 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        console.log(json);
-        if(uuid !== null && uuid) {
-          setFilteredEnergyStoragePowerStationList([{'id': json['energy_storage_power_station']['id'], 'label': json['energy_storage_power_station']['name']}]);
-          setSelectedEnergyStoragePowerStation(json['energy_storage_power_station']['id']);
+      body: null
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
         }
-        setEnergyStoragePowerStationName(json['energy_storage_power_station']['name']);
-        setEnergyStoragePowerStationSerialNumber(json['energy_storage_power_station']['serial_number']);
-        setEnergyStoragePowerStationAddress(json['energy_storage_power_station']['address']);
-        setEnergyStoragePowerStationPostalCode(json['energy_storage_power_station']['postal_code']);
-        setEnergyStoragePowerStationCapacity(json['energy_storage_power_station']['capacity']);
-        setEnergyStoragePowerStationLatitude(json['energy_storage_power_station']['latitude']);
-        setEnergyStoragePowerStationLongitude(json['energy_storage_power_station']['longitude']);
-        setEnergyStoragePowerStationSVG({__html: json['energy_storage_power_station']['svg']});
-        let timestamps = {}
-        json['parameters']['timestamps'].forEach((currentValue, index) => {
-          timestamps['a' + index] = currentValue;
-        });
-        setParameterLineChartLabels(timestamps);
-
-        let values = {}
-        json['parameters']['values'].forEach((currentValue, index) => {
-          values['a' + index] = currentValue;
-        });
-        setParameterLineChartData(values);
-
-        let names = Array();
-        json['parameters']['names'].forEach((currentValue, index) => {
-
-          names.push({ 'value': 'a' + index, 'label': currentValue });
-        });
-        setParameterLineChartOptions(names);
-
-        let cardSummaryArray = []
-        json['reporting_period']['names'].forEach((currentValue, index) => {
-          let cardSummaryItem = {};
-          cardSummaryItem['name'] = json['reporting_period']['names'][index];
-          cardSummaryItem['unit'] = json['reporting_period']['units'][index];
-          cardSummaryItem['subtotal'] = json['reporting_period']['subtotals'][index];
-          cardSummaryItem['increment_rate'] = parseFloat(json['reporting_period']['increment_rates'][index] * 100).toFixed(2) + "%";
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          console.log(json);
+          if (uuid !== null && uuid) {
+            setFilteredEnergyStoragePowerStationList([
+              { id: json['energy_storage_power_station']['id'], label: json['energy_storage_power_station']['name'] }
+            ]);
+            setSelectedEnergyStoragePowerStation(json['energy_storage_power_station']['id']);
+          }
+          setEnergyStoragePowerStationName(json['energy_storage_power_station']['name']);
+          setEnergyStoragePowerStationSerialNumber(json['energy_storage_power_station']['serial_number']);
+          setEnergyStoragePowerStationAddress(json['energy_storage_power_station']['address']);
+          setEnergyStoragePowerStationPostalCode(json['energy_storage_power_station']['postal_code']);
+          setEnergyStoragePowerStationCapacity(json['energy_storage_power_station']['capacity']);
+          setEnergyStoragePowerStationLatitude(json['energy_storage_power_station']['latitude']);
+          setEnergyStoragePowerStationLongitude(json['energy_storage_power_station']['longitude']);
+          setEnergyStoragePowerStationSVG({ __html: json['energy_storage_power_station']['svg'] });
+          let timestamps = {};
+          json['parameters']['timestamps'].forEach((currentValue, index) => {
+            timestamps['a' + index] = currentValue;
+          });
+          setParameterLineChartLabels(timestamps);
 
-          cardSummaryArray.push(cardSummaryItem);
-        });
-        setCardSummaryList(cardSummaryArray);
+          let values = {};
+          json['parameters']['values'].forEach((currentValue, index) => {
+            values['a' + index] = currentValue;
+          });
+          setParameterLineChartData(values);
 
+          let names = Array();
+          json['parameters']['names'].forEach((currentValue, index) => {
+            names.push({ value: 'a' + index, label: currentValue });
+          });
+          setParameterLineChartOptions(names);
+
+          let cardSummaryArray = [];
+          json['reporting_period']['names'].forEach((currentValue, index) => {
+            let cardSummaryItem = {};
+            cardSummaryItem['name'] = json['reporting_period']['names'][index];
+            cardSummaryItem['unit'] = json['reporting_period']['units'][index];
+            cardSummaryItem['subtotal'] = json['reporting_period']['subtotals'][index];
+            cardSummaryItem['increment_rate'] =
+              parseFloat(json['reporting_period']['increment_rates'][index] * 100).toFixed(2) + '%';
+
+            cardSummaryArray.push(cardSummaryItem);
+          });
+          setCardSummaryList(cardSummaryArray);
 
-        let base_and_reporting_names = {}
-        json['reporting_period']['names'].forEach((currentValue, index) => {
-          base_and_reporting_names['a' + index] = currentValue;
-        });
-        setEnergyStoragePowerStationReportingNames(base_and_reporting_names)
+          let base_and_reporting_names = {};
+          json['reporting_period']['names'].forEach((currentValue, index) => {
+            base_and_reporting_names['a' + index] = currentValue;
+          });
+          setEnergyStoragePowerStationReportingNames(base_and_reporting_names);
 
-        let base_and_reporting_units = {}
-        json['reporting_period']['units'].forEach((currentValue, index) => {
-          base_and_reporting_units['a' + index] = "("+currentValue+")";
-        });
-        setEnergyStoragePowerStationReportingUnits(base_and_reporting_units)
+          let base_and_reporting_units = {};
+          json['reporting_period']['units'].forEach((currentValue, index) => {
+            base_and_reporting_units['a' + index] = '(' + currentValue + ')';
+          });
+          setEnergyStoragePowerStationReportingUnits(base_and_reporting_units);
 
+          let reporting_timestamps = {};
+          json['reporting_period']['timestamps'].forEach((currentValue, index) => {
+            reporting_timestamps['a' + index] = currentValue;
+          });
+          setEnergyStoragePowerStationReportingLabels(reporting_timestamps);
 
-        let reporting_timestamps = {}
-        json['reporting_period']['timestamps'].forEach((currentValue, index) => {
-          reporting_timestamps['a' + index] = currentValue;
-        });
-        setEnergyStoragePowerStationReportingLabels(reporting_timestamps);
+          let reporting_values = {};
+          json['reporting_period']['values'].forEach((currentValue, index) => {
+            reporting_values['a' + index] = currentValue;
+          });
+          console.log(reporting_values);
+          setEnergyStoragePowerStationReportingData(reporting_values);
 
-        let reporting_values = {}
-        json['reporting_period']['values'].forEach((currentValue, index) => {
-          reporting_values['a' + index] = currentValue;
-        });
-        console.log(reporting_values);
-        setEnergyStoragePowerStationReportingData(reporting_values);
+          let reporting_subtotals = {};
+          json['reporting_period']['subtotals'].forEach((currentValue, index) => {
+            reporting_subtotals['a' + index] = currentValue.toFixed(2);
+          });
+          setEnergyStoragePowerStationReportingSubtotals(reporting_subtotals);
 
-        let reporting_subtotals = {}
-        json['reporting_period']['subtotals'].forEach((currentValue, index) => {
-          reporting_subtotals['a' + index] = currentValue.toFixed(2);
-        });
-        setEnergyStoragePowerStationReportingSubtotals(reporting_subtotals);
+          let options = Array();
+          json['reporting_period']['names'].forEach((currentValue, index) => {
+            let unit = json['reporting_period']['units'][index];
+            options.push({ value: 'a' + index, label: currentValue + ' (' + unit + ')' });
+          });
+          setEnergyStoragePowerStationReportingOptions(options);
+          setExcelBytesBase64(json['excel_bytes_base64']);
 
-        let options = Array();
-        json['reporting_period']['names'].forEach((currentValue, index) => {
-          let unit = json['reporting_period']['units'][index];
-          options.push({ 'value': 'a' + index, 'label': currentValue + ' (' + unit + ')'});
-        });
-        setEnergyStoragePowerStationReportingOptions(options);
-        setExcelBytesBase64(json['excel_bytes_base64']);
-
-        // enable submit button
-        setSubmitButtonDisabled(false);
-        // hide spinner
-        setSpinnerHidden(true);
-        // show export button
-        setExportButtonHidden(false);
-      } else {
-        toast.error(t(json.description))
-        setSpinnerHidden(true);
-        setSubmitButtonDisabled(false);
-      }
-    })
-    .catch(err => {
-      console.log(err);
-    });
-  }
+          // enable submit button
+          setSubmitButtonDisabled(false);
+          // hide spinner
+          setSpinnerHidden(true);
+          // show export button
+          setExportButtonHidden(false);
+        } else {
+          toast.error(t(json.description));
+          setSpinnerHidden(true);
+          setSubmitButtonDisabled(false);
+        }
+      })
+      .catch(err => {
+        console.log(err);
+      });
+  };
   const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';
 
   let onSpaceCascaderChange = (value, selectedOptions) => {
@@ -357,51 +397,55 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
     setSelectedSpaceID(value[value.length - 1]);
 
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/spaces/' +
-      value[value.length - 1] +
-      '/energystoragepowerstations', {
+    fetch(APIBaseURL + '/spaces/' + value[value.length - 1] + '/energystoragepowerstations', {
       method: 'GET',
       headers: {
         'Content-type': 'application/json',
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
-        console.log(json)
-        setEnergyStoragePowerStationList(json[0]);
-        setFilteredEnergyStoragePowerStationList(json[0]);
-        if (json[0].length > 0) {
-          setSelectedEnergyStoragePowerStation(json[0][0].value);
-          // enable submit button
-          setSubmitButtonDisabled(false);
+      body: null
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          json = JSON.parse(
+            JSON.stringify([json])
+              .split('"id":')
+              .join('"value":')
+              .split('"name":')
+              .join('"label":')
+          );
+          console.log(json);
+          setEnergyStoragePowerStationList(json[0]);
+          setFilteredEnergyStoragePowerStationList(json[0]);
+          if (json[0].length > 0) {
+            setSelectedEnergyStoragePowerStation(json[0][0].value);
+            // enable submit button
+            setSubmitButtonDisabled(false);
+          } else {
+            setSelectedEnergyStoragePowerStation(undefined);
+            // disable submit button
+            setSubmitButtonDisabled(true);
+          }
         } else {
-          setSelectedEnergyStoragePowerStation(undefined);
-          // disable submit button
-          setSubmitButtonDisabled(true);
+          toast.error(t(json.description));
         }
-      } else {
-        toast.error(t(json.description))
-      }
-    }).catch(err => {
-      console.log(err);
-    });
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   const onSearchEnergyStoragePowerStation = ({ target }) => {
     const keyword = target.value.toLowerCase();
-    const filteredResult = energyStoragePowerStationList.filter(
-      energyStoragePowerStation => energyStoragePowerStation.label.toLowerCase().includes(keyword)
+    const filteredResult = energyStoragePowerStationList.filter(energyStoragePowerStation =>
+      energyStoragePowerStation.label.toLowerCase().includes(keyword)
     );
     setFilteredEnergyStoragePowerStationList(keyword.length ? filteredResult : energyStoragePowerStationList);
     if (filteredResult.length > 0) {
@@ -412,7 +456,7 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
       setSelectedEnergyStoragePowerStation(undefined);
       // disable submit button
       setSubmitButtonDisabled(true);
-    };
+    }
     let customInputTarget = document.getElementById('icrogridSelect');
     customInputTarget.value = filteredResult[0].value;
   };
@@ -422,16 +466,34 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
     setComparisonType(target.value);
     if (target.value === 'year-over-year') {
       setBasePeriodDateRangePickerDisabled(true);
-      setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'years').toDate(),
-        moment(reportingPeriodDateRange[1]).subtract(1, 'years').toDate()]);
+      setBasePeriodDateRange([
+        moment(reportingPeriodDateRange[0])
+          .subtract(1, 'years')
+          .toDate(),
+        moment(reportingPeriodDateRange[1])
+          .subtract(1, 'years')
+          .toDate()
+      ]);
     } else if (target.value === 'month-on-month') {
       setBasePeriodDateRangePickerDisabled(true);
-      setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'months').toDate(),
-        moment(reportingPeriodDateRange[1]).subtract(1, 'months').toDate()]);
+      setBasePeriodDateRange([
+        moment(reportingPeriodDateRange[0])
+          .subtract(1, 'months')
+          .toDate(),
+        moment(reportingPeriodDateRange[1])
+          .subtract(1, 'months')
+          .toDate()
+      ]);
     } else if (target.value === 'free-comparison') {
       setBasePeriodDateRangePickerDisabled(false);
-      setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'days').toDate(),
-        moment(reportingPeriodDateRange[1]).subtract(1, 'days').toDate()]);
+      setBasePeriodDateRange([
+        moment(reportingPeriodDateRange[0])
+          .subtract(1, 'days')
+          .toDate(),
+        moment(reportingPeriodDateRange[1])
+          .subtract(1, 'days')
+          .toDate()
+      ]);
     } else if (target.value === 'none-comparison') {
       setBasePeriodDateRange([null, null]);
       setBasePeriodDateRangePickerDisabled(true);
@@ -439,11 +501,11 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
   };
 
   // Callback fired when value changed
-  let onBasePeriodChange = (DateRange) => {
-    if(DateRange == null) {
+  let onBasePeriodChange = DateRange => {
+    if (DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -452,19 +514,37 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
   };
 
   // Callback fired when value changed
-  let onReportingPeriodChange = (DateRange) => {
-    if(DateRange == null) {
+  let onReportingPeriodChange = DateRange => {
+    if (DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
       setReportingPeriodDateRange([DateRange[0], DateRange[1]]);
       if (comparisonType === 'year-over-year') {
-        setBasePeriodDateRange([moment(DateRange[0]).clone().subtract(1, 'years').toDate(), moment(DateRange[1]).clone().subtract(1, 'years').toDate()]);
+        setBasePeriodDateRange([
+          moment(DateRange[0])
+            .clone()
+            .subtract(1, 'years')
+            .toDate(),
+          moment(DateRange[1])
+            .clone()
+            .subtract(1, 'years')
+            .toDate()
+        ]);
       } else if (comparisonType === 'month-on-month') {
-        setBasePeriodDateRange([moment(DateRange[0]).clone().subtract(1, 'months').toDate(), moment(DateRange[1]).clone().subtract(1, 'months').toDate()]);
+        setBasePeriodDateRange([
+          moment(DateRange[0])
+            .clone()
+            .subtract(1, 'months')
+            .toDate(),
+          moment(DateRange[1])
+            .clone()
+            .subtract(1, 'months')
+            .toDate()
+        ]);
       }
     }
   };
@@ -487,37 +567,46 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
     console.log(selectedEnergyStoragePowerStation);
     console.log(comparisonType);
     console.log(periodType);
-    console.log(basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : null)
-    console.log(basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : null)
-    console.log(moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss'))
+    console.log(basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : null);
+    console.log(basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : null);
+    console.log(moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss'));
     console.log(moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss'));
 
-    let url = APIBaseURL + '/reports/energystoragepowerstationreporting?' +
-      'id=' + selectedEnergyStoragePowerStation +
-      '&periodtype=' + periodType +
-      '&baseperiodstartdatetime=' + (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-      '&baseperiodenddatetime=' + (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-      '&reportingperiodstartdatetime=' + moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
-      '&reportingperiodenddatetime=' + moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
-      '&language=' + language;
+    let url =
+      APIBaseURL +
+      '/reports/energystoragepowerstationreporting?' +
+      'id=' +
+      selectedEnergyStoragePowerStation +
+      '&periodtype=' +
+      periodType +
+      '&baseperiodstartdatetime=' +
+      (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+      '&baseperiodenddatetime=' +
+      (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+      '&reportingperiodstartdatetime=' +
+      moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
+      '&reportingperiodenddatetime=' +
+      moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
+      '&language=' +
+      language;
     loadData(url);
   };
 
   const handleExport = e => {
     e.preventDefault();
-    const mimeType='application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
-    const fileName = 'energyStoragePowerStationreproting.xlsx'
-    var fileUrl = "data:" + mimeType + ";base64," + excelBytesBase64;
+    const mimeType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
+    const fileName = 'energyStoragePowerStationreproting.xlsx';
+    var fileUrl = 'data:' + mimeType + ';base64,' + excelBytesBase64;
     fetch(fileUrl)
-        .then(response => response.blob())
-        .then(blob => {
-            var link = window.document.createElement('a');
-            link.href = window.URL.createObjectURL(blob, { type: mimeType });
-            link.download = fileName;
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-        });
+      .then(response => response.blob())
+      .then(blob => {
+        var link = window.document.createElement('a');
+        link.href = window.URL.createObjectURL(blob, { type: mimeType });
+        link.download = fileName;
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+      });
   };
 
   return (
@@ -525,17 +614,19 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
       <Card className="bg-light mb-3">
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
-            <Row form >
+            <Row form>
               <Col xs={6} sm={3} hidden={spaceCascaderHidden}>
-                <FormGroup className="form-group" >
+                <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
                   </Label>
                   <br />
-                  <Cascader options={cascaderOptions}
+                  <Cascader
+                    options={cascaderOptions}
                     onChange={onSpaceCascaderChange}
                     changeOnSelect
-                    expandTrigger="hover">
+                    expandTrigger="hover"
+                  >
                     <Input value={selectedSpaceName || ''} readOnly />
                   </Cascader>
                 </FormGroup>
@@ -547,17 +638,24 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
                   </Label>
 
                   <Form inline>
-                      <Input placeholder={t('Search')} onChange={onSearchEnergyStoragePowerStation} hidden={energyStoragePowerStationSearchHidden} />
-                      <CustomInput type="select" id="energyStoragePowerStationSelect" name="energyStoragePowerStationSelect" onChange={({ target }) => setSelectedEnergyStoragePowerStation(target.value)}
-                      >
-                        {filteredEnergyStoragePowerStationList.map((energyStoragePowerStation, index) => (
-                          <option value={energyStoragePowerStation.value} key={energyStoragePowerStation.value}>
-                            {energyStoragePowerStation.label}
-                          </option>
-                        ))}
-                      </CustomInput>
+                    <Input
+                      placeholder={t('Search')}
+                      onChange={onSearchEnergyStoragePowerStation}
+                      hidden={energyStoragePowerStationSearchHidden}
+                    />
+                    <CustomInput
+                      type="select"
+                      id="energyStoragePowerStationSelect"
+                      name="energyStoragePowerStationSelect"
+                      onChange={({ target }) => setSelectedEnergyStoragePowerStation(target.value)}
+                    >
+                      {filteredEnergyStoragePowerStationList.map((energyStoragePowerStation, index) => (
+                        <option value={energyStoragePowerStation.value} key={energyStoragePowerStation.value}>
+                          {energyStoragePowerStation.label}
+                        </option>
+                      ))}
+                    </CustomInput>
                   </Form>
-
                 </FormGroup>
               </Col>
               <Col xs="auto">
@@ -565,12 +663,15 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
                   <Label className={labelClasses} for="comparisonType">
                     {t('Comparison Types')}
                   </Label>
-                  <CustomInput type="select" id="comparisonType" name="comparisonType"
+                  <CustomInput
+                    type="select"
+                    id="comparisonType"
+                    name="comparisonType"
                     defaultValue="month-on-month"
                     onChange={onComparisonTypeChange}
                   >
                     {comparisonTypeOptions.map((comparisonType, index) => (
-                      <option value={comparisonType.value} key={comparisonType.value} >
+                      <option value={comparisonType.value} key={comparisonType.value}>
                         {t(comparisonType.label)}
                       </option>
                     ))}
@@ -582,10 +683,15 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
                   <Label className={labelClasses} for="periodType">
                     {t('Period Types')}
                   </Label>
-                  <CustomInput type="select" id="periodType" name="periodType" defaultValue="daily" onChange={({ target }) => setPeriodType(target.value)}
+                  <CustomInput
+                    type="select"
+                    id="periodType"
+                    name="periodType"
+                    defaultValue="daily"
+                    onChange={({ target }) => setPeriodType(target.value)}
                   >
                     {periodTypeOptions.map((periodType, index) => (
-                      <option value={periodType.value} key={periodType.value} >
+                      <option value={periodType.value} key={periodType.value}>
                         {t(periodType.label)}
                       </option>
                     ))}
@@ -594,9 +700,12 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
               </Col>
               <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
-                  <Label className={labelClasses} for="basePeriodDateRangePicker">{t('Base Period')}{t('(Optional)')}</Label>
+                  <Label className={labelClasses} for="basePeriodDateRangePicker">
+                    {t('Base Period')}
+                    {t('(Optional)')}
+                  </Label>
                   <DateRangePickerWrapper
-                    id='basePeriodDateRangePicker'
+                    id="basePeriodDateRangePicker"
                     disabled={basePeriodDateRangePickerDisabled}
                     format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
@@ -606,13 +715,15 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
                     placeholder={t('Select Date Range')}
-                   />
+                  />
                 </FormGroup>
               </Col>
               <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
-                  <Label className={labelClasses} for="reportingPeriodDateRangePicker">{t('Reporting Period')}</Label>
-                  <br/>
+                  <Label className={labelClasses} for="reportingPeriodDateRangePicker">
+                    {t('Reporting Period')}
+                  </Label>
+                  <br />
                   <DateRangePickerWrapper
                     id="reportingPeriodDateRangePicker"
                     format="yyyy-MM-dd HH:mm:ss"
@@ -628,25 +739,31 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
               </Col>
               <Col xs="auto">
                 <FormGroup>
-                  <br/>
+                  <br />
                   <ButtonGroup id="submit">
-                    <Button color="success" disabled={submitButtonDisabled} >{t('Submit')}</Button>
+                    <Button color="success" disabled={submitButtonDisabled}>
+                      {t('Submit')}
+                    </Button>
                   </ButtonGroup>
                 </FormGroup>
               </Col>
               <Col xs="auto">
                 <FormGroup>
                   <br />
-                  <Spinner color="primary" hidden={spinnerHidden}  />
+                  <Spinner color="primary" hidden={spinnerHidden} />
                 </FormGroup>
               </Col>
               <Col xs="auto">
-                  <br />
-                  <ButtonIcon icon="external-link-alt" transform="shrink-3 down-2" color="falcon-default"
+                <br />
+                <ButtonIcon
+                  icon="external-link-alt"
+                  transform="shrink-3 down-2"
+                  color="falcon-default"
                   hidden={exportButtonHidden}
-                  onClick={handleExport} >
-                    {t('Export')}
-                  </ButtonIcon>
+                  onClick={handleExport}
+                >
+                  {t('Export')}
+                </ButtonIcon>
               </Col>
             </Row>
           </Form>
@@ -654,30 +771,67 @@ const EnergyStoragePowerStationReporting = ({ setRedirect, setRedirectUrl, t })
       </Card>
       <div className="card-deck">
         {cardSummaryList.map(cardSummaryItem => (
-            <CardSummary key={cardSummaryItem['name']}
-              title={cardSummaryItem['name'] + '(' + cardSummaryItem['unit'] + ')' }
-              color="success" >
-              {cardSummaryItem['subtotal'] && <CountUp end={cardSummaryItem['subtotal']} duration={2} prefix="" separator="," decimal="." decimals={2} />}
-            </CardSummary>
+          <CardSummary
+            key={cardSummaryItem['name']}
+            title={cardSummaryItem['name'] + '(' + cardSummaryItem['unit'] + ')'}
+            color="success"
+          >
+            {cardSummaryItem['subtotal'] && (
+              <CountUp
+                end={cardSummaryItem['subtotal']}
+                duration={2}
+                prefix=""
+                separator=","
+                decimal="."
+                decimals={2}
+              />
+            )}
+          </CardSummary>
         ))}
       </div>
-      <MultiTrendChart reportingTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": energyStoragePowerStationReportingNames, "VALUE": energyStoragePowerStationReportingSubtotals, "UNIT": energyStoragePowerStationReportingUnits}}
-        baseTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": {"a0":""}, "VALUE": {"a0": (0).toFixed(2)}, "UNIT": {"a0":"()"}}}
-        reportingTooltipTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": {"a0":""}, "VALUE": null, "UNIT": {"a0":"()"}}}
-        baseTooltipTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": {"a0":""}, "VALUE": null, "UNIT": {"a0":"()"}}}
+      <MultiTrendChart
+        reportingTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: energyStoragePowerStationReportingNames,
+          VALUE: energyStoragePowerStationReportingSubtotals,
+          UNIT: energyStoragePowerStationReportingUnits
+        }}
+        baseTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: { a0: '' },
+          VALUE: { a0: (0).toFixed(2) },
+          UNIT: { a0: '()' }
+        }}
+        reportingTooltipTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: { a0: '' },
+          VALUE: null,
+          UNIT: { a0: '()' }
+        }}
+        baseTooltipTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: { a0: '' },
+          VALUE: null,
+          UNIT: { a0: '()' }
+        }}
         reportingLabels={energyStoragePowerStationReportingLabels}
         reportingData={energyStoragePowerStationReportingData}
         baseLabels={energyStoragePowerStationReportingLabels}
         baseData={energyStoragePowerStationReportingData}
-        rates={{"a0": []}}
-        options={energyStoragePowerStationReportingOptions}>
-      </MultiTrendChart>
-      <MultipleLineChart reportingTitle={t('Operating Characteristic Curve')}
-            baseTitle=''
-            labels={parameterLineChartLabels}
-            data={parameterLineChartData}
-            options={parameterLineChartOptions}>
-      </MultipleLineChart>
+        rates={{ a0: [] }}
+        options={energyStoragePowerStationReportingOptions}
+      />
+      <MultipleLineChart
+        reportingTitle={t('Operating Characteristic Curve')}
+        baseTitle=""
+        labels={parameterLineChartLabels}
+        data={parameterLineChartData}
+        options={parameterLineChartOptions}
+      />
     </Fragment>
   );
 };
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentBatch.js b/myems-web/src/components/MyEMS/Equipment/EquipmentBatch.js
index dd7de4aee4..4b9fb98137 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentBatch.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentBatch.js
@@ -156,7 +156,7 @@ const EquipmentBatch = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentCarbon.js b/myems-web/src/components/MyEMS/Equipment/EquipmentCarbon.js
index f93d4b0a36..8244525e9f 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentCarbon.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentCarbon.js
@@ -285,7 +285,7 @@ const EquipmentCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -298,7 +298,7 @@ const EquipmentCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentCost.js b/myems-web/src/components/MyEMS/Equipment/EquipmentCost.js
index 9b782a9c1e..df8c7b152e 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentCost.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentCost.js
@@ -285,7 +285,7 @@ const EquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -298,7 +298,7 @@ const EquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentEfficiency.js b/myems-web/src/components/MyEMS/Equipment/EquipmentEfficiency.js
index 35f5b3ea68..2dafdf9d67 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentEfficiency.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentEfficiency.js
@@ -283,7 +283,7 @@ const EquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -296,7 +296,7 @@ const EquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js b/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js
index bb887943c9..98519f4b28 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js
@@ -653,7 +653,7 @@ const EquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -666,7 +666,7 @@ const EquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js b/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js
index f3cd4008be..6265aae949 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js
@@ -283,7 +283,7 @@ const EquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -296,7 +296,7 @@ const EquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentIncome.js b/myems-web/src/components/MyEMS/Equipment/EquipmentIncome.js
index c08df82ac6..a33cfc7a08 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentIncome.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentIncome.js
@@ -283,7 +283,7 @@ const EquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -296,7 +296,7 @@ const EquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentLoad.js b/myems-web/src/components/MyEMS/Equipment/EquipmentLoad.js
index 332bc7c0fe..fbcac9dfba 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentLoad.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentLoad.js
@@ -278,7 +278,7 @@ const EquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -291,7 +291,7 @@ const EquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentOutput.js b/myems-web/src/components/MyEMS/Equipment/EquipmentOutput.js
index 4d2aa3aa49..d0d0c3b159 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentOutput.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentOutput.js
@@ -280,7 +280,7 @@ const EquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -293,7 +293,7 @@ const EquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentSaving.js b/myems-web/src/components/MyEMS/Equipment/EquipmentSaving.js
index dcbe5cdb73..210e46335b 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentSaving.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentSaving.js
@@ -286,7 +286,7 @@ const EquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -299,7 +299,7 @@ const EquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Equipment/EquipmentStatistics.js b/myems-web/src/components/MyEMS/Equipment/EquipmentStatistics.js
index 2dfd676929..266d412d5c 100644
--- a/myems-web/src/components/MyEMS/Equipment/EquipmentStatistics.js
+++ b/myems-web/src/components/MyEMS/Equipment/EquipmentStatistics.js
@@ -280,7 +280,7 @@ const EquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -293,7 +293,7 @@ const EquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Microgrid/MicrogridDetails.js b/myems-web/src/components/MyEMS/Microgrid/MicrogridDetails.js
index 0805aed41a..aa41dfa8cd 100644
--- a/myems-web/src/components/MyEMS/Microgrid/MicrogridDetails.js
+++ b/myems-web/src/components/MyEMS/Microgrid/MicrogridDetails.js
@@ -1,28 +1,16 @@
 import React, { Fragment, useState, useEffect } from 'react';
-import {
-  Card,
-  CardBody,
-  Col,
-  CustomInput,
-  Form,
-  FormGroup,
-  Label,
-  Row,
-  Table,
-  Spinner,
-} from 'reactstrap';
+import { Card, CardBody, Col, CustomInput, Form, FormGroup, Label, Row, Table, Spinner } from 'reactstrap';
 import FalconCardHeader from '../../common/FalconCardHeader';
 import MultipleLineChart from '../common/MultipleLineChart';
 import { getCookieValue, createCookie, checkEmpty } from '../../../helpers/utils';
 import withRedirect from '../../../hoc/withRedirect';
 import { withTranslation } from 'react-i18next';
-import {v4 as uuid} from 'uuid';
+import { v4 as uuid } from 'uuid';
 import { APIBaseURL, settings } from '../../../config';
 import useInterval from '../../../hooks/useInterval';
 import { useLocation } from 'react-router-dom';
 import Datetime from 'react-datetime';
 
-
 const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
   const location = useLocation();
   const microgridUUID = location.search.split('=')[1];
@@ -33,7 +21,7 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
     let user_display_name = getCookieValue('user_display_name');
     let user_uuid = getCookieValue('user_uuid');
     let token = getCookieValue('token');
-    if (checkEmpty(is_logged_in) || checkEmpty(token)|| checkEmpty(user_uuid) || !is_logged_in) {
+    if (checkEmpty(is_logged_in) || checkEmpty(token) || checkEmpty(user_uuid) || !is_logged_in) {
       setRedirectUrl(`/authentication/basic/login`);
       setRedirect(true);
     } else {
@@ -57,7 +45,6 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
     return () => clearInterval(timer);
   }, [setRedirect, setRedirectUrl]);
 
-
   // State
   const [chargeStartTime1, setChargeStartTime1] = useState(null);
   const [chargeEndTime1, setChargeEndTime1] = useState(null);
@@ -117,88 +104,88 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        console.log(json);
-        setMicrogridName(json['microgrid']['name']);
-        setMicrogridSerialNumber(json['microgrid']['serial_number']);
-        setMicrogridAddress(json['microgrid']['address']);
-        setMicrogridPostalCode(json['microgrid']['postal_code']);
-        setMicrogridCapacity(json['microgrid']['capacity']);
-        setMicrogridLatitude(json['microgrid']['latitude']);
-        setMicrogridLongitude(json['microgrid']['longitude']);
-        setMicrogridSVG({__html: json['microgrid']['svg']});
-        let timestamps = {}
-        json['parameters']['timestamps'].forEach((currentValue, index) => {
-          timestamps['a' + index] = currentValue;
-        });
-        setParameterLineChartLabels(timestamps);
-
-        let values = {}
-        json['parameters']['values'].forEach((currentValue, index) => {
-          values['a' + index] = currentValue;
-        });
-        setParameterLineChartData(values);
+      body: null
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          console.log(json);
+          setMicrogridName(json['microgrid']['name']);
+          setMicrogridSerialNumber(json['microgrid']['serial_number']);
+          setMicrogridAddress(json['microgrid']['address']);
+          setMicrogridPostalCode(json['microgrid']['postal_code']);
+          setMicrogridCapacity(json['microgrid']['capacity']);
+          setMicrogridLatitude(json['microgrid']['latitude']);
+          setMicrogridLongitude(json['microgrid']['longitude']);
+          setMicrogridSVG({ __html: json['microgrid']['svg'] });
+          let timestamps = {};
+          json['parameters']['timestamps'].forEach((currentValue, index) => {
+            timestamps['a' + index] = currentValue;
+          });
+          setParameterLineChartLabels(timestamps);
 
-        let names = Array();
-        json['parameters']['names'].forEach((currentValue, index) => {
+          let values = {};
+          json['parameters']['values'].forEach((currentValue, index) => {
+            values['a' + index] = currentValue;
+          });
+          setParameterLineChartData(values);
 
-          names.push({ 'value': 'a' + index, 'label': currentValue });
-        });
-        setParameterLineChartOptions(names);
+          let names = Array();
+          json['parameters']['names'].forEach((currentValue, index) => {
+            names.push({ value: 'a' + index, label: currentValue });
+          });
+          setParameterLineChartOptions(names);
 
-        setChargeStartTime1(json['schedule']['charge_start_time1'])
-        setChargeEndTime1(json['schedule']['charge_end_time1'])
-        setChargeStartTime2(json['schedule']['charge_start_time2'])
-        setChargeEndTime2(json['schedule']['charge_end_time2'])
-        setChargeStartTime3(json['schedule']['charge_start_time3'])
-        setChargeEndTime3(json['schedule']['charge_end_time3'])
-        setChargeStartTime4(json['schedule']['charge_start_time4'])
-        setChargeEndTime4(json['schedule']['charge_end_time4'])
+          setChargeStartTime1(json['schedule']['charge_start_time1']);
+          setChargeEndTime1(json['schedule']['charge_end_time1']);
+          setChargeStartTime2(json['schedule']['charge_start_time2']);
+          setChargeEndTime2(json['schedule']['charge_end_time2']);
+          setChargeStartTime3(json['schedule']['charge_start_time3']);
+          setChargeEndTime3(json['schedule']['charge_end_time3']);
+          setChargeStartTime4(json['schedule']['charge_start_time4']);
+          setChargeEndTime4(json['schedule']['charge_end_time4']);
 
-        setDischargeStartTime1(json['schedule']['discharge_start_time1'])
-        setDischargeEndTime1(json['schedule']['discharge_end_time1'])
-        setDischargeStartTime2(json['schedule']['discharge_start_time2'])
-        setDischargeEndTime2(json['schedule']['discharge_end_time2'])
-        setDischargeStartTime3(json['schedule']['discharge_start_time3'])
-        setDischargeEndTime3(json['schedule']['discharge_end_time3'])
-        setDischargeStartTime4(json['schedule']['discharge_start_time4'])
-        setDischargeEndTime4(json['schedule']['discharge_end_time4'])
+          setDischargeStartTime1(json['schedule']['discharge_start_time1']);
+          setDischargeEndTime1(json['schedule']['discharge_end_time1']);
+          setDischargeStartTime2(json['schedule']['discharge_start_time2']);
+          setDischargeEndTime2(json['schedule']['discharge_end_time2']);
+          setDischargeStartTime3(json['schedule']['discharge_start_time3']);
+          setDischargeEndTime3(json['schedule']['discharge_end_time3']);
+          setDischargeStartTime4(json['schedule']['discharge_start_time4']);
+          setDischargeEndTime4(json['schedule']['discharge_end_time4']);
 
-        setChargeStartTime1CommandID(json['schedule']['charge_start_time1_command_id'])
-        setChargeEndTime1CommandID(json['schedule']['charge_end_time1_command_id'])
-        setChargeStartTime2CommandID(json['schedule']['charge_start_time2_command_id'])
-        setChargeEndTime2CommandID(json['schedule']['charge_end_time2_command_id'])
-        setChargeStartTime3CommandID(json['schedule']['charge_start_time3_command_id'])
-        setChargeEndTime3CommandID(json['schedule']['charge_end_time3_command_id'])
-        setChargeStartTime4CommandID(json['schedule']['charge_start_time4_command_id'])
-        setChargeEndTime4CommandID(json['schedule']['charge_end_time4_command_id'])
+          setChargeStartTime1CommandID(json['schedule']['charge_start_time1_command_id']);
+          setChargeEndTime1CommandID(json['schedule']['charge_end_time1_command_id']);
+          setChargeStartTime2CommandID(json['schedule']['charge_start_time2_command_id']);
+          setChargeEndTime2CommandID(json['schedule']['charge_end_time2_command_id']);
+          setChargeStartTime3CommandID(json['schedule']['charge_start_time3_command_id']);
+          setChargeEndTime3CommandID(json['schedule']['charge_end_time3_command_id']);
+          setChargeStartTime4CommandID(json['schedule']['charge_start_time4_command_id']);
+          setChargeEndTime4CommandID(json['schedule']['charge_end_time4_command_id']);
 
-        setDischargeStartTime1CommandID(json['schedule']['discharge_start_time1_command_id'])
-        setDischargeEndTime1CommandID(json['schedule']['discharge_end_time1_command_id'])
-        setDischargeStartTime2CommandID(json['schedule']['discharge_start_time2_command_id'])
-        setDischargeEndTime2CommandID(json['schedule']['discharge_end_time2_command_id'])
-        setDischargeStartTime3CommandID(json['schedule']['discharge_start_time3_command_id'])
-        setDischargeEndTime3CommandID(json['schedule']['discharge_end_time3_command_id'])
-        setDischargeStartTime4CommandID(json['schedule']['discharge_start_time4_command_id'])
-        setDischargeEndTime4CommandID(json['schedule']['discharge_end_time4_command_id'])
-      }
-    })
-    .catch(err => {
-      console.log(err);
-    });
+          setDischargeStartTime1CommandID(json['schedule']['discharge_start_time1_command_id']);
+          setDischargeEndTime1CommandID(json['schedule']['discharge_end_time1_command_id']);
+          setDischargeStartTime2CommandID(json['schedule']['discharge_start_time2_command_id']);
+          setDischargeEndTime2CommandID(json['schedule']['discharge_end_time2_command_id']);
+          setDischargeStartTime3CommandID(json['schedule']['discharge_start_time3_command_id']);
+          setDischargeEndTime3CommandID(json['schedule']['discharge_end_time3_command_id']);
+          setDischargeStartTime4CommandID(json['schedule']['discharge_start_time4_command_id']);
+          setDischargeEndTime4CommandID(json['schedule']['discharge_end_time4_command_id']);
+        }
+      })
+      .catch(err => {
+        console.log(err);
+      });
   }, []);
 
   const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';
 
-  const refreshSVGData =()=> {
+  const refreshSVGData = () => {
     let isResponseOK = false;
     fetch(APIBaseURL + '/reports/pointrealtime', {
       method: 'GET',
@@ -207,33 +194,34 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        console.log(json);
-        json.forEach((currentPoint) => {
-          let textElement=document.getElementById("PT"+currentPoint['point_id'])
-          if(textElement){
-            let tspanList = textElement.getElementsByTagName('tspan')
-            if (tspanList && tspanList.length > 0) {
-              let tspanElement = tspanList[tspanList.length - 1]
-              tspanElement.textContent = parseFloat(currentPoint['value']).toFixed(2)
-            } else {
-              textElement.textContent=parseFloat(currentPoint['value']).toFixed(2)
-            }
-          }
-        });
-      }
+      body: null
     })
-    .catch(err => {
-      console.log(err);
-    });
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          console.log(json);
+          json.forEach(currentPoint => {
+            let textElement = document.getElementById('PT' + currentPoint['point_id']);
+            if (textElement) {
+              let tspanList = textElement.getElementsByTagName('tspan');
+              if (tspanList && tspanList.length > 0) {
+                let tspanElement = tspanList[tspanList.length - 1];
+                tspanElement.textContent = parseFloat(currentPoint['value']).toFixed(2);
+              } else {
+                textElement.textContent = parseFloat(currentPoint['value']).toFixed(2);
+              }
+            }
+          });
+        }
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   useInterval(() => {
@@ -241,7 +229,7 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
   }, 1000 * 10);
 
   // Callback fired when ChargeStartTime1 change
-  const onChargeStartTime1Change = (moment) => {
+  const onChargeStartTime1Change = moment => {
     setChargeStartTime1(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime1 close
@@ -255,18 +243,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime1.substring(0, 2)) * 256 + parseInt(chargeStartTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime1.substring(0, 2)) * 256 + parseInt(chargeStartTime1.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime1 change
-  const onChargeEndTime1Change = (moment) => {
+  const onChargeEndTime1Change = moment => {
     setChargeEndTime1(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime1 close
@@ -280,18 +272,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime1.substring(0, 2)) * 256 + parseInt(chargeEndTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime1.substring(0, 2)) * 256 + parseInt(chargeEndTime1.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime1 change
-  const onDischargeStartTime1Change = (moment) => {
+  const onDischargeStartTime1Change = moment => {
     setDischargeStartTime1(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime1 close
@@ -305,18 +301,24 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime1.substring(0, 2)) * 256 + parseInt(dischargeStartTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime1.substring(0, 2)) * 256 + parseInt(dischargeStartTime1.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime1 change
-  const onDischargeEndTime1Change = (moment) => {
+  const onDischargeEndTime1Change = moment => {
     setDischargeEndTime1(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime1 close
@@ -330,19 +332,25 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime1.substring(0, 2)) * 256 + parseInt(dischargeEndTime1.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime1.substring(0, 2)) * 256 + parseInt(dischargeEndTime1.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   // Callback fired when ChargeStartTime2 change
-  const onChargeStartTime2Change = (moment) => {
+  const onChargeStartTime2Change = moment => {
     setChargeStartTime2(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime2 close
@@ -356,18 +364,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime2.substring(0, 2)) * 256 + parseInt(chargeStartTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime2.substring(0, 2)) * 256 + parseInt(chargeStartTime2.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime2 change
-  const onChargeEndTime2Change = (moment) => {
+  const onChargeEndTime2Change = moment => {
     setChargeEndTime2(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime2 close
@@ -381,18 +393,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime2.substring(0, 2)) * 256 + parseInt(chargeEndTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime2.substring(0, 2)) * 256 + parseInt(chargeEndTime2.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime2 change
-  const onDischargeStartTime2Change = (moment) => {
+  const onDischargeStartTime2Change = moment => {
     setDischargeStartTime2(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime2 close
@@ -406,18 +422,24 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime2.substring(0, 2)) * 256 + parseInt(dischargeStartTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime2.substring(0, 2)) * 256 + parseInt(dischargeStartTime2.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime2 change
-  const onDischargeEndTime2Change = (moment) => {
+  const onDischargeEndTime2Change = moment => {
     setDischargeEndTime2(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime2 close
@@ -431,19 +453,25 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime2.substring(0, 2)) * 256 + parseInt(dischargeEndTime2.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime2.substring(0, 2)) * 256 + parseInt(dischargeEndTime2.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   // Callback fired when ChargeStartTime3 change
-  const onChargeStartTime3Change = (moment) => {
+  const onChargeStartTime3Change = moment => {
     setChargeStartTime3(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime3 close
@@ -457,18 +485,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime3.substring(0, 2)) * 256 + parseInt(chargeStartTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime3.substring(0, 2)) * 256 + parseInt(chargeStartTime3.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime3 change
-  const onChargeEndTime3Change = (moment) => {
+  const onChargeEndTime3Change = moment => {
     setChargeEndTime3(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime3 close
@@ -482,18 +514,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime3.substring(0, 2)) * 256 + parseInt(chargeEndTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime3.substring(0, 2)) * 256 + parseInt(chargeEndTime3.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime3 change
-  const onDischargeStartTime3Change = (moment) => {
+  const onDischargeStartTime3Change = moment => {
     setDischargeStartTime3(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime3 close
@@ -507,18 +543,24 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime3.substring(0, 2)) * 256 + parseInt(dischargeStartTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime3.substring(0, 2)) * 256 + parseInt(dischargeStartTime3.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime3 change
-  const onDischargeEndTime3Change = (moment) => {
+  const onDischargeEndTime3Change = moment => {
     setDischargeEndTime3(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime3 close
@@ -532,19 +574,25 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime3.substring(0, 2)) * 256 + parseInt(dischargeEndTime3.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime3.substring(0, 2)) * 256 + parseInt(dischargeEndTime3.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   // Callback fired when ChargeStartTime4 change
-  const onChargeStartTime4Change = (moment) => {
+  const onChargeStartTime4Change = moment => {
     setChargeStartTime4(moment.format('HH:mm'));
   };
   // Callback fired when ChargeStartTime4 close
@@ -558,18 +606,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeStartTime4.substring(0, 2)) * 256 + parseInt(chargeStartTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeStartTime4.substring(0, 2)) * 256 + parseInt(chargeStartTime4.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when ChargeEndTime4 change
-  const onChargeEndTime4Change = (moment) => {
+  const onChargeEndTime4Change = moment => {
     setChargeEndTime4(moment.format('HH:mm'));
   };
   // Callback fired when ChargeEndTime4 close
@@ -583,18 +635,22 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(chargeEndTime4.substring(0, 2)) * 256 + parseInt(chargeEndTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: { set_value: parseInt(chargeEndTime4.substring(0, 2)) * 256 + parseInt(chargeEndTime4.substring(3)) }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeStartTime4 change
-  const onDischargeStartTime4Change = (moment) => {
+  const onDischargeStartTime4Change = moment => {
     setDischargeStartTime4(moment.format('HH:mm'));
   };
   // Callback fired when DischargeStartTime4 close
@@ -608,18 +664,24 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeStartTime4.substring(0, 2)) * 256 + parseInt(dischargeStartTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeStartTime4.substring(0, 2)) * 256 + parseInt(dischargeStartTime4.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
   // Callback fired when DischargeEndTime4 change
-  const onDischargeEndTime4Change = (moment) => {
+  const onDischargeEndTime4Change = moment => {
     setDischargeEndTime4(moment.format('HH:mm'));
   };
   // Callback fired when DischargeEndTime4 close
@@ -633,15 +695,21 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
         Token: getCookieValue('token')
       },
       // convert HH:mm to set value, shift HH 8 bits to left and then plus mm
-      body: JSON.stringify({"data": {"set_value": parseInt(dischargeEndTime4.substring(0, 2)) * 256 + parseInt(dischargeEndTime4.substring(3, ))}}),
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).catch(err => {
-      console.log(err);
-    });
+      body: JSON.stringify({
+        data: {
+          set_value: parseInt(dischargeEndTime4.substring(0, 2)) * 256 + parseInt(dischargeEndTime4.substring(3))
+        }
+      })
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   return (
@@ -655,43 +723,30 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
             <FalconCardHeader title={t('General Information')} light={false} titleClass="text-lightSlateGray mb-0" />
             <CardBody className="bg-light">
               <h6 className="mt-4">{t('Name')}</h6>
-              <div className="mb-1">
-                {microgridName}
-              </div>
+              <div className="mb-1">{microgridName}</div>
               <h6 className="mt-4">{t('Serial Number')}</h6>
-              <div className="mb-1">
-                {microgridSerialNumber}
-              </div>
+              <div className="mb-1">{microgridSerialNumber}</div>
               <h6 className="mt-4">{t('Address')}</h6>
-              <div className="mb-1">
-                {microgridAddress}
-              </div>
+              <div className="mb-1">{microgridAddress}</div>
               <h6 className="mt-4">{t('Postal Code')}</h6>
-              <div className="mb-1">
-                {microgridPostalCode}
-              </div>
+              <div className="mb-1">{microgridPostalCode}</div>
               <h6 className="mt-4">{t('Capacity')} (kW)</h6>
-              <div className="mb-1">
-                {microgridCapacity}
-              </div>
+              <div className="mb-1">{microgridCapacity}</div>
               <h6 className="mt-4">{t('Latitude')}</h6>
-              <div className="mb-1">
-                {microgridLatitude}
-              </div>
+              <div className="mb-1">{microgridLatitude}</div>
               <h6 className="mt-4">{t('Longitude')}</h6>
-              <div className="mb-1">
-                {microgridLongitude}
-              </div>
+              <div className="mb-1">{microgridLongitude}</div>
             </CardBody>
           </Card>
         </Col>
       </Row>
-      <MultipleLineChart reportingTitle={t('Operating Characteristic Curve')}
-            baseTitle=''
-            labels={parameterLineChartLabels}
-            data={parameterLineChartData}
-            options={parameterLineChartOptions}>
-      </MultipleLineChart>
+      <MultipleLineChart
+        reportingTitle={t('Operating Characteristic Curve')}
+        baseTitle=""
+        labels={parameterLineChartLabels}
+        data={parameterLineChartData}
+        options={parameterLineChartOptions}
+      />
       <Card className="mb-3 fs--1">
         <FalconCardHeader title={t('Charging Schedule')} light={false} titleClass="text-lightSlateGray mb-0" />
         <CardBody className="bg-light">
@@ -708,31 +763,159 @@ const MicrogridDetails = ({ setRedirect, setRedirectUrl, t }) => {
             <tbody>
               <tr>
                 <th scope="row">1</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime1} onChange={onChargeStartTime1Change} onClose={onChargeStartTime1Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime1} onChange={onChargeEndTime1Change}  onClose={onChargeEndTime1Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime1} onChange={onDischargeStartTime1Change} onClose={onDischargeStartTime1Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime1} onChange={onDischargeEndTime1Change} onClose={onDischargeEndTime1Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime1}
+                    onChange={onChargeStartTime1Change}
+                    onClose={onChargeStartTime1Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime1}
+                    onChange={onChargeEndTime1Change}
+                    onClose={onChargeEndTime1Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime1}
+                    onChange={onDischargeStartTime1Change}
+                    onClose={onDischargeStartTime1Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime1}
+                    onChange={onDischargeEndTime1Change}
+                    onClose={onDischargeEndTime1Close}
+                  />
+                </td>
               </tr>
               <tr>
                 <th scope="row">2</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime2} onChange={onChargeStartTime2Change} onClose={onChargeStartTime2Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime2} onChange={onChargeEndTime2Change} onClose={onChargeEndTime2Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime2} onChange={onDischargeStartTime2Change} onClose={onDischargeStartTime2Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime2} onChange={onDischargeEndTime2Change} onClose={onDischargeEndTime2Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime2}
+                    onChange={onChargeStartTime2Change}
+                    onClose={onChargeStartTime2Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime2}
+                    onChange={onChargeEndTime2Change}
+                    onClose={onChargeEndTime2Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime2}
+                    onChange={onDischargeStartTime2Change}
+                    onClose={onDischargeStartTime2Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime2}
+                    onChange={onDischargeEndTime2Change}
+                    onClose={onDischargeEndTime2Close}
+                  />
+                </td>
               </tr>
               <tr>
                 <th scope="row">3</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime3} onChange={onChargeStartTime3Change} onClose={onChargeStartTime3Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime3} onChange={onChargeEndTime3Change} onClose={onChargeEndTime3Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime3} onChange={onDischargeStartTime3Change} onClose={onDischargeStartTime3Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime3} onChange={onDischargeEndTime3Change} onClose={onDischargeEndTime3Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime3}
+                    onChange={onChargeStartTime3Change}
+                    onClose={onChargeStartTime3Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime3}
+                    onChange={onChargeEndTime3Change}
+                    onClose={onChargeEndTime3Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime3}
+                    onChange={onDischargeStartTime3Change}
+                    onClose={onDischargeStartTime3Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime3}
+                    onChange={onDischargeEndTime3Change}
+                    onClose={onDischargeEndTime3Close}
+                  />
+                </td>
               </tr>
               <tr>
                 <th scope="row">4</th>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeStartTime4} onChange={onChargeStartTime4Change} onClose={onChargeStartTime4Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={chargeEndTime4} onChange={onChargeEndTime4Change} onClose={onChargeEndTime4Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeStartTime4} onChange={onDischargeStartTime4Change} onClose={onDischargeStartTime4Close} /></td>
-                <td><Datetime dateFormat={false} timeFormat='HH:mm' value={dischargeEndTime4} onChange={onDischargeEndTime4Change} onClose={onDischargeEndTime4Close} /></td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeStartTime4}
+                    onChange={onChargeStartTime4Change}
+                    onClose={onChargeStartTime4Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={chargeEndTime4}
+                    onChange={onChargeEndTime4Change}
+                    onClose={onChargeEndTime4Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeStartTime4}
+                    onChange={onDischargeStartTime4Change}
+                    onClose={onDischargeStartTime4Close}
+                  />
+                </td>
+                <td>
+                  <Datetime
+                    dateFormat={false}
+                    timeFormat="HH:mm"
+                    value={dischargeEndTime4}
+                    onChange={onDischargeEndTime4Change}
+                    onClose={onDischargeEndTime4Close}
+                  />
+                </td>
               </tr>
             </tbody>
           </Table>
diff --git a/myems-web/src/components/MyEMS/Microgrid/MicrogridList.js b/myems-web/src/components/MyEMS/Microgrid/MicrogridList.js
index b80973b8fe..31beceeaac 100644
--- a/myems-web/src/components/MyEMS/Microgrid/MicrogridList.js
+++ b/myems-web/src/components/MyEMS/Microgrid/MicrogridList.js
@@ -13,7 +13,7 @@ import {
   FormGroup,
   Input,
   Label,
-  Spinner,
+  Spinner
 } from 'reactstrap';
 import Loader from '../../common/Loader';
 import { isIterableArray } from '../../../helpers/utils';
@@ -29,7 +29,6 @@ import { toast } from 'react-toastify';
 import { APIBaseURL, settings } from '../../../config';
 import CustomizeMapBox from '../common/CustomizeMapBox';
 
-
 const MicrogridList = ({ setRedirect, setRedirectUrl, t }) => {
   useEffect(() => {
     let is_logged_in = getCookieValue('is_logged_in');
@@ -37,7 +36,7 @@ const MicrogridList = ({ setRedirect, setRedirectUrl, t }) => {
     let user_display_name = getCookieValue('user_display_name');
     let user_uuid = getCookieValue('user_uuid');
     let token = getCookieValue('token');
-    if (checkEmpty(is_logged_in) || checkEmpty(token)|| checkEmpty(user_uuid) || !is_logged_in) {
+    if (checkEmpty(is_logged_in) || checkEmpty(token) || checkEmpty(user_uuid) || !is_logged_in) {
       setRedirectUrl(`/authentication/basic/login`);
       setRedirect(true);
     } else {
@@ -78,79 +77,80 @@ const MicrogridList = ({ setRedirect, setRedirectUrl, t }) => {
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      console.log(response);
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      console.log(json);
-      if (isResponseOK) {
+      body: null
+    })
+      .then(response => {
+        console.log(response);
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
         console.log(json);
-        setMicrogridArray([]);
-        setMicrogridIds([]);
-        let microgridArray = [];
-        let microgridIds = [];
-        let geojsonData = [];
-        if (json.length > 0) {
-          setRootLongitude(json[0]['longitude']);
-          setRootLatitude(json[0]['latitude']);
-          json.forEach((currentValue, index) => {
-            let microgird = {}
-            microgird['id'] = json[index]['id'];
-            microgird['name'] = json[index]['name'];
-            microgird['uuid'] = json[index]['uuid'];
-            microgird['address'] = json[index]['address'];
-            microgird['postal_code'] = json[index]['postal_code'];
-            microgird['latitude'] = json[index]['latitude'];
-            microgird['longitude'] = json[index]['longitude'];
-            microgird['serial_number'] = json[index]['serial_number'];
-            microgird['files'] = [{ id: json[index]['uuid'], src: require('./Microgrid.jpeg'), }];
-            microgird['batteryState'] = json[index]['battery_state'];
-            microgird['batterySocPointValue'] = json[index]['battery_soc_point_value'];
-            microgird['batteryPowerPointValue'] = json[index]['battery_power_point_value'];
-            microgird['photovoltaicPowerPointValue'] = json[index]['photovoltaic_power_point_value'];
-            microgird['loadPowerPointValue'] = json[index]['load_power_point_value'];
-            microgird['gridPowerPointValue'] = json[index]['grid_power_point_value'];
-            microgird['PCSRunState'] = json[index]['pcs_run_state'];
-            microgird['alarms'] = ['supply temperature is high', 'return temperature is low'];
-            microgird['isOnline'] = json[index]['is_online'];
-
-            microgridArray.push(microgird);
-            microgridIds.push(microgird['id']);
-            geojsonData.push({
-              'type': 'Feature',
-              'geometry': {
-                'type': 'Point',
-                'coordinates': [json[index]['longitude'], json[index]['latitude']]
+        if (isResponseOK) {
+          console.log(json);
+          setMicrogridArray([]);
+          setMicrogridIds([]);
+          let microgridArray = [];
+          let microgridIds = [];
+          let geojsonData = [];
+          if (json.length > 0) {
+            setRootLongitude(json[0]['longitude']);
+            setRootLatitude(json[0]['latitude']);
+            json.forEach((currentValue, index) => {
+              let microgird = {};
+              microgird['id'] = json[index]['id'];
+              microgird['name'] = json[index]['name'];
+              microgird['uuid'] = json[index]['uuid'];
+              microgird['address'] = json[index]['address'];
+              microgird['postal_code'] = json[index]['postal_code'];
+              microgird['latitude'] = json[index]['latitude'];
+              microgird['longitude'] = json[index]['longitude'];
+              microgird['serial_number'] = json[index]['serial_number'];
+              microgird['files'] = [{ id: json[index]['uuid'], src: require('./Microgrid.jpeg') }];
+              microgird['batteryState'] = json[index]['battery_state'];
+              microgird['batterySocPointValue'] = json[index]['battery_soc_point_value'];
+              microgird['batteryPowerPointValue'] = json[index]['battery_power_point_value'];
+              microgird['photovoltaicPowerPointValue'] = json[index]['photovoltaic_power_point_value'];
+              microgird['loadPowerPointValue'] = json[index]['load_power_point_value'];
+              microgird['gridPowerPointValue'] = json[index]['grid_power_point_value'];
+              microgird['PCSRunState'] = json[index]['pcs_run_state'];
+              microgird['alarms'] = ['supply temperature is high', 'return temperature is low'];
+              microgird['isOnline'] = json[index]['is_online'];
+
+              microgridArray.push(microgird);
+              microgridIds.push(microgird['id']);
+              geojsonData.push({
+                type: 'Feature',
+                geometry: {
+                  type: 'Point',
+                  coordinates: [json[index]['longitude'], json[index]['latitude']]
                 },
-              'properties': {
-                'title': json[index]['name'],
-                'description': json[index]['description'],
-                'uuid': json[index]['uuid'],
-                'url': '/microgrid/details'
+                properties: {
+                  title: json[index]['name'],
+                  description: json[index]['description'],
+                  uuid: json[index]['uuid'],
+                  url: '/microgrid/details'
                 }
-            })
-          });
+              });
+            });
+          }
+          setMicrogridArray(microgridArray);
+          setMicrogridIds(microgridIds);
+          console.log('microgridArray:');
+          console.log(microgridArray);
+          console.log('microgridIds:');
+          console.log(microgridIds);
+          setIsLoading(false);
+          setGeojson(geojsonData);
+        } else {
+          toast.error(t(json.description));
         }
-        setMicrogridArray(microgridArray);
-        setMicrogridIds(microgridIds);
-        console.log('microgridArray:');
-        console.log(microgridArray);
-        console.log('microgridIds:');
-        console.log(microgridIds);
-        setIsLoading(false);
-        setGeojson(geojsonData);
-      } else {
-        toast.error(t(json.description));
-      }
-    }).catch(err => {
-      console.log(err);
-    });
-
+      })
+      .catch(err => {
+        console.log(err);
+      });
   }, []);
 
   const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';
@@ -170,28 +170,34 @@ const MicrogridList = ({ setRedirect, setRedirectUrl, t }) => {
   const isList = true;
   const isGrid = false;
 
-
   return (
     <Fragment>
       <Card>
         <CardBody className={classNames({ 'p-0  overflow-hidden': isList, 'pb-0': isGrid })}>
           <Row>
             <Col xs={8}>
-            {isLoading ? (
-              <Loader />
-            ) : (
+              {isLoading ? (
+                <Loader />
+              ) : (
                 <Row noGutters={isList}>
                   {isIterableArray(microgridArray) &&
                     microgridArray
                       .filter(microgrid => paginationData.includes(microgrid.id))
-                      .map((microgrid, index) => <MicrogridListItem {...microgrid} sliderSettings={sliderSettings} key={microgrid.id} index={index} />)}
+                      .map((microgrid, index) => (
+                        <MicrogridListItem
+                          {...microgrid}
+                          sliderSettings={sliderSettings}
+                          key={microgrid.id}
+                          index={index}
+                        />
+                      ))}
                 </Row>
               )}
             </Col>
             <Col>
-              <CustomizeMapBox Latitude={rootLatitude} Longitude={rootLongitude} Zoom={10} Geojson={geojson}></CustomizeMapBox>
+              <CustomizeMapBox Latitude={rootLatitude} Longitude={rootLongitude} Zoom={10} Geojson={geojson} />
             </Col>
-            </Row>
+          </Row>
         </CardBody>
         <MicrogridFooter meta={paginationMeta} handler={paginationHandler} />
       </Card>
@@ -199,9 +205,7 @@ const MicrogridList = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody>
           <Row className="justify-content-between align-items-center">
             <Col sm="auto" className="mb-2 mb-sm-0" tag={Flex} align="center">
-              <h6 className="mb-0 text-nowrap ml-2">
-                {t('Show Up to')}
-              </h6>
+              <h6 className="mb-0 text-nowrap ml-2">{t('Show Up to')}</h6>
               <CustomInput
                 id="itemsPerPage"
                 type="select"
@@ -214,11 +218,8 @@ const MicrogridList = ({ setRedirect, setRedirectUrl, t }) => {
                 <option value={20}>20</option>
                 <option value={total}>{t('All')}</option>
               </CustomInput>
-              <h6 className="mb-0 text-nowrap ml-2">
-                {t('FROM - TO of TOTAL', { 'FROM': from, 'TO': to, 'TOTAL': total })}
-              </h6>
+              <h6 className="mb-0 text-nowrap ml-2">{t('FROM - TO of TOTAL', { FROM: from, TO: to, TOTAL: total })}</h6>
             </Col>
-
           </Row>
         </CardBody>
       </Card>
diff --git a/myems-web/src/components/MyEMS/Microgrid/MicrogridListItem.js b/myems-web/src/components/MyEMS/Microgrid/MicrogridListItem.js
index 6f07e07667..df03563a43 100644
--- a/myems-web/src/components/MyEMS/Microgrid/MicrogridListItem.js
+++ b/myems-web/src/components/MyEMS/Microgrid/MicrogridListItem.js
@@ -32,7 +32,7 @@ const MicrogridListItem = ({
   t
 }) => {
   const { isDark } = useContext(AppContext);
-  const {  favouriteItemsDispatch } = useContext(ProductContext);
+  const { favouriteItemsDispatch } = useContext(ProductContext);
   const [cartLoading, setCartLoading] = useState(false);
 
   const handleAddToCart = () => {
@@ -48,15 +48,25 @@ const MicrogridListItem = ({
         <Row>
           <Col sm={5} md={4}>
             <div className="position-relative h-sm-100">
-              <Link className="d-block h-100" to={`/microgrid/details?uuid=${uuid}`} target = "_blank">
+              <Link className="d-block h-100" to={`/microgrid/details?uuid=${uuid}`} target="_blank">
                 <img
                   className="img-fluid fit-cover w-sm-100 h-sm-100 rounded absolute-sm-centered"
-                      src={files[0]['src']}
+                  src={files[0]['src']}
                 />
-                </Link>
+              </Link>
               {isOnline && (
                 <Badge color="success" pill className="position-absolute t-0 r-0 mr-2 mt-2 fs--2 z-index-2">
-                  {PCSRunState === 'Running' ? t('PCS Running') : PCSRunState === 'Initializing' ? t('PCS Initializing') : PCSRunState === 'Standby' ? t('PCS Standby') : PCSRunState === 'Shutdown' ? t('PCS Shutdown') : PCSRunState === 'Fault' ? t('PCS Fault') : t('PCS Unknown')}
+                  {PCSRunState === 'Running'
+                    ? t('PCS Running')
+                    : PCSRunState === 'Initializing'
+                    ? t('PCS Initializing')
+                    : PCSRunState === 'Standby'
+                    ? t('PCS Standby')
+                    : PCSRunState === 'Shutdown'
+                    ? t('PCS Shutdown')
+                    : PCSRunState === 'Fault'
+                    ? t('PCS Fault')
+                    : t('PCS Unknown')}
                 </Badge>
               )}
             </div>
@@ -65,50 +75,80 @@ const MicrogridListItem = ({
             <Row>
               <Col lg={7}>
                 <h5 className="mt-3 mt-sm-0">
-                  <Link to={`/microgrid/details?uuid=${uuid}`} target = "_blank">{name}</Link>
+                  <Link to={`/microgrid/details?uuid=${uuid}`} target="_blank">
+                    {name}
+                  </Link>
                 </h5>
-                <p className="fs--1 mb-2 mb-md-3">
-                    {address}
-                </p>
-                <p className="fs--1 mb-2 mb-md-3">
-                    {postal_code}
-                </p>
-                <p className="fs--1 mb-2 mb-md-3">
-                    {serial_number}
-                </p>
+                <p className="fs--1 mb-2 mb-md-3">{address}</p>
+                <p className="fs--1 mb-2 mb-md-3">{postal_code}</p>
+                <p className="fs--1 mb-2 mb-md-3">{serial_number}</p>
                 <div className="d-none d-lg-block">
-                    <p className="fs--1 mb-1">{t('Battery Power')}:<strong>{batteryPowerPointValue} kW</strong></p>
-                    <p className="fs--1 mb-1">{t('Photovoltaic Power')}:<strong>{photovoltaicPowerPointValue} kW</strong></p>
-                    <p className="fs--1 mb-1">{t('Load Power')}:<strong>{loadPowerPointValue} kW</strong></p>
-                    <p className="fs--1 mb-1">{t('Grid Power')}:<strong>{gridPowerPointValue} kW</strong></p>
-                  </div>
+                  <p className="fs--1 mb-1">
+                    {t('Battery Power')}:<strong>{batteryPowerPointValue} kW</strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('Photovoltaic Power')}:<strong>{photovoltaicPowerPointValue} kW</strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('Load Power')}:<strong>{loadPowerPointValue} kW</strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('Grid Power')}:<strong>{gridPowerPointValue} kW</strong>
+                  </p>
+                </div>
               </Col>
               <Col lg={5} tag={Flex} justify="between" column>
                 <div>
-                  <h4 className="fs-1 fs-md-2 text-warning mb-0">
-                    SoC: {batterySocPointValue} %
-                  </h4>
+                  <h4 className="fs-1 fs-md-2 text-warning mb-0">SoC: {batterySocPointValue} %</h4>
                   <p className="fs--1 mb-1">
-                      {t('Communication Status')}:{' '}
-                      <strong className={classNames({ 'text-success': isOnline, 'text-danger': !isOnline })}>
-                        {isOnline ? t('Communication Online') : t('Communication Offline')}
-                      </strong>
-                    </p>
-                    <p className="fs--1 mb-1">
-                      {t('Battery State')}:{' '}
-                      <strong className={classNames({ 'text-success': batteryState === 'Charging' || batteryState === 'Discharging',
-                      'text-danger':  batteryState === 'Unknown' || batteryState === 'Stopped'})}>
-                        {batteryState === 'Charging' ? t('Battery Charging') : batteryState === 'Discharging' ? t('Battery Discharging') : batteryState === 'Stopped' ? t('Battery Stopped'): t('Battery Unknown')}
-                      </strong>
-                    </p>
-                    <p className="fs--1 mb-1">
-                      {t('PCS Run State')}:{' '}
-                      <strong className={classNames({ 'text-success': PCSRunState === 'Running',
-                      'text-danger':  PCSRunState === 'Unknown' || PCSRunState === 'Initializing' || PCSRunState === 'Standby' || PCSRunState === 'Shutdown' || PCSRunState === 'Fault'})}>
-                        {PCSRunState === 'Running' ? t('PCS Running') : PCSRunState === 'Initializing' ? t('PCS Initializing') : PCSRunState === 'Standby' ? t('PCS Standby') : PCSRunState === 'Shutdown' ? t('PCS Shutdown') : PCSRunState === 'Fault' ? t('PCS Fault') : t('PCS Unknown')}
-                      </strong>
-                    </p>
-
+                    {t('Communication Status')}:{' '}
+                    <strong className={classNames({ 'text-success': isOnline, 'text-danger': !isOnline })}>
+                      {isOnline ? t('Communication Online') : t('Communication Offline')}
+                    </strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('Battery State')}:{' '}
+                    <strong
+                      className={classNames({
+                        'text-success': batteryState === 'Charging' || batteryState === 'Discharging',
+                        'text-danger': batteryState === 'Unknown' || batteryState === 'Stopped'
+                      })}
+                    >
+                      {batteryState === 'Charging'
+                        ? t('Battery Charging')
+                        : batteryState === 'Discharging'
+                        ? t('Battery Discharging')
+                        : batteryState === 'Stopped'
+                        ? t('Battery Stopped')
+                        : t('Battery Unknown')}
+                    </strong>
+                  </p>
+                  <p className="fs--1 mb-1">
+                    {t('PCS Run State')}:{' '}
+                    <strong
+                      className={classNames({
+                        'text-success': PCSRunState === 'Running',
+                        'text-danger':
+                          PCSRunState === 'Unknown' ||
+                          PCSRunState === 'Initializing' ||
+                          PCSRunState === 'Standby' ||
+                          PCSRunState === 'Shutdown' ||
+                          PCSRunState === 'Fault'
+                      })}
+                    >
+                      {PCSRunState === 'Running'
+                        ? t('PCS Running')
+                        : PCSRunState === 'Initializing'
+                        ? t('PCS Initializing')
+                        : PCSRunState === 'Standby'
+                        ? t('PCS Standby')
+                        : PCSRunState === 'Shutdown'
+                        ? t('PCS Shutdown')
+                        : PCSRunState === 'Fault'
+                        ? t('PCS Fault')
+                        : t('PCS Unknown')}
+                    </strong>
+                  </p>
                 </div>
                 <div className="mt-md-2">
                   <ButtonIcon
@@ -138,7 +178,7 @@ const MicrogridListItem = ({
                       'border-300': !isOnline
                     })}
                     icon={[isOnline ? 'fas' : 'far', 'exclamation-triangle']}
-                      onClick={() => window.open('notification', '_blank')}
+                    onClick={() => window.open('notification', '_blank')}
                   >
                     {t('Fault Alarms')}({alarms.length})
                   </ButtonIcon>
@@ -153,7 +193,6 @@ const MicrogridListItem = ({
                   >
                     {t('Maintenance')}
                   </ButtonIcon>
-
                 </div>
               </Col>
             </Row>
diff --git a/myems-web/src/components/MyEMS/Microgrid/MicrogridReporting.js b/myems-web/src/components/MyEMS/Microgrid/MicrogridReporting.js
index 708355ef19..4c35f644d7 100644
--- a/myems-web/src/components/MyEMS/Microgrid/MicrogridReporting.js
+++ b/myems-web/src/components/MyEMS/Microgrid/MicrogridReporting.js
@@ -30,9 +30,9 @@ import ButtonIcon from '../../common/ButtonIcon';
 import { APIBaseURL, settings } from '../../../config';
 import { periodTypeOptions } from '../common/PeriodTypeOptions';
 import { comparisonTypeOptions } from '../common/ComparisonTypeOptions';
-import { endOfDay} from 'date-fns';
+import { endOfDay } from 'date-fns';
 import AppContext from '../../../context/Context';
-import {Link, useLocation} from 'react-router-dom';
+import { Link, useLocation } from 'react-router-dom';
 import DateRangePickerWrapper from '../common/DateRangePickerWrapper';
 
 const DetailedDataTable = loadable(() => import('../common/DetailedDataTable'));
@@ -48,7 +48,7 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
     let user_display_name = getCookieValue('user_display_name');
     let user_uuid = getCookieValue('user_uuid');
     let token = getCookieValue('token');
-    if (checkEmpty(is_logged_in) || checkEmpty(token)|| checkEmpty(user_uuid) || !is_logged_in) {
+    if (checkEmpty(is_logged_in) || checkEmpty(token) || checkEmpty(user_uuid) || !is_logged_in) {
       setRedirectUrl(`/authentication/basic/login`);
       setRedirect(true);
     } else {
@@ -59,7 +59,7 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
       createCookie('user_uuid', user_uuid, settings.cookieExpireTime);
       createCookie('token', token, settings.cookieExpireTime);
     }
-    if (uuid === null || !uuid ){
+    if (uuid === null || !uuid) {
       setSpaceCascaderHidden(false);
       setMicrogridSearchHidden(false);
     } else {
@@ -78,9 +78,25 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
   const [comparisonType, setComparisonType] = useState('month-on-month');
   const [periodType, setPeriodType] = useState('daily');
   const [cascaderOptions, setCascaderOptions] = useState(undefined);
-  const [basePeriodDateRange, setBasePeriodDateRange] = useState([current_moment.clone().subtract(1, 'weeks').subtract(1, 'months').toDate(), current_moment.clone().subtract(1, 'months').toDate()]);
+  const [basePeriodDateRange, setBasePeriodDateRange] = useState([
+    current_moment
+      .clone()
+      .subtract(1, 'weeks')
+      .subtract(1, 'months')
+      .toDate(),
+    current_moment
+      .clone()
+      .subtract(1, 'months')
+      .toDate()
+  ]);
   const [basePeriodDateRangePickerDisabled, setBasePeriodDateRangePickerDisabled] = useState(true);
-  const [reportingPeriodDateRange, setReportingPeriodDateRange] = useState([current_moment.clone().subtract(1, 'weeks').toDate(), current_moment.toDate()]);
+  const [reportingPeriodDateRange, setReportingPeriodDateRange] = useState([
+    current_moment
+      .clone()
+      .subtract(1, 'weeks')
+      .toDate(),
+    current_moment.toDate()
+  ]);
   const dateRangePickerLocale = {
     sunday: t('sunday'),
     monday: t('monday'),
@@ -98,7 +114,7 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
     last7Days: t('last7Days'),
     formattedMonthPattern: 'yyyy-MM-dd'
   };
-  const dateRangePickerStyle = { display: 'block', zIndex: 10};
+  const dateRangePickerStyle = { display: 'block', zIndex: 10 };
   const { language } = useContext(AppContext);
   // buttons
   const [submitButtonDisabled, setSubmitButtonDisabled] = useState(true);
@@ -117,117 +133,138 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
   const [microgridSVG, setMicrogridSVG] = useState();
 
   const [cardSummaryList, setCardSummaryList] = useState([]);
-  const [microgridBaseLabels, setMicrogridBaseLabels] = useState({'a0': []});
-  const [microgridBaseData, setMicrogridBaseData] = useState({'a0': []});
-  const [microgridReportingNames, setMicrogridReportingNames] = useState({"a0":""});
-  const [microgridReportingUnits, setMicrogridReportingUnits] = useState({"a0":"()"});
-  const [microgridReportingSubtotals, setMicrogridReportingSubtotals] = useState({"a0": (0).toFixed(2)});
-  const [microgridReportingLabels, setMicrogridReportingLabels] = useState({"a0": []});
-  const [microgridReportingData, setMicrogridReportingData] = useState({"a0": []});
+  const [microgridBaseLabels, setMicrogridBaseLabels] = useState({ a0: [] });
+  const [microgridBaseData, setMicrogridBaseData] = useState({ a0: [] });
+  const [microgridReportingNames, setMicrogridReportingNames] = useState({ a0: '' });
+  const [microgridReportingUnits, setMicrogridReportingUnits] = useState({ a0: '()' });
+  const [microgridReportingSubtotals, setMicrogridReportingSubtotals] = useState({ a0: (0).toFixed(2) });
+  const [microgridReportingLabels, setMicrogridReportingLabels] = useState({ a0: [] });
+  const [microgridReportingData, setMicrogridReportingData] = useState({ a0: [] });
   const [microgridReportingOptions, setMicrogridReportingOptions] = useState([]);
   const [parameterLineChartLabels, setParameterLineChartLabels] = useState([]);
   const [parameterLineChartData, setParameterLineChartData] = useState({});
   const [parameterLineChartOptions, setParameterLineChartOptions] = useState([]);
-  const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]);
+  const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([
+    { dataField: 'startdatetime', text: t('Datetime'), sort: true }
+  ]);
   const [detailedDataTableData, setDetailedDataTableData] = useState([]);
   const [excelBytesBase64, setExcelBytesBase64] = useState(undefined);
 
   useEffect(() => {
     let isResponseOK = false;
-    if (uuid === null || !uuid ){
-      fetch(
-        APIBaseURL +
-        '/spaces/tree', {
+    if (uuid === null || !uuid) {
+      fetch(APIBaseURL + '/spaces/tree', {
         method: 'GET',
         headers: {
           'Content-type': 'application/json',
           'User-UUID': getCookieValue('user_uuid'),
           Token: getCookieValue('token')
         },
-        body: null,
-
-      }).then(response => {
-        console.log(response);
-        if (response.ok) {
-          isResponseOK = true;
-        }
-        return response.json();
-      }).then(json => {
-        console.log(json);
-        if (isResponseOK) {
-          // rename keys
-          json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
-          setCascaderOptions(json);
-          setSelectedSpaceName([json[0]].map(o => o.label));
-          setSelectedSpaceID([json[0]].map(o => o.value));
-          // get Microgrids by root Space ID
-          let isResponseOK = false;
-          fetch(
-            APIBaseURL +
-            '/spaces/' +
-            [json[0]].map(o => o.value) +
-            '/microgrids', {
-            method: 'GET',
-            headers: {
-              'Content-type': 'application/json',
-              'User-UUID': getCookieValue('user_uuid'),
-              Token: getCookieValue('token')
-            },
-            body: null,
-
-          }).then(response => {
-            if (response.ok) {
-              isResponseOK = true;
-            }
-            return response.json();
-          }).then(json => {
-            if (isResponseOK) {
-              json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
-              console.log(json);
-              setMicrogridList(json[0]);
-              setFilteredMicrogridList(json[0]);
-              if (json[0].length > 0) {
-                setSelectedMicrogrid(json[0][0].value);
-                // enable submit button
-                setSubmitButtonDisabled(false);
-              } else {
-                setSelectedMicrogrid(undefined);
-                // disable submit button
-                setSubmitButtonDisabled(true);
-              }
-            } else {
-              toast.error(t(json.description))
-            }
-          }).catch(err => {
-            console.log(err);
-          });
-          // end of get Microgrids by root Space ID
-        } else {
-          toast.error(t(json.description));
-        }
-      }).catch(err => {
-        console.log(err);
-      });
+        body: null
+      })
+        .then(response => {
+          console.log(response);
+          if (response.ok) {
+            isResponseOK = true;
+          }
+          return response.json();
+        })
+        .then(json => {
+          console.log(json);
+          if (isResponseOK) {
+            // rename keys
+            json = JSON.parse(
+              JSON.stringify([json])
+                .split('"id":')
+                .join('"value":')
+                .split('"name":')
+                .join('"label":')
+            );
+            setCascaderOptions(json);
+            setSelectedSpaceName([json[0]].map(o => o.label));
+            setSelectedSpaceID([json[0]].map(o => o.value));
+            // get Microgrids by root Space ID
+            let isResponseOK = false;
+            fetch(APIBaseURL + '/spaces/' + [json[0]].map(o => o.value) + '/microgrids', {
+              method: 'GET',
+              headers: {
+                'Content-type': 'application/json',
+                'User-UUID': getCookieValue('user_uuid'),
+                Token: getCookieValue('token')
+              },
+              body: null
+            })
+              .then(response => {
+                if (response.ok) {
+                  isResponseOK = true;
+                }
+                return response.json();
+              })
+              .then(json => {
+                if (isResponseOK) {
+                  json = JSON.parse(
+                    JSON.stringify([json])
+                      .split('"id":')
+                      .join('"value":')
+                      .split('"name":')
+                      .join('"label":')
+                  );
+                  console.log(json);
+                  setMicrogridList(json[0]);
+                  setFilteredMicrogridList(json[0]);
+                  if (json[0].length > 0) {
+                    setSelectedMicrogrid(json[0][0].value);
+                    // enable submit button
+                    setSubmitButtonDisabled(false);
+                  } else {
+                    setSelectedMicrogrid(undefined);
+                    // disable submit button
+                    setSubmitButtonDisabled(true);
+                  }
+                } else {
+                  toast.error(t(json.description));
+                }
+              })
+              .catch(err => {
+                console.log(err);
+              });
+            // end of get Microgrids by root Space ID
+          } else {
+            toast.error(t(json.description));
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
     } else {
-      let url = APIBaseURL + '/reports/microgridreporting?' +
-        'uuid=' + uuid +
-        '&periodtype=' + periodType +
-        '&baseperiodstartdatetime=' + (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-        '&baseperiodenddatetime=' + (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-        '&reportingperiodstartdatetime=' + moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
-        '&reportingperiodenddatetime=' + moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
-        '&language=' + language;
+      let url =
+        APIBaseURL +
+        '/reports/microgridreporting?' +
+        'uuid=' +
+        uuid +
+        '&periodtype=' +
+        periodType +
+        '&baseperiodstartdatetime=' +
+        (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+        '&baseperiodenddatetime=' +
+        (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+        '&reportingperiodstartdatetime=' +
+        moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
+        '&reportingperiodenddatetime=' +
+        moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
+        '&language=' +
+        language;
       loadData(url);
     }
   }, []);
 
-  const loadData = (url) => {
+  const loadData = url => {
     // disable submit button
     setSubmitButtonDisabled(true);
     // show spinner
     setSpinnerHidden(false);
     // hide export button
-    setExportButtonHidden(true)
+    setExportButtonHidden(true);
 
     // Reinitialize tables
     setDetailedDataTableData([]);
@@ -240,116 +277,115 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        console.log(json);
-        if(uuid !== null && uuid) {
-          setFilteredMicrogridList([{'id': json['microgrid']['id'], 'label': json['microgrid']['name']}]);
-          setSelectedMicrogrid(json['microgrid']['id']);
+      body: null
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
         }
-        setMicrogridName(json['microgrid']['name']);
-        setMicrogridSerialNumber(json['microgrid']['serial_number']);
-        setMicrogridAddress(json['microgrid']['address']);
-        setMicrogridPostalCode(json['microgrid']['postal_code']);
-        setMicrogridCapacity(json['microgrid']['capacity']);
-        setMicrogridLatitude(json['microgrid']['latitude']);
-        setMicrogridLongitude(json['microgrid']['longitude']);
-        setMicrogridSVG({__html: json['microgrid']['svg']});
-        let timestamps = {}
-        json['parameters']['timestamps'].forEach((currentValue, index) => {
-          timestamps['a' + index] = currentValue;
-        });
-        setParameterLineChartLabels(timestamps);
-
-        let values = {}
-        json['parameters']['values'].forEach((currentValue, index) => {
-          values['a' + index] = currentValue;
-        });
-        setParameterLineChartData(values);
-
-        let names = Array();
-        json['parameters']['names'].forEach((currentValue, index) => {
-
-          names.push({ 'value': 'a' + index, 'label': currentValue });
-        });
-        setParameterLineChartOptions(names);
-
-        let cardSummaryArray = []
-        json['reporting_period']['names'].forEach((currentValue, index) => {
-          let cardSummaryItem = {};
-          cardSummaryItem['name'] = json['reporting_period']['names'][index];
-          cardSummaryItem['unit'] = json['reporting_period']['units'][index];
-          cardSummaryItem['subtotal'] = json['reporting_period']['subtotals'][index];
-          cardSummaryItem['increment_rate'] = parseFloat(json['reporting_period']['increment_rates'][index] * 100).toFixed(2) + "%";
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          console.log(json);
+          if (uuid !== null && uuid) {
+            setFilteredMicrogridList([{ id: json['microgrid']['id'], label: json['microgrid']['name'] }]);
+            setSelectedMicrogrid(json['microgrid']['id']);
+          }
+          setMicrogridName(json['microgrid']['name']);
+          setMicrogridSerialNumber(json['microgrid']['serial_number']);
+          setMicrogridAddress(json['microgrid']['address']);
+          setMicrogridPostalCode(json['microgrid']['postal_code']);
+          setMicrogridCapacity(json['microgrid']['capacity']);
+          setMicrogridLatitude(json['microgrid']['latitude']);
+          setMicrogridLongitude(json['microgrid']['longitude']);
+          setMicrogridSVG({ __html: json['microgrid']['svg'] });
+          let timestamps = {};
+          json['parameters']['timestamps'].forEach((currentValue, index) => {
+            timestamps['a' + index] = currentValue;
+          });
+          setParameterLineChartLabels(timestamps);
 
-          cardSummaryArray.push(cardSummaryItem);
-        });
-        setCardSummaryList(cardSummaryArray);
+          let values = {};
+          json['parameters']['values'].forEach((currentValue, index) => {
+            values['a' + index] = currentValue;
+          });
+          setParameterLineChartData(values);
 
+          let names = Array();
+          json['parameters']['names'].forEach((currentValue, index) => {
+            names.push({ value: 'a' + index, label: currentValue });
+          });
+          setParameterLineChartOptions(names);
+
+          let cardSummaryArray = [];
+          json['reporting_period']['names'].forEach((currentValue, index) => {
+            let cardSummaryItem = {};
+            cardSummaryItem['name'] = json['reporting_period']['names'][index];
+            cardSummaryItem['unit'] = json['reporting_period']['units'][index];
+            cardSummaryItem['subtotal'] = json['reporting_period']['subtotals'][index];
+            cardSummaryItem['increment_rate'] =
+              parseFloat(json['reporting_period']['increment_rates'][index] * 100).toFixed(2) + '%';
+
+            cardSummaryArray.push(cardSummaryItem);
+          });
+          setCardSummaryList(cardSummaryArray);
 
-        let base_and_reporting_names = {}
-        json['reporting_period']['names'].forEach((currentValue, index) => {
-          base_and_reporting_names['a' + index] = currentValue;
-        });
-        setMicrogridReportingNames(base_and_reporting_names)
+          let base_and_reporting_names = {};
+          json['reporting_period']['names'].forEach((currentValue, index) => {
+            base_and_reporting_names['a' + index] = currentValue;
+          });
+          setMicrogridReportingNames(base_and_reporting_names);
 
-        let base_and_reporting_units = {}
-        json['reporting_period']['units'].forEach((currentValue, index) => {
-          base_and_reporting_units['a' + index] = "("+currentValue+")";
-        });
-        setMicrogridReportingUnits(base_and_reporting_units)
+          let base_and_reporting_units = {};
+          json['reporting_period']['units'].forEach((currentValue, index) => {
+            base_and_reporting_units['a' + index] = '(' + currentValue + ')';
+          });
+          setMicrogridReportingUnits(base_and_reporting_units);
 
+          let reporting_timestamps = {};
+          json['reporting_period']['timestamps'].forEach((currentValue, index) => {
+            reporting_timestamps['a' + index] = currentValue;
+          });
+          setMicrogridReportingLabels(reporting_timestamps);
 
-        let reporting_timestamps = {}
-        json['reporting_period']['timestamps'].forEach((currentValue, index) => {
-          reporting_timestamps['a' + index] = currentValue;
-        });
-        setMicrogridReportingLabels(reporting_timestamps);
+          let reporting_values = {};
+          json['reporting_period']['values'].forEach((currentValue, index) => {
+            reporting_values['a' + index] = currentValue;
+          });
+          console.log(reporting_values);
+          setMicrogridReportingData(reporting_values);
 
-        let reporting_values = {}
-        json['reporting_period']['values'].forEach((currentValue, index) => {
-          reporting_values['a' + index] = currentValue;
-        });
-        console.log(reporting_values);
-        setMicrogridReportingData(reporting_values);
+          let reporting_subtotals = {};
+          json['reporting_period']['subtotals'].forEach((currentValue, index) => {
+            reporting_subtotals['a' + index] = currentValue.toFixed(2);
+          });
+          setMicrogridReportingSubtotals(reporting_subtotals);
 
-        let reporting_subtotals = {}
-        json['reporting_period']['subtotals'].forEach((currentValue, index) => {
-          reporting_subtotals['a' + index] = currentValue.toFixed(2);
-        });
-        setMicrogridReportingSubtotals(reporting_subtotals);
+          let options = Array();
+          json['reporting_period']['names'].forEach((currentValue, index) => {
+            let unit = json['reporting_period']['units'][index];
+            options.push({ value: 'a' + index, label: currentValue + ' (' + unit + ')' });
+          });
+          setMicrogridReportingOptions(options);
+          setExcelBytesBase64(json['excel_bytes_base64']);
 
-        let options = Array();
-        json['reporting_period']['names'].forEach((currentValue, index) => {
-          let unit = json['reporting_period']['units'][index];
-          options.push({ 'value': 'a' + index, 'label': currentValue + ' (' + unit + ')'});
-        });
-        setMicrogridReportingOptions(options);
-        setExcelBytesBase64(json['excel_bytes_base64']);
-
-        // enable submit button
-        setSubmitButtonDisabled(false);
-        // hide spinner
-        setSpinnerHidden(true);
-        // show export button
-        setExportButtonHidden(false);
-      } else {
-        toast.error(t(json.description))
-        setSpinnerHidden(true);
-        setSubmitButtonDisabled(false);
-      }
-    })
-    .catch(err => {
-      console.log(err);
-    });
-  }
+          // enable submit button
+          setSubmitButtonDisabled(false);
+          // hide spinner
+          setSpinnerHidden(true);
+          // show export button
+          setExportButtonHidden(false);
+        } else {
+          toast.error(t(json.description));
+          setSpinnerHidden(true);
+          setSubmitButtonDisabled(false);
+        }
+      })
+      .catch(err => {
+        console.log(err);
+      });
+  };
   const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';
 
   let onSpaceCascaderChange = (value, selectedOptions) => {
@@ -357,52 +393,54 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
     setSelectedSpaceID(value[value.length - 1]);
 
     let isResponseOK = false;
-    fetch(
-      APIBaseURL +
-      '/spaces/' +
-      value[value.length - 1] +
-      '/microgrids', {
+    fetch(APIBaseURL + '/spaces/' + value[value.length - 1] + '/microgrids', {
       method: 'GET',
       headers: {
         'Content-type': 'application/json',
         'User-UUID': getCookieValue('user_uuid'),
         Token: getCookieValue('token')
       },
-      body: null,
-
-    }).then(response => {
-      if (response.ok) {
-        isResponseOK = true;
-      }
-      return response.json();
-    }).then(json => {
-      if (isResponseOK) {
-        json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
-        console.log(json)
-        setMicrogridList(json[0]);
-        setFilteredMicrogridList(json[0]);
-        if (json[0].length > 0) {
-          setSelectedMicrogrid(json[0][0].value);
-          // enable submit button
-          setSubmitButtonDisabled(false);
+      body: null
+    })
+      .then(response => {
+        if (response.ok) {
+          isResponseOK = true;
+        }
+        return response.json();
+      })
+      .then(json => {
+        if (isResponseOK) {
+          json = JSON.parse(
+            JSON.stringify([json])
+              .split('"id":')
+              .join('"value":')
+              .split('"name":')
+              .join('"label":')
+          );
+          console.log(json);
+          setMicrogridList(json[0]);
+          setFilteredMicrogridList(json[0]);
+          if (json[0].length > 0) {
+            setSelectedMicrogrid(json[0][0].value);
+            // enable submit button
+            setSubmitButtonDisabled(false);
+          } else {
+            setSelectedMicrogrid(undefined);
+            // disable submit button
+            setSubmitButtonDisabled(true);
+          }
         } else {
-          setSelectedMicrogrid(undefined);
-          // disable submit button
-          setSubmitButtonDisabled(true);
+          toast.error(t(json.description));
         }
-      } else {
-        toast.error(t(json.description))
-      }
-    }).catch(err => {
-      console.log(err);
-    });
+      })
+      .catch(err => {
+        console.log(err);
+      });
   };
 
   const onSearchMicrogrid = ({ target }) => {
     const keyword = target.value.toLowerCase();
-    const filteredResult = microgridList.filter(
-      microgrid => microgrid.label.toLowerCase().includes(keyword)
-    );
+    const filteredResult = microgridList.filter(microgrid => microgrid.label.toLowerCase().includes(keyword));
     setFilteredMicrogridList(keyword.length ? filteredResult : microgridList);
     if (filteredResult.length > 0) {
       setSelectedMicrogrid(filteredResult[0].value);
@@ -412,7 +450,7 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
       setSelectedMicrogrid(undefined);
       // disable submit button
       setSubmitButtonDisabled(true);
-    };
+    }
     let customInputTarget = document.getElementById('icrogridSelect');
     customInputTarget.value = filteredResult[0].value;
   };
@@ -422,16 +460,34 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
     setComparisonType(target.value);
     if (target.value === 'year-over-year') {
       setBasePeriodDateRangePickerDisabled(true);
-      setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'years').toDate(),
-        moment(reportingPeriodDateRange[1]).subtract(1, 'years').toDate()]);
+      setBasePeriodDateRange([
+        moment(reportingPeriodDateRange[0])
+          .subtract(1, 'years')
+          .toDate(),
+        moment(reportingPeriodDateRange[1])
+          .subtract(1, 'years')
+          .toDate()
+      ]);
     } else if (target.value === 'month-on-month') {
       setBasePeriodDateRangePickerDisabled(true);
-      setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'months').toDate(),
-        moment(reportingPeriodDateRange[1]).subtract(1, 'months').toDate()]);
+      setBasePeriodDateRange([
+        moment(reportingPeriodDateRange[0])
+          .subtract(1, 'months')
+          .toDate(),
+        moment(reportingPeriodDateRange[1])
+          .subtract(1, 'months')
+          .toDate()
+      ]);
     } else if (target.value === 'free-comparison') {
       setBasePeriodDateRangePickerDisabled(false);
-      setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'days').toDate(),
-        moment(reportingPeriodDateRange[1]).subtract(1, 'days').toDate()]);
+      setBasePeriodDateRange([
+        moment(reportingPeriodDateRange[0])
+          .subtract(1, 'days')
+          .toDate(),
+        moment(reportingPeriodDateRange[1])
+          .subtract(1, 'days')
+          .toDate()
+      ]);
     } else if (target.value === 'none-comparison') {
       setBasePeriodDateRange([null, null]);
       setBasePeriodDateRangePickerDisabled(true);
@@ -439,11 +495,11 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
   };
 
   // Callback fired when value changed
-  let onBasePeriodChange = (DateRange) => {
-    if(DateRange == null) {
+  let onBasePeriodChange = DateRange => {
+    if (DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -452,19 +508,37 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
   };
 
   // Callback fired when value changed
-  let onReportingPeriodChange = (DateRange) => {
-    if(DateRange == null) {
+  let onReportingPeriodChange = DateRange => {
+    if (DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
       setReportingPeriodDateRange([DateRange[0], DateRange[1]]);
       if (comparisonType === 'year-over-year') {
-        setBasePeriodDateRange([moment(DateRange[0]).clone().subtract(1, 'years').toDate(), moment(DateRange[1]).clone().subtract(1, 'years').toDate()]);
+        setBasePeriodDateRange([
+          moment(DateRange[0])
+            .clone()
+            .subtract(1, 'years')
+            .toDate(),
+          moment(DateRange[1])
+            .clone()
+            .subtract(1, 'years')
+            .toDate()
+        ]);
       } else if (comparisonType === 'month-on-month') {
-        setBasePeriodDateRange([moment(DateRange[0]).clone().subtract(1, 'months').toDate(), moment(DateRange[1]).clone().subtract(1, 'months').toDate()]);
+        setBasePeriodDateRange([
+          moment(DateRange[0])
+            .clone()
+            .subtract(1, 'months')
+            .toDate(),
+          moment(DateRange[1])
+            .clone()
+            .subtract(1, 'months')
+            .toDate()
+        ]);
       }
     }
   };
@@ -487,37 +561,46 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
     console.log(selectedMicrogrid);
     console.log(comparisonType);
     console.log(periodType);
-    console.log(basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : null)
-    console.log(basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : null)
-    console.log(moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss'))
+    console.log(basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : null);
+    console.log(basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : null);
+    console.log(moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss'));
     console.log(moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss'));
 
-    let url = APIBaseURL + '/reports/microgridreporting?' +
-      'id=' + selectedMicrogrid +
-      '&periodtype=' + periodType +
-      '&baseperiodstartdatetime=' + (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-      '&baseperiodenddatetime=' + (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
-      '&reportingperiodstartdatetime=' + moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
-      '&reportingperiodenddatetime=' + moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
-      '&language=' + language;
+    let url =
+      APIBaseURL +
+      '/reports/microgridreporting?' +
+      'id=' +
+      selectedMicrogrid +
+      '&periodtype=' +
+      periodType +
+      '&baseperiodstartdatetime=' +
+      (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+      '&baseperiodenddatetime=' +
+      (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
+      '&reportingperiodstartdatetime=' +
+      moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
+      '&reportingperiodenddatetime=' +
+      moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') +
+      '&language=' +
+      language;
     loadData(url);
   };
 
   const handleExport = e => {
     e.preventDefault();
-    const mimeType='application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
-    const fileName = 'microgridreproting.xlsx'
-    var fileUrl = "data:" + mimeType + ";base64," + excelBytesBase64;
+    const mimeType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
+    const fileName = 'microgridreproting.xlsx';
+    var fileUrl = 'data:' + mimeType + ';base64,' + excelBytesBase64;
     fetch(fileUrl)
-        .then(response => response.blob())
-        .then(blob => {
-            var link = window.document.createElement('a');
-            link.href = window.URL.createObjectURL(blob, { type: mimeType });
-            link.download = fileName;
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-        });
+      .then(response => response.blob())
+      .then(blob => {
+        var link = window.document.createElement('a');
+        link.href = window.URL.createObjectURL(blob, { type: mimeType });
+        link.download = fileName;
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+      });
   };
 
   return (
@@ -525,17 +608,19 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
       <Card className="bg-light mb-3">
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
-            <Row form >
+            <Row form>
               <Col xs={6} sm={3} hidden={spaceCascaderHidden}>
-                <FormGroup className="form-group" >
+                <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
                   </Label>
                   <br />
-                  <Cascader options={cascaderOptions}
+                  <Cascader
+                    options={cascaderOptions}
                     onChange={onSpaceCascaderChange}
                     changeOnSelect
-                    expandTrigger="hover">
+                    expandTrigger="hover"
+                  >
                     <Input value={selectedSpaceName || ''} readOnly />
                   </Cascader>
                 </FormGroup>
@@ -547,17 +632,20 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
                   </Label>
 
                   <Form inline>
-                      <Input placeholder={t('Search')} onChange={onSearchMicrogrid} hidden={microgridSearchHidden} />
-                      <CustomInput type="select" id="microgridSelect" name="microgridSelect" onChange={({ target }) => setSelectedMicrogrid(target.value)}
-                      >
-                        {filteredMicrogridList.map((microgrid, index) => (
-                          <option value={microgrid.value} key={microgrid.value}>
-                            {microgrid.label}
-                          </option>
-                        ))}
-                      </CustomInput>
+                    <Input placeholder={t('Search')} onChange={onSearchMicrogrid} hidden={microgridSearchHidden} />
+                    <CustomInput
+                      type="select"
+                      id="microgridSelect"
+                      name="microgridSelect"
+                      onChange={({ target }) => setSelectedMicrogrid(target.value)}
+                    >
+                      {filteredMicrogridList.map((microgrid, index) => (
+                        <option value={microgrid.value} key={microgrid.value}>
+                          {microgrid.label}
+                        </option>
+                      ))}
+                    </CustomInput>
                   </Form>
-
                 </FormGroup>
               </Col>
               <Col xs="auto">
@@ -565,12 +653,15 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
                   <Label className={labelClasses} for="comparisonType">
                     {t('Comparison Types')}
                   </Label>
-                  <CustomInput type="select" id="comparisonType" name="comparisonType"
+                  <CustomInput
+                    type="select"
+                    id="comparisonType"
+                    name="comparisonType"
                     defaultValue="month-on-month"
                     onChange={onComparisonTypeChange}
                   >
                     {comparisonTypeOptions.map((comparisonType, index) => (
-                      <option value={comparisonType.value} key={comparisonType.value} >
+                      <option value={comparisonType.value} key={comparisonType.value}>
                         {t(comparisonType.label)}
                       </option>
                     ))}
@@ -582,10 +673,15 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
                   <Label className={labelClasses} for="periodType">
                     {t('Period Types')}
                   </Label>
-                  <CustomInput type="select" id="periodType" name="periodType" defaultValue="daily" onChange={({ target }) => setPeriodType(target.value)}
+                  <CustomInput
+                    type="select"
+                    id="periodType"
+                    name="periodType"
+                    defaultValue="daily"
+                    onChange={({ target }) => setPeriodType(target.value)}
                   >
                     {periodTypeOptions.map((periodType, index) => (
-                      <option value={periodType.value} key={periodType.value} >
+                      <option value={periodType.value} key={periodType.value}>
                         {t(periodType.label)}
                       </option>
                     ))}
@@ -594,9 +690,12 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
               </Col>
               <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
-                  <Label className={labelClasses} for="basePeriodDateRangePicker">{t('Base Period')}{t('(Optional)')}</Label>
+                  <Label className={labelClasses} for="basePeriodDateRangePicker">
+                    {t('Base Period')}
+                    {t('(Optional)')}
+                  </Label>
                   <DateRangePickerWrapper
-                    id='basePeriodDateRangePicker'
+                    id="basePeriodDateRangePicker"
                     disabled={basePeriodDateRangePickerDisabled}
                     format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
@@ -606,13 +705,15 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
                     placeholder={t('Select Date Range')}
-                   />
+                  />
                 </FormGroup>
               </Col>
               <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
-                  <Label className={labelClasses} for="reportingPeriodDateRangePicker">{t('Reporting Period')}</Label>
-                  <br/>
+                  <Label className={labelClasses} for="reportingPeriodDateRangePicker">
+                    {t('Reporting Period')}
+                  </Label>
+                  <br />
                   <DateRangePickerWrapper
                     id="reportingPeriodDateRangePicker"
                     format="yyyy-MM-dd HH:mm:ss"
@@ -628,25 +729,31 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
               </Col>
               <Col xs="auto">
                 <FormGroup>
-                  <br/>
+                  <br />
                   <ButtonGroup id="submit">
-                    <Button color="success" disabled={submitButtonDisabled} >{t('Submit')}</Button>
+                    <Button color="success" disabled={submitButtonDisabled}>
+                      {t('Submit')}
+                    </Button>
                   </ButtonGroup>
                 </FormGroup>
               </Col>
               <Col xs="auto">
                 <FormGroup>
                   <br />
-                  <Spinner color="primary" hidden={spinnerHidden}  />
+                  <Spinner color="primary" hidden={spinnerHidden} />
                 </FormGroup>
               </Col>
               <Col xs="auto">
-                  <br />
-                  <ButtonIcon icon="external-link-alt" transform="shrink-3 down-2" color="falcon-default"
+                <br />
+                <ButtonIcon
+                  icon="external-link-alt"
+                  transform="shrink-3 down-2"
+                  color="falcon-default"
                   hidden={exportButtonHidden}
-                  onClick={handleExport} >
-                    {t('Export')}
-                  </ButtonIcon>
+                  onClick={handleExport}
+                >
+                  {t('Export')}
+                </ButtonIcon>
               </Col>
             </Row>
           </Form>
@@ -654,30 +761,67 @@ const MicrogridReporting = ({ setRedirect, setRedirectUrl, t }) => {
       </Card>
       <div className="card-deck">
         {cardSummaryList.map(cardSummaryItem => (
-            <CardSummary key={cardSummaryItem['name']}
-              title={cardSummaryItem['name'] + '(' + cardSummaryItem['unit'] + ')' }
-              color="success" >
-              {cardSummaryItem['subtotal'] && <CountUp end={cardSummaryItem['subtotal']} duration={2} prefix="" separator="," decimal="." decimals={2} />}
-            </CardSummary>
+          <CardSummary
+            key={cardSummaryItem['name']}
+            title={cardSummaryItem['name'] + '(' + cardSummaryItem['unit'] + ')'}
+            color="success"
+          >
+            {cardSummaryItem['subtotal'] && (
+              <CountUp
+                end={cardSummaryItem['subtotal']}
+                duration={2}
+                prefix=""
+                separator=","
+                decimal="."
+                decimals={2}
+              />
+            )}
+          </CardSummary>
         ))}
       </div>
-      <MultiTrendChart reportingTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": microgridReportingNames, "VALUE": microgridReportingSubtotals, "UNIT": microgridReportingUnits}}
-        baseTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": {"a0":""}, "VALUE": {"a0": (0).toFixed(2)}, "UNIT": {"a0":"()"}}}
-        reportingTooltipTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": {"a0":""}, "VALUE": null, "UNIT": {"a0":"()"}}}
-        baseTooltipTitle = {{"name": "CATEGORY VALUE UNIT", "substitute": ["CATEGORY", "VALUE", "UNIT"], "CATEGORY": {"a0":""}, "VALUE": null, "UNIT": {"a0":"()"}}}
+      <MultiTrendChart
+        reportingTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: microgridReportingNames,
+          VALUE: microgridReportingSubtotals,
+          UNIT: microgridReportingUnits
+        }}
+        baseTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: { a0: '' },
+          VALUE: { a0: (0).toFixed(2) },
+          UNIT: { a0: '()' }
+        }}
+        reportingTooltipTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: { a0: '' },
+          VALUE: null,
+          UNIT: { a0: '()' }
+        }}
+        baseTooltipTitle={{
+          name: 'CATEGORY VALUE UNIT',
+          substitute: ['CATEGORY', 'VALUE', 'UNIT'],
+          CATEGORY: { a0: '' },
+          VALUE: null,
+          UNIT: { a0: '()' }
+        }}
         reportingLabels={microgridReportingLabels}
         reportingData={microgridReportingData}
         baseLabels={microgridReportingLabels}
         baseData={microgridReportingData}
-        rates={{"a0": []}}
-        options={microgridReportingOptions}>
-      </MultiTrendChart>
-      <MultipleLineChart reportingTitle={t('Operating Characteristic Curve')}
-            baseTitle=''
-            labels={parameterLineChartLabels}
-            data={parameterLineChartData}
-            options={parameterLineChartOptions}>
-      </MultipleLineChart>
+        rates={{ a0: [] }}
+        options={microgridReportingOptions}
+      />
+      <MultipleLineChart
+        reportingTitle={t('Operating Characteristic Curve')}
+        baseTitle=""
+        labels={parameterLineChartLabels}
+        data={parameterLineChartData}
+        options={parameterLineChartOptions}
+      />
     </Fragment>
   );
 };
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorBatch.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorBatch.js
index 0fab0c2d00..325cd12ef1 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorBatch.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorBatch.js
@@ -155,7 +155,7 @@ const ShopfloorBatch = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCarbon.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCarbon.js
index 62fd608866..f2b9f6c549 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCarbon.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCarbon.js
@@ -274,7 +274,7 @@ const ShopfloorCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -287,7 +287,7 @@ const ShopfloorCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCost.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCost.js
index f059fb03cd..755091bfb2 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCost.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorCost.js
@@ -274,7 +274,7 @@ const ShopfloorCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -287,7 +287,7 @@ const ShopfloorCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js
index 3fc7325cee..6bda521abc 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js
@@ -791,7 +791,7 @@ const ShopfloorEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -804,7 +804,7 @@ const ShopfloorEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js
index 63d5fb335c..f74adca9d6 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js
@@ -273,7 +273,7 @@ const ShopfloorEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -286,7 +286,7 @@ const ShopfloorEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js
index ced5f70c5c..fada9285df 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js
@@ -268,7 +268,7 @@ const ShopfloorLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -281,7 +281,7 @@ const ShopfloorLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js
index 0ac80d48b1..196ad56689 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js
@@ -277,7 +277,7 @@ const ShopfloorSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -290,7 +290,7 @@ const ShopfloorSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js
index fd3a4e00b4..973d22d453 100644
--- a/myems-web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js
+++ b/myems-web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js
@@ -273,7 +273,7 @@ const ShopfloorStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -286,7 +286,7 @@ const ShopfloorStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceCarbon.js b/myems-web/src/components/MyEMS/Space/SpaceCarbon.js
index f94108c7c3..8b22f49e02 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceCarbon.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceCarbon.js
@@ -210,7 +210,7 @@ const SpaceCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -223,7 +223,7 @@ const SpaceCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceCost.js b/myems-web/src/components/MyEMS/Space/SpaceCost.js
index c0c1f13f9f..ea56a88b9e 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceCost.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceCost.js
@@ -210,7 +210,7 @@ const SpaceCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -223,7 +223,7 @@ const SpaceCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceEfficiency.js b/myems-web/src/components/MyEMS/Space/SpaceEfficiency.js
index 495c71de1e..1c2cca7ed5 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceEfficiency.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceEfficiency.js
@@ -198,7 +198,7 @@ const SpaceEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -211,7 +211,7 @@ const SpaceEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceEnergyCategory.js b/myems-web/src/components/MyEMS/Space/SpaceEnergyCategory.js
index 2b87af445b..beef806d50 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceEnergyCategory.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceEnergyCategory.js
@@ -821,7 +821,7 @@ const SpaceEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -834,7 +834,7 @@ const SpaceEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceEnergyItem.js b/myems-web/src/components/MyEMS/Space/SpaceEnergyItem.js
index 0c7ee6e8bd..75b39776ee 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceEnergyItem.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceEnergyItem.js
@@ -204,7 +204,7 @@ const SpaceEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -217,7 +217,7 @@ const SpaceEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceIncome.js b/myems-web/src/components/MyEMS/Space/SpaceIncome.js
index deee50216a..a137424d0b 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceIncome.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceIncome.js
@@ -205,7 +205,7 @@ const SpaceIncome = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -218,7 +218,7 @@ const SpaceIncome = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceLoad.js b/myems-web/src/components/MyEMS/Space/SpaceLoad.js
index 37173840d4..4f8b4a739a 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceLoad.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceLoad.js
@@ -197,7 +197,7 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -210,7 +210,7 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceOutput.js b/myems-web/src/components/MyEMS/Space/SpaceOutput.js
index 9ec3623211..9dcede0ee6 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceOutput.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceOutput.js
@@ -202,7 +202,7 @@ const SpaceOutput = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -215,7 +215,7 @@ const SpaceOutput = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceSaving.js b/myems-web/src/components/MyEMS/Space/SpaceSaving.js
index a7929a51fc..a6207fa7b8 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceSaving.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceSaving.js
@@ -208,7 +208,7 @@ const SpaceSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -221,7 +221,7 @@ const SpaceSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Space/SpaceStatistics.js b/myems-web/src/components/MyEMS/Space/SpaceStatistics.js
index 889fd9626d..eced13362d 100644
--- a/myems-web/src/components/MyEMS/Space/SpaceStatistics.js
+++ b/myems-web/src/components/MyEMS/Space/SpaceStatistics.js
@@ -199,7 +199,7 @@ const SpaceStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -212,7 +212,7 @@ const SpaceStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreBatch.js b/myems-web/src/components/MyEMS/Store/StoreBatch.js
index ea29e8de37..aba98dae2f 100644
--- a/myems-web/src/components/MyEMS/Store/StoreBatch.js
+++ b/myems-web/src/components/MyEMS/Store/StoreBatch.js
@@ -153,7 +153,7 @@ const StoreBatch = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreCarbon.js b/myems-web/src/components/MyEMS/Store/StoreCarbon.js
index dd8e02698b..2b26746550 100644
--- a/myems-web/src/components/MyEMS/Store/StoreCarbon.js
+++ b/myems-web/src/components/MyEMS/Store/StoreCarbon.js
@@ -275,7 +275,7 @@ const StoreCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -288,7 +288,7 @@ const StoreCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreCost.js b/myems-web/src/components/MyEMS/Store/StoreCost.js
index 5572f88747..edfa6ff2cf 100644
--- a/myems-web/src/components/MyEMS/Store/StoreCost.js
+++ b/myems-web/src/components/MyEMS/Store/StoreCost.js
@@ -275,7 +275,7 @@ const StoreCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -288,7 +288,7 @@ const StoreCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreEnergyCategory.js b/myems-web/src/components/MyEMS/Store/StoreEnergyCategory.js
index 5df5aa9d51..79f82424c1 100644
--- a/myems-web/src/components/MyEMS/Store/StoreEnergyCategory.js
+++ b/myems-web/src/components/MyEMS/Store/StoreEnergyCategory.js
@@ -792,7 +792,7 @@ const StoreEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -805,7 +805,7 @@ const StoreEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreEnergyItem.js b/myems-web/src/components/MyEMS/Store/StoreEnergyItem.js
index 058abceac1..36005ea61d 100644
--- a/myems-web/src/components/MyEMS/Store/StoreEnergyItem.js
+++ b/myems-web/src/components/MyEMS/Store/StoreEnergyItem.js
@@ -273,7 +273,7 @@ const StoreEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -286,7 +286,7 @@ const StoreEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreLoad.js b/myems-web/src/components/MyEMS/Store/StoreLoad.js
index 0038333cfe..031ab3f13e 100644
--- a/myems-web/src/components/MyEMS/Store/StoreLoad.js
+++ b/myems-web/src/components/MyEMS/Store/StoreLoad.js
@@ -270,7 +270,7 @@ const StoreLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -283,7 +283,7 @@ const StoreLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreSaving.js b/myems-web/src/components/MyEMS/Store/StoreSaving.js
index da259cda26..5800f00d1e 100644
--- a/myems-web/src/components/MyEMS/Store/StoreSaving.js
+++ b/myems-web/src/components/MyEMS/Store/StoreSaving.js
@@ -277,7 +277,7 @@ const StoreSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -290,7 +290,7 @@ const StoreSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Store/StoreStatistics.js b/myems-web/src/components/MyEMS/Store/StoreStatistics.js
index 141f491e09..224ae93e52 100644
--- a/myems-web/src/components/MyEMS/Store/StoreStatistics.js
+++ b/myems-web/src/components/MyEMS/Store/StoreStatistics.js
@@ -271,7 +271,7 @@ const StoreStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -284,7 +284,7 @@ const StoreStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantBatch.js b/myems-web/src/components/MyEMS/Tenant/TenantBatch.js
index c6b2fd6a96..54b8c79a95 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantBatch.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantBatch.js
@@ -154,7 +154,7 @@ const [reportingPeriodDateRange, setReportingPeriodDateRange] = useState([curren
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantBill.js b/myems-web/src/components/MyEMS/Tenant/TenantBill.js
index cee70f2949..f095f4be31 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantBill.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantBill.js
@@ -279,7 +279,7 @@ const [reportingPeriodDateRange, setReportingPeriodDateRange] = useState([curren
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantCarbon.js b/myems-web/src/components/MyEMS/Tenant/TenantCarbon.js
index f4318edb37..80410d284f 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantCarbon.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantCarbon.js
@@ -274,7 +274,7 @@ const TenantCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -287,7 +287,7 @@ const TenantCarbon = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantCost.js b/myems-web/src/components/MyEMS/Tenant/TenantCost.js
index ab38f6bb65..5ac733338f 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantCost.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantCost.js
@@ -274,7 +274,7 @@ const TenantCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -287,7 +287,7 @@ const TenantCost = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantEnergyCategory.js b/myems-web/src/components/MyEMS/Tenant/TenantEnergyCategory.js
index d08862a8d4..a2044678ba 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantEnergyCategory.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantEnergyCategory.js
@@ -791,7 +791,7 @@ const TenantEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -804,7 +804,7 @@ const TenantEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantEnergyItem.js b/myems-web/src/components/MyEMS/Tenant/TenantEnergyItem.js
index 331b004f5f..87a7c034ea 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantEnergyItem.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantEnergyItem.js
@@ -272,7 +272,7 @@ const TenantEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -285,7 +285,7 @@ const TenantEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantLoad.js b/myems-web/src/components/MyEMS/Tenant/TenantLoad.js
index f9265dc20a..fca3f6309c 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantLoad.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantLoad.js
@@ -268,7 +268,7 @@ const TenantLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -281,7 +281,7 @@ const TenantLoad = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantSaving.js b/myems-web/src/components/MyEMS/Tenant/TenantSaving.js
index aaf7351acf..70ff39e9a4 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantSaving.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantSaving.js
@@ -277,7 +277,7 @@ const TenantSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -290,7 +290,7 @@ const TenantSaving = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
diff --git a/myems-web/src/components/MyEMS/Tenant/TenantStatistics.js b/myems-web/src/components/MyEMS/Tenant/TenantStatistics.js
index cade5907f7..c01158b08a 100644
--- a/myems-web/src/components/MyEMS/Tenant/TenantStatistics.js
+++ b/myems-web/src/components/MyEMS/Tenant/TenantStatistics.js
@@ -270,7 +270,7 @@ const TenantStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setBasePeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }
@@ -283,7 +283,7 @@ const TenantStatistics = ({ setRedirect, setRedirectUrl, t }) => {
     if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
     } else {
-      if (moment(DateRange[1]).format('HH:mm:ss') == '00:00:00') {
+      if (moment(DateRange[1]).format('HH:mm:ss') === '00:00:00') {
         // if the user did not change time value, set the default time to the end of day
         DateRange[1] = endOfDay(DateRange[1]);
       }