@optifye/dashboard-core 6.5.6 → 6.5.7

package/dist/index.d.mts

@@ -2281,6 +2281,7 @@ interface LineMetrics {
     underperforming_workspace_names: string[];
     underperforming_workspace_uuids: string[];
     output_array: number[];
+    output_hourly?: Record<string, number[]>;
     line_threshold: number;
     threshold_pph: number;
     shift_start: string;
@@ -4325,6 +4326,7 @@ interface HourlyOutputChartProps {
     data: number[];
     pphThreshold: number;
     shiftStart: string;
+    shiftEnd?: string;
     showIdleTime?: boolean;
     idleTimeHourly?: Record<string, string[]>;
     className?: string;

package/dist/index.d.ts

@@ -2281,6 +2281,7 @@ interface LineMetrics {
     underperforming_workspace_names: string[];
     underperforming_workspace_uuids: string[];
     output_array: number[];
+    output_hourly?: Record<string, number[]>;
     line_threshold: number;
     threshold_pph: number;
     shift_start: string;
@@ -4325,6 +4326,7 @@ interface HourlyOutputChartProps {
     data: number[];
     pphThreshold: number;
     shiftStart: string;
+    shiftEnd?: string;
     showIdleTime?: boolean;
     idleTimeHourly?: Record<string, string[]>;
     className?: string;

package/dist/index.js

@@ -893,15 +893,19 @@ var dashboardService = {
         const shiftStart = data.shift_start || (isNightShift ? "22:00" : "06:00");
         const shiftEnd = data.shift_end || (isNightShift ? "06:00" : "14:00");
         const startHour = parseInt(shiftStart.split(":")[0]);
+        const startMinute = parseInt(shiftStart.split(":")[1] || "0");
+        const endHour = parseInt(shiftEnd.split(":")[0]);
+        const endMinute = parseInt(shiftEnd.split(":")[1] || "0");
+        let shiftDuration = endHour - startHour;
+        if (endMinute > startMinute) {
+          shiftDuration += 1;
+        }
+        if (shiftDuration <= 0) {
+          shiftDuration += 24;
+        }
         let expectedHours = [];
-        if (isNightShift) {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
-        } else {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
+        for (let i = 0; i < shiftDuration; i++) {
+          expectedHours.push((startHour + i) % 24);
         }
         console.log("Expected shift hours:", expectedHours);
         console.log("Available data hours:", Object.keys(outputHourly));
@@ -5702,15 +5706,19 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
             const shiftStart = recentData.shift_start || (isNightShift ? "22:00" : "06:00");
             const shiftEnd = recentData.shift_end || (isNightShift ? "06:00" : "14:00");
             const startHour = parseInt(shiftStart.split(":")[0]);
+            const startMinute = parseInt(shiftStart.split(":")[1] || "0");
+            const endHour = parseInt(shiftEnd.split(":")[0]);
+            const endMinute = parseInt(shiftEnd.split(":")[1] || "0");
+            let shiftDuration = endHour - startHour;
+            if (endMinute > startMinute) {
+              shiftDuration += 1;
+            }
+            if (shiftDuration <= 0) {
+              shiftDuration += 24;
+            }
             let expectedHours = [];
-            if (isNightShift) {
-              for (let i = 0; i < 9; i++) {
-                expectedHours.push((startHour + i) % 24);
-              }
-            } else {
-              for (let i = 0; i < 9; i++) {
-                expectedHours.push((startHour + i) % 24);
-              }
+            for (let i = 0; i < shiftDuration; i++) {
+              expectedHours.push((startHour + i) % 24);
             }
             console.log("Expected shift hours (fallback):", expectedHours);
             console.log("Available data hours (fallback):", Object.keys(outputHourly2));
@@ -5814,15 +5822,19 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
         const shiftStart = data.shift_start || (isNightShift ? "22:00" : "06:00");
         const shiftEnd = data.shift_end || (isNightShift ? "06:00" : "14:00");
         const startHour = parseInt(shiftStart.split(":")[0]);
+        const startMinute = parseInt(shiftStart.split(":")[1] || "0");
+        const endHour = parseInt(shiftEnd.split(":")[0]);
+        const endMinute = parseInt(shiftEnd.split(":")[1] || "0");
+        let shiftDuration = endHour - startHour;
+        if (endMinute > startMinute) {
+          shiftDuration += 1;
+        }
+        if (shiftDuration <= 0) {
+          shiftDuration += 24;
+        }
         let expectedHours = [];
-        if (isNightShift) {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
-        } else {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
+        for (let i = 0; i < shiftDuration; i++) {
+          expectedHours.push((startHour + i) % 24);
         }
         console.log("Expected shift hours:", expectedHours);
         console.log("Available data hours:", Object.keys(outputHourly));
@@ -21246,6 +21258,7 @@ var HourlyOutputChartComponent = ({
   data,
   pphThreshold,
   shiftStart,
+  shiftEnd,
   showIdleTime = false,
   idleTimeHourly,
   className = ""
@@ -21260,10 +21273,32 @@ var HourlyOutputChartComponent = ({
     return { hour, minute, decimalHour };
   };
   const shiftStartTime = getTimeFromTimeString(shiftStart);
-  const SHIFT_DURATION = 11;
-  const [animatedData, setAnimatedData] = React19__namespace.default.useState(Array(SHIFT_DURATION).fill(0));
+  const calculateShiftDuration = React19__namespace.default.useMemo(() => {
+    if (!shiftEnd) {
+      return 11;
+    }
+    const endTime = getTimeFromTimeString(shiftEnd);
+    let duration = endTime.decimalHour - shiftStartTime.decimalHour;
+    if (duration <= 0) {
+      duration += 24;
+    }
+    return Math.round(duration);
+  }, [shiftEnd, shiftStartTime.decimalHour]);
+  const SHIFT_DURATION = calculateShiftDuration;
+  const [animatedData, setAnimatedData] = React19__namespace.default.useState(
+    () => Array(SHIFT_DURATION).fill(0)
+  );
   const prevDataRef = React19__namespace.default.useRef(Array(SHIFT_DURATION).fill(0));
   const animationFrameRef = React19__namespace.default.useRef(null);
+  React19__namespace.default.useEffect(() => {
+    setAnimatedData((prev) => {
+      if (prev.length !== SHIFT_DURATION) {
+        return Array(SHIFT_DURATION).fill(0);
+      }
+      return prev;
+    });
+    prevDataRef.current = Array(SHIFT_DURATION).fill(0);
+  }, [SHIFT_DURATION]);
   const [idleBarState, setIdleBarState] = React19__namespace.default.useState({
     visible: showIdleTime,
     key: 0,
@@ -33817,7 +33852,8 @@ var BottomSection = React19.memo(({
             {
               data: hourlyOutputData,
               pphThreshold: hourlyThreshold,
-              shiftStart: lineInfo.metrics.shift_start || "06:00"
+              shiftStart: lineInfo.metrics.shift_start || "06:00",
+              shiftEnd: lineInfo.metrics.shift_end
             }
           ) })
         ] })
@@ -34067,14 +34103,40 @@ var KPIDetailView = ({
     };
   }, [metrics2, lineDetails, companyId]);
   const hourlyOutputData = React19.useMemo(() => {
-    if (!metrics2 || !metrics2.output_array) return [];
-    return metrics2.output_array.reduce((acc, val, i) => {
-      const hourIndex = Math.floor(i / 60);
-      if (!acc[hourIndex]) acc[hourIndex] = 0;
-      acc[hourIndex] += val;
-      return acc;
-    }, []);
-  }, [metrics2?.output_array]);
+    if (!metrics2) return [];
+    if (metrics2.output_hourly && Object.keys(metrics2.output_hourly).length > 0) {
+      console.log("Using new output_hourly format in KPIDetailView");
+      const isNightShift = metrics2.shift_id === 1;
+      const shiftStart = metrics2.shift_start || (isNightShift ? "22:00" : "06:00");
+      const shiftEnd = metrics2.shift_end || (isNightShift ? "06:00" : "14:00");
+      const startHour = parseInt(shiftStart.split(":")[0]);
+      const endHour = parseInt(shiftEnd.split(":")[0]);
+      let shiftDuration = endHour - startHour;
+      if (shiftDuration <= 0) {
+        shiftDuration += 24;
+      }
+      let expectedHours = [];
+      for (let i = 0; i < shiftDuration; i++) {
+        expectedHours.push((startHour + i) % 24);
+      }
+      return expectedHours.map((hour) => {
+        const hourData = metrics2.output_hourly[hour.toString()];
+        if (hourData && Array.isArray(hourData)) {
+          return hourData.reduce((sum, val) => sum + (val || 0), 0);
+        }
+        return 0;
+      });
+    }
+    if (metrics2.output_array) {
+      return metrics2.output_array.reduce((acc, val, i) => {
+        const hourIndex = Math.floor(i / 60);
+        if (!acc[hourIndex]) acc[hourIndex] = 0;
+        acc[hourIndex] += val;
+        return acc;
+      }, []);
+    }
+    return [];
+  }, [metrics2]);
   const hourlyThreshold = React19.useMemo(() => metrics2 ? metrics2.threshold_pph || 0 : 0, [metrics2]);
   const sortedByEfficiency = React19.useMemo(() => {
     if (!workspaces) return [];
@@ -38728,6 +38790,7 @@ var WorkspaceDetailView = ({
                           data: workspace.hourly_action_counts || [],
                           pphThreshold: workspace.pph_threshold || 0,
                           shiftStart: workspace.shift_start || "",
+                          shiftEnd: workspace.shift_end,
                           showIdleTime,
                           idleTimeHourly: workspace.idle_time_hourly
                         }
@@ -38846,6 +38909,7 @@ var WorkspaceDetailView = ({
                             data: workspace.hourly_action_counts || [],
                             pphThreshold: workspace.pph_threshold || 0,
                             shiftStart: workspace.shift_start || "",
+                            shiftEnd: workspace.shift_end,
                             showIdleTime,
                             idleTimeHourly: workspace.idle_time_hourly
                           }

package/dist/index.mjs

@@ -863,15 +863,19 @@ var dashboardService = {
         const shiftStart = data.shift_start || (isNightShift ? "22:00" : "06:00");
         const shiftEnd = data.shift_end || (isNightShift ? "06:00" : "14:00");
         const startHour = parseInt(shiftStart.split(":")[0]);
+        const startMinute = parseInt(shiftStart.split(":")[1] || "0");
+        const endHour = parseInt(shiftEnd.split(":")[0]);
+        const endMinute = parseInt(shiftEnd.split(":")[1] || "0");
+        let shiftDuration = endHour - startHour;
+        if (endMinute > startMinute) {
+          shiftDuration += 1;
+        }
+        if (shiftDuration <= 0) {
+          shiftDuration += 24;
+        }
         let expectedHours = [];
-        if (isNightShift) {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
-        } else {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
+        for (let i = 0; i < shiftDuration; i++) {
+          expectedHours.push((startHour + i) % 24);
         }
         console.log("Expected shift hours:", expectedHours);
         console.log("Available data hours:", Object.keys(outputHourly));
@@ -5672,15 +5676,19 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
             const shiftStart = recentData.shift_start || (isNightShift ? "22:00" : "06:00");
             const shiftEnd = recentData.shift_end || (isNightShift ? "06:00" : "14:00");
             const startHour = parseInt(shiftStart.split(":")[0]);
+            const startMinute = parseInt(shiftStart.split(":")[1] || "0");
+            const endHour = parseInt(shiftEnd.split(":")[0]);
+            const endMinute = parseInt(shiftEnd.split(":")[1] || "0");
+            let shiftDuration = endHour - startHour;
+            if (endMinute > startMinute) {
+              shiftDuration += 1;
+            }
+            if (shiftDuration <= 0) {
+              shiftDuration += 24;
+            }
             let expectedHours = [];
-            if (isNightShift) {
-              for (let i = 0; i < 9; i++) {
-                expectedHours.push((startHour + i) % 24);
-              }
-            } else {
-              for (let i = 0; i < 9; i++) {
-                expectedHours.push((startHour + i) % 24);
-              }
+            for (let i = 0; i < shiftDuration; i++) {
+              expectedHours.push((startHour + i) % 24);
             }
             console.log("Expected shift hours (fallback):", expectedHours);
             console.log("Available data hours (fallback):", Object.keys(outputHourly2));
@@ -5784,15 +5792,19 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
         const shiftStart = data.shift_start || (isNightShift ? "22:00" : "06:00");
         const shiftEnd = data.shift_end || (isNightShift ? "06:00" : "14:00");
         const startHour = parseInt(shiftStart.split(":")[0]);
+        const startMinute = parseInt(shiftStart.split(":")[1] || "0");
+        const endHour = parseInt(shiftEnd.split(":")[0]);
+        const endMinute = parseInt(shiftEnd.split(":")[1] || "0");
+        let shiftDuration = endHour - startHour;
+        if (endMinute > startMinute) {
+          shiftDuration += 1;
+        }
+        if (shiftDuration <= 0) {
+          shiftDuration += 24;
+        }
         let expectedHours = [];
-        if (isNightShift) {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
-        } else {
-          for (let i = 0; i < 9; i++) {
-            expectedHours.push((startHour + i) % 24);
-          }
+        for (let i = 0; i < shiftDuration; i++) {
+          expectedHours.push((startHour + i) % 24);
         }
         console.log("Expected shift hours:", expectedHours);
         console.log("Available data hours:", Object.keys(outputHourly));
@@ -21216,6 +21228,7 @@ var HourlyOutputChartComponent = ({
   data,
   pphThreshold,
   shiftStart,
+  shiftEnd,
   showIdleTime = false,
   idleTimeHourly,
   className = ""
@@ -21230,10 +21243,32 @@ var HourlyOutputChartComponent = ({
     return { hour, minute, decimalHour };
   };
   const shiftStartTime = getTimeFromTimeString(shiftStart);
-  const SHIFT_DURATION = 11;
-  const [animatedData, setAnimatedData] = React19__default.useState(Array(SHIFT_DURATION).fill(0));
+  const calculateShiftDuration = React19__default.useMemo(() => {
+    if (!shiftEnd) {
+      return 11;
+    }
+    const endTime = getTimeFromTimeString(shiftEnd);
+    let duration = endTime.decimalHour - shiftStartTime.decimalHour;
+    if (duration <= 0) {
+      duration += 24;
+    }
+    return Math.round(duration);
+  }, [shiftEnd, shiftStartTime.decimalHour]);
+  const SHIFT_DURATION = calculateShiftDuration;
+  const [animatedData, setAnimatedData] = React19__default.useState(
+    () => Array(SHIFT_DURATION).fill(0)
+  );
   const prevDataRef = React19__default.useRef(Array(SHIFT_DURATION).fill(0));
   const animationFrameRef = React19__default.useRef(null);
+  React19__default.useEffect(() => {
+    setAnimatedData((prev) => {
+      if (prev.length !== SHIFT_DURATION) {
+        return Array(SHIFT_DURATION).fill(0);
+      }
+      return prev;
+    });
+    prevDataRef.current = Array(SHIFT_DURATION).fill(0);
+  }, [SHIFT_DURATION]);
   const [idleBarState, setIdleBarState] = React19__default.useState({
     visible: showIdleTime,
     key: 0,
@@ -33787,7 +33822,8 @@ var BottomSection = memo(({
             {
               data: hourlyOutputData,
               pphThreshold: hourlyThreshold,
-              shiftStart: lineInfo.metrics.shift_start || "06:00"
+              shiftStart: lineInfo.metrics.shift_start || "06:00",
+              shiftEnd: lineInfo.metrics.shift_end
             }
           ) })
         ] })
@@ -34037,14 +34073,40 @@ var KPIDetailView = ({
     };
   }, [metrics2, lineDetails, companyId]);
   const hourlyOutputData = useMemo(() => {
-    if (!metrics2 || !metrics2.output_array) return [];
-    return metrics2.output_array.reduce((acc, val, i) => {
-      const hourIndex = Math.floor(i / 60);
-      if (!acc[hourIndex]) acc[hourIndex] = 0;
-      acc[hourIndex] += val;
-      return acc;
-    }, []);
-  }, [metrics2?.output_array]);
+    if (!metrics2) return [];
+    if (metrics2.output_hourly && Object.keys(metrics2.output_hourly).length > 0) {
+      console.log("Using new output_hourly format in KPIDetailView");
+      const isNightShift = metrics2.shift_id === 1;
+      const shiftStart = metrics2.shift_start || (isNightShift ? "22:00" : "06:00");
+      const shiftEnd = metrics2.shift_end || (isNightShift ? "06:00" : "14:00");
+      const startHour = parseInt(shiftStart.split(":")[0]);
+      const endHour = parseInt(shiftEnd.split(":")[0]);
+      let shiftDuration = endHour - startHour;
+      if (shiftDuration <= 0) {
+        shiftDuration += 24;
+      }
+      let expectedHours = [];
+      for (let i = 0; i < shiftDuration; i++) {
+        expectedHours.push((startHour + i) % 24);
+      }
+      return expectedHours.map((hour) => {
+        const hourData = metrics2.output_hourly[hour.toString()];
+        if (hourData && Array.isArray(hourData)) {
+          return hourData.reduce((sum, val) => sum + (val || 0), 0);
+        }
+        return 0;
+      });
+    }
+    if (metrics2.output_array) {
+      return metrics2.output_array.reduce((acc, val, i) => {
+        const hourIndex = Math.floor(i / 60);
+        if (!acc[hourIndex]) acc[hourIndex] = 0;
+        acc[hourIndex] += val;
+        return acc;
+      }, []);
+    }
+    return [];
+  }, [metrics2]);
   const hourlyThreshold = useMemo(() => metrics2 ? metrics2.threshold_pph || 0 : 0, [metrics2]);
   const sortedByEfficiency = useMemo(() => {
     if (!workspaces) return [];
@@ -38698,6 +38760,7 @@ var WorkspaceDetailView = ({
                           data: workspace.hourly_action_counts || [],
                           pphThreshold: workspace.pph_threshold || 0,
                           shiftStart: workspace.shift_start || "",
+                          shiftEnd: workspace.shift_end,
                           showIdleTime,
                           idleTimeHourly: workspace.idle_time_hourly
                         }
@@ -38816,6 +38879,7 @@ var WorkspaceDetailView = ({
                             data: workspace.hourly_action_counts || [],
                             pphThreshold: workspace.pph_threshold || 0,
                             shiftStart: workspace.shift_start || "",
+                            shiftEnd: workspace.shift_end,
                             showIdleTime,
                             idleTimeHourly: workspace.idle_time_hourly
                           }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@optifye/dashboard-core",
-  "version": "6.5.6",
+  "version": "6.5.7",
   "description": "Reusable UI & logic for Optifye dashboard",
   "main": "dist/index.js",
   "module": "dist/index.mjs",