Added block calendar day for BOD-94

client/src/components/schedule-calendar-wrapper/schedule-calendar-header.component.js

@@ -9,6 +9,8 @@ import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 import { Progress } from "antd";
 import { MdCallReceived, MdCallMissedOutgoing } from "react-icons/md";
 import Icon from "@ant-design/icons";
+import ScheduleBlockDay from "../schedule-block-day/schedule-block-day.component";
+
 const ShopTargetHrs = 100;
 
 const mapStateToProps = createStructuredSelector({
@@ -23,6 +25,7 @@ const mapDispatchToProps = (dispatch) => ({
 
 export function ScheduleCalendarHeaderComponent({
   label,
+  refetch,
   date,
   load,
   calculating,
@@ -37,7 +40,7 @@ export function ScheduleCalendarHeaderComponent({
         percent={((loadData.expectedLoad || 0) / ShopTargetHrs) * 100}
       />
 
-      <div>
+      <div className="imex-flex-row imex-flex-row__flex-space-around">
         <Icon component={MdCallReceived} />
         {(loadData.hoursIn || 0) && loadData.hoursIn.toFixed(2)}
         <Icon component={MdCallMissedOutgoing} />
@@ -47,14 +50,16 @@ export function ScheduleCalendarHeaderComponent({
   ) : null;
 
   return (
-    <div>
-      {label}
-      {calculating || JSON.stringify(load) === "{}" ? (
-        <LoadingSkeleton />
-      ) : (
-        LoadComponent
-      )}
-    </div>
+    <ScheduleBlockDay date={date} refetch={refetch}>
+      <div>
+        {label}
+        {calculating || JSON.stringify(load) === "{}" ? (
+          <LoadingSkeleton />
+        ) : (
+          LoadComponent
+        )}
+      </div>
+    </ScheduleBlockDay>
   );
 }
 export default connect(