@optifye/dashboard-core 6.12.23 → 6.12.26

package/dist/index.mjs

@@ -14586,6 +14586,32 @@ function getEfficiencyTextColorClasses(efficiency, legend = DEFAULT_EFFICIENCY_L
   }
 }
 
+// src/lib/utils/qaGreenStreakParams.ts
+var QA_GREEN_STREAK_QUERY_PARAM_NAMES = [
+  "qa_green_streak_started_at",
+  "qa_green_streak_elapsed_seconds",
+  "qa_green_streak_status"
+];
+var isTruthyEnv = (value) => ["1", "true", "yes", "on"].includes(String(value || "").trim().toLowerCase());
+var isQaGreenStreakForwardingEnabled = () => isTruthyEnv(process.env.NEXT_PUBLIC_DASHBOARD_QA_GREEN_STREAK_OVERRIDE_ENABLED);
+var appendQaGreenStreakSearchParams = (targetParams) => {
+  if (!isQaGreenStreakForwardingEnabled() || typeof window === "undefined") {
+    return;
+  }
+  const sourceParams = new URLSearchParams(window.location.search);
+  QA_GREEN_STREAK_QUERY_PARAM_NAMES.forEach((paramName) => {
+    const value = sourceParams.get(paramName);
+    if (value !== null) {
+      targetParams.set(paramName, value);
+    }
+  });
+};
+var getQaGreenStreakQueryString = () => {
+  const params = new URLSearchParams();
+  appendQaGreenStreakSearchParams(params);
+  return params.toString();
+};
+
 // src/lib/utils/monitorWorkspaceMetrics.ts
 var sortWorkspaceMetrics = (left, right) => {
   if (left.line_id !== right.line_id) {
@@ -14932,10 +14958,12 @@ var useDashboardMetrics = ({
       let idleTimeVlmByLine = {};
       let efficiencyLegend;
       const forceParam = force ? "&force_refresh=true" : "";
+      const qaGreenStreakParamString = getQaGreenStreakQueryString();
+      const qaGreenStreakParams = qaGreenStreakParamString ? `&${qaGreenStreakParamString}` : "";
       const buildMetricsEndpoint = (params) => {
         const lineIdsParam = isFactory ? `line_ids=${params.groupLineIds.join(",")}` : `line_id=${params.groupLineIds[0]}`;
         const blueComparisonParam = effectiveBlueComparisonLineIds.length ? `&blue_comparison_line_ids=${effectiveBlueComparisonLineIds.join(",")}` : "";
-        return `/api/dashboard/metrics?${lineIdsParam}${blueComparisonParam}&date=${params.date}&shift_id=${params.shiftId}&company_id=${companyId}${forceParam}`;
+        return `/api/dashboard/metrics?${lineIdsParam}${blueComparisonParam}&date=${params.date}&shift_id=${params.shiftId}&company_id=${companyId}${forceParam}${qaGreenStreakParams}`;
       };
       if (usesShiftGroups) {
         logDebug("[useDashboardMetrics] Factory view shift groups fetch:", {
@@ -36089,6 +36117,37 @@ var interpretIdleValue = (value) => {
   if (value === "x" || value === null || value === void 0) return "unknown";
   return "unknown";
 };
+var timeToMinutes = (value) => {
+  const parsed = parseTime(value);
+  if (!parsed) return null;
+  return parsed.hour * 60 + parsed.minute;
+};
+var normalizeBreaksOnShiftTimeline2 = (shiftStart, shiftBreaks) => {
+  const shiftStartMinutes = timeToMinutes(shiftStart);
+  if (shiftStartMinutes === null || !Array.isArray(shiftBreaks)) {
+    return [];
+  }
+  return shiftBreaks.flatMap((entry) => {
+    const startRaw = timeToMinutes(entry?.startTime ?? entry?.start);
+    const endRaw = timeToMinutes(entry?.endTime ?? entry?.end);
+    if (startRaw === null || endRaw === null) return [];
+    let start = startRaw;
+    let end = endRaw;
+    if (end <= start) {
+      end += 24 * 60;
+    }
+    if (start < shiftStartMinutes) {
+      start += 24 * 60;
+      end += 24 * 60;
+    }
+    return [{ start, end }];
+  });
+};
+var isBreakMinute = (minuteIndex, shiftStartMinutes, normalizedBreaks) => {
+  if (!normalizedBreaks.length) return false;
+  const absoluteMinute = shiftStartMinutes + minuteIndex;
+  return normalizedBreaks.some((entry) => entry.start <= absoluteMinute && absoluteMinute < entry.end);
+};
 var getShiftDurationMinutes = (shiftStart, shiftEnd) => {
   const start = parseTime(shiftStart);
   const end = parseTime(shiftEnd);
@@ -36099,6 +36158,29 @@ var getShiftDurationMinutes = (shiftStart, shiftEnd) => {
   }
   return duration > 0 ? duration : null;
 };
+var getBreakExcludedShiftMinutes = ({
+  shiftStart,
+  shiftEnd,
+  elapsedMinutes,
+  shiftBreaks
+}) => {
+  const shiftMinutes = getShiftDurationMinutes(shiftStart, shiftEnd);
+  if (shiftMinutes === null) return null;
+  const elapsedLimit = Number.isFinite(elapsedMinutes) ? Math.min(Math.max(Math.floor(elapsedMinutes ?? 0), 0), shiftMinutes) : shiftMinutes;
+  if (elapsedLimit <= 0) return 0;
+  const startTime = parseTime(shiftStart);
+  if (!startTime) return elapsedLimit;
+  const shiftStartMinutes = startTime.hour * 60 + startTime.minute;
+  const normalizedBreaks = normalizeBreaksOnShiftTimeline2(shiftStart, shiftBreaks);
+  if (!normalizedBreaks.length) return elapsedLimit;
+  let workingMinutes = 0;
+  for (let minuteIndex = 0; minuteIndex < elapsedLimit; minuteIndex += 1) {
+    if (!isBreakMinute(minuteIndex, shiftStartMinutes, normalizedBreaks)) {
+      workingMinutes += 1;
+    }
+  }
+  return workingMinutes;
+};
 var getShiftElapsedMinutes = ({
   shiftStart,
   shiftEnd,
@@ -36163,7 +36245,8 @@ var buildUptimeSeries = ({
   shiftEnd,
   shiftDate,
   timezone,
-  elapsedMinutes
+  elapsedMinutes,
+  shiftBreaks
 }) => {
   const normalizedIdle = normalizeIdleTimeHourly(idleTimeHourly || {});
   const hasIdleData = Object.keys(normalizedIdle).length > 0;
@@ -36218,6 +36301,8 @@ var buildUptimeSeries = ({
   const points = [];
   let activeMinutes = 0;
   let idleMinutes = 0;
+  const shiftStartMinutes = startTime.hour * 60 + startTime.minute;
+  const normalizedBreaks = normalizeBreaksOnShiftTimeline2(shiftStart, shiftBreaks);
   for (let minuteIndex = 0; minuteIndex < shiftMinutes; minuteIndex += 1) {
     const minuteDate = addMinutes(shiftStartDate, minuteIndex);
     const timeLabel = formatInTimeZone(minuteDate, timezone, "h:mm a");
@@ -36230,6 +36315,15 @@ var buildUptimeSeries = ({
       });
       continue;
     }
+    if (isBreakMinute(minuteIndex, shiftStartMinutes, normalizedBreaks)) {
+      points.push({
+        minuteIndex,
+        timeLabel,
+        uptime: null,
+        status: "break"
+      });
+      continue;
+    }
     const hourKey = formatInTimeZone(minuteDate, timezone, "H");
     const minuteKey = Number.parseInt(formatInTimeZone(minuteDate, timezone, "m"), 10);
     const hourBucket = normalizedIdle[hourKey] || [];
@@ -37791,12 +37885,10 @@ var getAllVideoGridGreenStreakDisplay = (workspaces, legend = DEFAULT_EFFICIENCY
     const startedAt = workspace.video_grid_green_streak_started_at;
     const anchorAt = workspace.video_grid_green_streak_anchor_at;
     const streakMinutes = workspace.video_grid_green_streak_minutes;
-    const computedAt = workspace.recent_flow_computed_at;
     const startedAtMs = parseTimestampMs(startedAt);
     const anchorAtMs = parseTimestampMs(anchorAt);
-    const computedAtMs = typeof computedAt === "string" && computedAt.trim() ? parseTimestampMs(computedAt) : Number.NaN;
     const isFresh = isAllGreenStreakFresh(workspace, anchorAtMs, nowMs2);
-    const tickOriginAtMs = Number.isFinite(computedAtMs) ? computedAtMs : anchorAtMs + CONFIRMED_MINUTE_DURATION_MS;
+    const tickOriginAtMs = anchorAtMs + CONFIRMED_MINUTE_DURATION_MS;
     if (workspace.video_grid_green_streak_active === true && isFiniteNumber3(streakMinutes) && streakMinutes > 0 && startedAt && anchorAt && Number.isFinite(startedAtMs) && isFresh) {
       return {
         startedAt,
@@ -39392,6 +39484,7 @@ var HourlyUptimeChartComponent = ({
   shiftDate,
   timezone,
   elapsedMinutes,
+  shiftBreaks,
   className = ""
 }) => {
   const containerRef = React144__default.useRef(null);
@@ -39403,8 +39496,9 @@ var HourlyUptimeChartComponent = ({
     shiftEnd,
     shiftDate,
     timezone,
-    elapsedMinutes
-  }), [idleTimeHourly, shiftStart, shiftEnd, shiftDate, timezone, elapsedMinutes]);
+    elapsedMinutes,
+    shiftBreaks
+  }), [idleTimeHourly, shiftStart, shiftEnd, shiftDate, timezone, elapsedMinutes, shiftBreaks]);
   const hasAggregateData = Boolean(hourlyAggregates && hourlyAggregates.length > 0);
   const shiftStartTime = React144__default.useMemo(
     () => getTimeFromTimeString(shiftStart),
@@ -51596,7 +51690,8 @@ var LineMonthlyPdfGenerator = ({
 };
 var LineWhatsAppShareButton = ({
   lineInfo,
-  className
+  className,
+  shiftBreaks = []
 }) => {
   const handleShare = () => {
     trackCoreEvent("Line WhatsApp Share Clicked", {
@@ -51610,7 +51705,8 @@ var LineWhatsAppShareButton = ({
       shiftStart: lineInfo.metrics.shift_start,
       shiftEnd: lineInfo.metrics.shift_end,
       shiftDate: lineInfo.date,
-      timezone: "Asia/Kolkata"
+      timezone: "Asia/Kolkata",
+      shiftBreaks
     }) : null;
     const efficiencyValue = Number.isFinite(lineInfo.metrics.avg_efficiency) ? Number(lineInfo.metrics.avg_efficiency) : null;
     const utilization = efficiencyValue !== null ? efficiencyValue : uptimeSeries && uptimeSeries.availableMinutes > 0 ? uptimeSeries.activeMinutes / uptimeSeries.availableMinutes * 100 : 0;
@@ -51779,16 +51875,24 @@ var LinePdfGenerator = ({
             shiftStart,
             shiftEnd,
             shiftDate,
-            timezone: effectiveUptimeTimezone
+            timezone: effectiveUptimeTimezone,
+            shiftBreaks
           });
           let activeMinutes = uptimeSeries.activeMinutes;
           let idleMinutes = uptimeSeries.idleMinutes;
           let availableMinutes = uptimeSeries.availableMinutes;
           let hasData = uptimeSeries.hasData;
-          if (!hasData) {
+          const hasIdleHourlyPayload = Boolean(
+            workspace.idle_time_hourly && typeof workspace.idle_time_hourly === "object" && Object.keys(workspace.idle_time_hourly).length > 0
+          );
+          if (!hasData && !hasIdleHourlyPayload) {
             const idleTimeValue = workspace.idle_time;
             const hasIdleTimeValue = Number.isFinite(idleTimeValue);
-            const fallbackDuration = shiftDurationMinutes;
+            const fallbackDuration = getBreakExcludedShiftMinutes({
+              shiftStart,
+              shiftEnd,
+              shiftBreaks
+            }) ?? shiftDurationMinutes;
             if (hasIdleTimeValue && idleTimeValue > 0 && fallbackDuration > 0) {
               const idleFromAggregate = Math.min(Math.max(Number(idleTimeValue) / 60, 0), fallbackDuration);
               idleMinutes = idleFromAggregate;
@@ -51860,7 +51964,8 @@ var LinePdfGenerator = ({
             shiftStart: lineShiftStart,
             shiftEnd: lineShiftEnd,
             shiftDate: lineInfo.date,
-            timezone: effectiveUptimeTimezone
+            timezone: effectiveUptimeTimezone,
+            shiftBreaks
           });
           hourlyData = buildHourlyFromSeries(lineUptimeSeries);
         }
@@ -53799,7 +53904,8 @@ var WorkspaceMonthlyHistory = ({
 };
 var WorkspaceWhatsAppShareButton = ({
   workspace,
-  className
+  className,
+  shiftBreaks = []
 }) => {
   const handleShare = () => {
     trackCoreEvent("Workspace WhatsApp Share Clicked", {
@@ -53815,7 +53921,11 @@ var WorkspaceWhatsAppShareButton = ({
       timeZone: "Asia/Kolkata"
     });
     const isUptimeMode = workspace.monitoring_mode === "uptime";
-    const shiftMinutes = getShiftDurationMinutes(workspace.shift_start, workspace.shift_end);
+    const shiftMinutes = getBreakExcludedShiftMinutes({
+      shiftStart: workspace.shift_start,
+      shiftEnd: workspace.shift_end,
+      shiftBreaks
+    }) ?? getShiftDurationMinutes(workspace.shift_start, workspace.shift_end);
     const shiftSeconds = shiftMinutes ? shiftMinutes * 60 : 0;
     const idleSeconds = Math.max(workspace.idle_time || 0, 0);
     const clampedIdleSeconds = shiftSeconds > 0 ? Math.min(idleSeconds, shiftSeconds) : idleSeconds;
@@ -53905,7 +54015,11 @@ var WorkspacePdfGenerator = ({
     try {
       const isUptimeMode = workspace.monitoring_mode === "uptime";
       const isAssemblyCycleMode = !isUptimeMode && shouldUseAssemblyCycleTimeLayout(workspace);
-      const shiftMinutes = getShiftDurationMinutes(workspace.shift_start, workspace.shift_end);
+      const shiftMinutes = getBreakExcludedShiftMinutes({
+        shiftStart: workspace.shift_start,
+        shiftEnd: workspace.shift_end,
+        shiftBreaks
+      }) ?? getShiftDurationMinutes(workspace.shift_start, workspace.shift_end);
       const shiftSeconds = shiftMinutes ? shiftMinutes * 60 : 0;
       const idleSeconds = Math.max(workspace.idle_time || 0, 0);
       const clampedIdleSeconds = shiftSeconds > 0 ? Math.min(idleSeconds, shiftSeconds) : idleSeconds;
@@ -54075,7 +54189,8 @@ var WorkspacePdfGenerator = ({
         shiftStart: workspace.shift_start,
         shiftEnd: workspace.shift_end,
         shiftDate: workspace.date,
-        timezone: reportTimezone
+        timezone: reportTimezone,
+        shiftBreaks
       }) : null;
       const hourlyUptime = uptimeSeries?.points?.length ? Array.from({ length: Math.ceil(uptimeSeries.shiftMinutes / 60) }, (_, index) => {
         const start = index * 60;
@@ -63935,6 +64050,8 @@ var HelpView = ({
 };
 var AuthenticatedHelpView = withAuth(HelpView);
 var HelpView_default = HelpView;
+var REALTIME_REFRESH_DEBOUNCE_MS2 = 1500;
+var REALTIME_REFRESH_MIN_INTERVAL_MS2 = 5e3;
 var transformActiveBreaks = (activeBreaksByLine) => {
   if (!activeBreaksByLine) return [];
   return Object.values(activeBreaksByLine).flat().map((item) => ({
@@ -63973,6 +64090,17 @@ var normalizeMetadata = (metadata) => ({
   cacheStatus: metadata?.cache_status,
   warnings: metadata?.warnings ?? []
 });
+var createResolvedScopeLookup = (resolvedScope, workspaces, blueComparisonWorkspaces) => {
+  const lookup = /* @__PURE__ */ new Set();
+  const addEntry = (lineId, date, shiftId) => {
+    if (!lineId || !date || shiftId === void 0 || shiftId === null) return;
+    lookup.add(`${lineId}|${date}|${shiftId}`);
+  };
+  resolvedScope.forEach((entry) => addEntry(entry.line_id, entry.date, entry.shift_id));
+  workspaces.forEach((workspace) => addEntry(workspace.line_id, workspace.date, workspace.shift_id));
+  blueComparisonWorkspaces.forEach((workspace) => addEntry(workspace.line_id, workspace.date, workspace.shift_id));
+  return lookup;
+};
 var useLiveMonitorBootstrap = ({
   lineIds,
   blueComparisonLineIds,
@@ -63999,20 +64127,34 @@ var useLiveMonitorBootstrap = ({
     () => Array.from(new Set(rawBlueComparisonLineIdsKey ? rawBlueComparisonLineIdsKey.split(",") : [])),
     [rawBlueComparisonLineIdsKey]
   );
+  const realtimeLineIds = useMemo(
+    () => Array.from(new Set([...normalizedLineIds, ...normalizedBlueComparisonLineIds].filter(Boolean))).sort(),
+    [normalizedLineIds, normalizedBlueComparisonLineIds]
+  );
   const requestKey = useMemo(
     () => `${normalizedLineIds.slice().sort().join(",")}|blue:${normalizedBlueComparisonLineIds.slice().sort().join(",")}`,
     [normalizedLineIds, normalizedBlueComparisonLineIds]
   );
+  const realtimeLineIdsKey = useMemo(() => realtimeLineIds.join(","), [realtimeLineIds]);
+  const companySpecificMetricsTable = useMemo(
+    () => getCompanyMetricsTableName(resolvedCompanyId, "performance_metrics"),
+    [resolvedCompanyId]
+  );
   const [state, setState] = useState(() => createEmptyState());
   const [rawState, setRawState] = useState(null);
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState(null);
   const activeRequestIdRef = useRef(0);
+  const isFetchingRef = useRef(false);
+  const pendingRealtimeRefreshRef = useRef(false);
+  const realtimeRefreshTimerRef = useRef(null);
+  const lastRealtimeRefreshStartedAtRef = useRef(0);
   const fetchBootstrap = useCallback(async (force = false) => {
     if (!enabled || !supabase || !resolvedCompanyId || normalizedLineIds.length === 0) {
       return;
     }
     const requestId = ++activeRequestIdRef.current;
+    isFetchingRef.current = true;
     setIsLoading(true);
     setError(null);
     try {
@@ -64025,6 +64167,7 @@ var useLiveMonitorBootstrap = ({
       if (force) {
         searchParams.set("force_refresh", "true");
       }
+      appendQaGreenStreakSearchParams(searchParams);
       const response = await fetchBackendJson(
         supabase,
         `/api/dashboard/monitor-bootstrap?${searchParams.toString()}`,
@@ -64062,6 +64205,7 @@ var useLiveMonitorBootstrap = ({
     } finally {
       if (requestId === activeRequestIdRef.current) {
         setIsLoading(false);
+        isFetchingRef.current = false;
       }
     }
   }, [
@@ -64072,6 +64216,52 @@ var useLiveMonitorBootstrap = ({
     normalizedBlueComparisonLineIds,
     requestKey
   ]);
+  const fetchBootstrapRef = useRef(fetchBootstrap);
+  useEffect(() => {
+    fetchBootstrapRef.current = fetchBootstrap;
+  }, [fetchBootstrap]);
+  const clearRealtimeRefreshTimer = useCallback(() => {
+    if (realtimeRefreshTimerRef.current !== null) {
+      window.clearTimeout(realtimeRefreshTimerRef.current);
+      realtimeRefreshTimerRef.current = null;
+    }
+  }, []);
+  const scheduleRealtimeRefresh = useCallback(() => {
+    if (!enabled || !supabase || realtimeRefreshTimerRef.current !== null) {
+      return;
+    }
+    const elapsedSinceLastRealtimeRefresh = Date.now() - lastRealtimeRefreshStartedAtRef.current;
+    const minIntervalRemaining = Math.max(0, REALTIME_REFRESH_MIN_INTERVAL_MS2 - elapsedSinceLastRealtimeRefresh);
+    const nextDelay = Math.max(REALTIME_REFRESH_DEBOUNCE_MS2, minIntervalRemaining);
+    realtimeRefreshTimerRef.current = window.setTimeout(() => {
+      realtimeRefreshTimerRef.current = null;
+      if (!pendingRealtimeRefreshRef.current) {
+        return;
+      }
+      if (isFetchingRef.current) {
+        scheduleRealtimeRefresh();
+        return;
+      }
+      pendingRealtimeRefreshRef.current = false;
+      lastRealtimeRefreshStartedAtRef.current = Date.now();
+      void fetchBootstrapRef.current(true);
+    }, nextDelay);
+  }, [enabled, supabase]);
+  const queueRealtimeRefresh = useCallback(() => {
+    if (!enabled || !supabase) {
+      pendingRealtimeRefreshRef.current = false;
+      clearRealtimeRefreshTimer();
+      return;
+    }
+    pendingRealtimeRefreshRef.current = true;
+    scheduleRealtimeRefresh();
+  }, [clearRealtimeRefreshTimer, enabled, scheduleRealtimeRefresh, supabase]);
+  useEffect(() => {
+    return () => {
+      pendingRealtimeRefreshRef.current = false;
+      clearRealtimeRefreshTimer();
+    };
+  }, [clearRealtimeRefreshTimer]);
   useEffect(() => {
     if (!enabled || !rawState || !resolvedCompanyId) {
       return;
@@ -64150,6 +64340,83 @@ var useLiveMonitorBootstrap = ({
     }
     void fetchBootstrap(false);
   }, [enabled, resolvedCompanyId, normalizedLineIds, supabase, fetchBootstrap]);
+  const realtimeScopeKey = useMemo(() => Array.from(createResolvedScopeLookup(
+    state.resolvedScope,
+    state.workspaceMetrics,
+    state.blueComparisonWorkspaceMetrics
+  )).sort().join("||"), [state.resolvedScope, state.workspaceMetrics, state.blueComparisonWorkspaceMetrics]);
+  useEffect(() => {
+    if (!enabled || !resolvedCompanyId || !realtimeLineIdsKey || !supabase) {
+      return void 0;
+    }
+    const scopeLookup = new Set(realtimeScopeKey ? realtimeScopeKey.split("||") : []);
+    if (scopeLookup.size === 0) {
+      return void 0;
+    }
+    const realtimeLineIdsForFilter = realtimeLineIdsKey.split(",").filter(Boolean);
+    if (realtimeLineIdsForFilter.length === 0) {
+      return void 0;
+    }
+    const lineIdFilter = `line_id=in.(${realtimeLineIdsForFilter.join(",")})`;
+    const channels = [];
+    const shouldRefreshForPayload = (payload) => {
+      const payloadData = payload.new || payload.old;
+      return scopeLookup.has(`${payloadData?.line_id}|${payloadData?.date}|${payloadData?.shift_id}`);
+    };
+    const createSubscription = (table, channelNameBase) => {
+      const channelName = `${channelNameBase}-${state.scopeKey || requestKey}`.replace(/[^a-zA-Z0-9_-]/g, "");
+      const channel = supabase.channel(channelName).on(
+        "postgres_changes",
+        { event: "*", schema: "public", table, filter: lineIdFilter },
+        (payload) => {
+          if (shouldRefreshForPayload(payload)) {
+            queueRealtimeRefresh();
+          }
+        }
+      ).subscribe();
+      channels.push(channel);
+    };
+    createSubscription(companySpecificMetricsTable, "monitor-bootstrap-ws");
+    createSubscription("line_metrics", "monitor-bootstrap-lm");
+    createSubscription("wip_buffer_metrics", "monitor-bootstrap-wip-metrics");
+    createSubscription("wip_buffer_alerts", "monitor-bootstrap-wip-alerts");
+    return () => {
+      channels.forEach((channel) => {
+        supabase.removeChannel(channel);
+      });
+    };
+  }, [
+    enabled,
+    resolvedCompanyId,
+    realtimeLineIdsKey,
+    supabase,
+    realtimeScopeKey,
+    state.scopeKey,
+    requestKey,
+    companySpecificMetricsTable,
+    queueRealtimeRefresh
+  ]);
+  useEffect(() => {
+    if (!enabled || !resolvedCompanyId || normalizedLineIds.length === 0 || !supabase) {
+      return void 0;
+    }
+    const forceRefreshOnResume = () => {
+      void fetchBootstrapRef.current(true);
+    };
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === "visible") {
+        forceRefreshOnResume();
+      }
+    };
+    document.addEventListener("visibilitychange", handleVisibilityChange);
+    window.addEventListener("focus", forceRefreshOnResume);
+    window.addEventListener("online", forceRefreshOnResume);
+    return () => {
+      document.removeEventListener("visibilitychange", handleVisibilityChange);
+      window.removeEventListener("focus", forceRefreshOnResume);
+      window.removeEventListener("online", forceRefreshOnResume);
+    };
+  }, [enabled, normalizedLineIds.length, resolvedCompanyId, supabase]);
   useEffect(() => {
     if (!enabled || !resolvedCompanyId || normalizedLineIds.length === 0 || !supabase) {
       return void 0;
@@ -64904,7 +65171,6 @@ function HomeView({
   const allGreenMilestoneTrackingRef = useRef({ identity: null, lastMilestoneSeconds: null });
   const allGreenStreakTimerBaselineRef = useRef(null);
   const [showAllGreenCelebration, setShowAllGreenCelebration] = useState(false);
-  const [allGreenCelebrationStartedAtMs, setAllGreenCelebrationStartedAtMs] = useState(null);
   const [greenStreakMilestoneBanner, setGreenStreakMilestoneBanner] = useState(null);
   const [allGreenStreakNowMs, setAllGreenStreakNowMs] = useState(() => Date.now());
   const currentAllGreenStreakNowMs = Math.max(allGreenStreakNowMs, Date.now());
@@ -64967,13 +65233,11 @@ function HomeView({
     };
   }, [allGreenMilestoneIdentity, allGreenStreakDisplay, currentAllGreenStreakNowMs]);
   const allGreenCelebrationTimerText = useMemo(() => {
-    if (!showAllGreenCelebration || allGreenCelebrationStartedAtMs === null) {
+    if (!showAllGreenCelebration || !visibleAllGreenStreakDisplay) {
       return null;
     }
-    return formatAllGreenCelebrationTimer(
-      Math.max(0, Math.floor((currentAllGreenStreakNowMs - allGreenCelebrationStartedAtMs) / 1e3))
-    );
-  }, [allGreenCelebrationStartedAtMs, currentAllGreenStreakNowMs, showAllGreenCelebration]);
+    return formatAllGreenCelebrationTimer(visibleAllGreenStreakDisplay.elapsedSeconds);
+  }, [showAllGreenCelebration, visibleAllGreenStreakDisplay]);
   useEffect(() => {
     const hasPossibleStreakTimer = showAllGreenCelebration || Boolean(allGreenStreakDisplay) || workspaceMetricsWithBreakState.some((workspace) => workspace.video_grid_green_streak_active === true);
     if (!hasPossibleStreakTimer) {
@@ -64992,17 +65256,14 @@ function HomeView({
       allGreenCelebrationTimerRef.current = null;
     }
     setShowAllGreenCelebration(false);
-    setAllGreenCelebrationStartedAtMs(null);
   }, []);
   const triggerAllGreenCelebration = useCallback(() => {
-    setAllGreenCelebrationStartedAtMs(Date.now());
     setShowAllGreenCelebration(true);
     if (allGreenCelebrationTimerRef.current) {
       clearTimeout(allGreenCelebrationTimerRef.current);
     }
     allGreenCelebrationTimerRef.current = setTimeout(() => {
       setShowAllGreenCelebration(false);
-      setAllGreenCelebrationStartedAtMs(null);
       allGreenCelebrationTimerRef.current = null;
     }, ALL_GREEN_CELEBRATION_DURATION_MS);
   }, []);
@@ -67724,6 +67985,7 @@ var UptimeBottomSection = memo$1(({
   shiftDate,
   timezone,
   elapsedMinutes,
+  shiftBreaks,
   urlDate,
   urlShift,
   navigate
@@ -67811,7 +68073,8 @@ var UptimeBottomSection = memo$1(({
               shiftEnd,
               shiftDate,
               timezone,
-              elapsedMinutes
+              elapsedMinutes,
+              shiftBreaks
             }
           ) })
         ] })
@@ -68129,7 +68392,8 @@ var KPIDetailView = ({
             shiftStart: resolvedShiftStart || void 0,
             shiftEnd: resolvedShiftEnd || void 0,
             shiftDate: metric.date,
-            timezone: configuredTimezone
+            timezone: configuredTimezone,
+            shiftBreaks: shiftConfig?.shifts?.find((shift) => shift.shiftId === metric.shift_id)?.breaks || []
           }) : null;
           const idleTimeSeconds = isUptimeMode ? hasBackendUptimeSeconds ? metricIdleTimeSeconds ?? 0 : (uptimeSeries2?.idleMinutes || 0) * 60 : 0;
           const activeTimeSeconds = isUptimeMode ? hasBackendUptimeSeconds ? metricActiveTimeSeconds ?? 0 : (uptimeSeries2?.activeMinutes || 0) * 60 : 0;
@@ -68309,6 +68573,10 @@ var KPIDetailView = ({
       end: chartMetrics.shift_end || fallback.end
     };
   }, [chartMetrics?.shift_start, chartMetrics?.shift_end, chartMetrics?.shift_id, resolveShiftTimes]);
+  const resolvedShiftBreaks = useMemo(
+    () => shiftConfig?.shifts?.find((shift) => shift.shiftId === chartMetrics?.shift_id)?.breaks || [],
+    [shiftConfig?.shifts, chartMetrics?.shift_id]
+  );
   const lineSkuBreakdown = useMemo(
     () => resolvedLineInfo?.metrics.sku_breakdown ?? [],
     [resolvedLineInfo]
@@ -68442,7 +68710,8 @@ var KPIDetailView = ({
         shiftEnd: null,
         shiftDate: null,
         timezone: configuredTimezone,
-        elapsedMinutes: null
+        elapsedMinutes: null,
+        shiftBreaks: resolvedShiftBreaks
       });
     }
     return buildUptimeSeries({
@@ -68451,9 +68720,10 @@ var KPIDetailView = ({
       shiftEnd: resolvedShiftTimes.end,
       shiftDate: chartMetrics.date,
       timezone: configuredTimezone,
-      elapsedMinutes: elapsedShiftMinutes
+      elapsedMinutes: elapsedShiftMinutes,
+      shiftBreaks: resolvedShiftBreaks
     });
-  }, [chartMetrics, resolvedShiftTimes.start, resolvedShiftTimes.end, configuredTimezone, elapsedShiftMinutes]);
+  }, [chartMetrics, resolvedShiftTimes.start, resolvedShiftTimes.end, configuredTimezone, elapsedShiftMinutes, resolvedShiftBreaks]);
   const lineUtilizationFromLine = useMemo(() => {
     const efficiencyValue = Number.isFinite(chartMetrics?.avg_efficiency) ? Number(chartMetrics?.avg_efficiency) : null;
     if (efficiencyValue !== null) return efficiencyValue;
@@ -68480,7 +68750,8 @@ var KPIDetailView = ({
         shiftEnd,
         shiftDate,
         timezone: configuredTimezone,
-        elapsedMinutes: workspaceElapsedMinutes
+        elapsedMinutes: workspaceElapsedMinutes,
+        shiftBreaks: resolvedShiftBreaks
       });
       let activeMinutes = uptimeSeries2.activeMinutes;
       let idleMinutes = uptimeSeries2.idleMinutes;
@@ -68492,7 +68763,12 @@ var KPIDetailView = ({
         );
         const idleTimeValue = workspace.idle_time;
         const hasIdleTimeValue = Number.isFinite(idleTimeValue);
-        const fallbackDuration = workspaceElapsedMinutes ?? shiftMinutes;
+        const fallbackDuration = getBreakExcludedShiftMinutes({
+          shiftStart,
+          shiftEnd,
+          elapsedMinutes: workspaceElapsedMinutes,
+          shiftBreaks: resolvedShiftBreaks
+        }) ?? workspaceElapsedMinutes ?? shiftMinutes;
         if (!hasIdleHourlyPayload && hasIdleTimeValue && idleTimeValue > 0 && fallbackDuration > 0) {
           const idleSeconds = Number(idleTimeValue);
           const idleFromAggregate = Math.min(Math.max(idleSeconds / 60, 0), fallbackDuration);
@@ -68522,7 +68798,8 @@ var KPIDetailView = ({
     resolvedShiftTimes.end,
     chartMetrics?.date,
     configuredTimezone,
-    isCurrentShiftView
+    isCurrentShiftView,
+    resolvedShiftBreaks
   ]);
   const lineUptimeStats = useMemo(() => {
     if (!isUptimeMode) {
@@ -69209,6 +69486,7 @@ var KPIDetailView = ({
               shiftDate: chartMetrics?.date,
               timezone: configuredTimezone,
               elapsedMinutes: elapsedShiftMinutes,
+              shiftBreaks: resolvedShiftBreaks,
               urlDate,
               urlShift,
               navigate
@@ -69323,6 +69601,7 @@ var KPIDetailView = ({
               shiftDate: chartMetrics?.date,
               timezone: configuredTimezone,
               elapsedMinutes: elapsedShiftMinutes,
+              shiftBreaks: resolvedShiftBreaks,
               urlDate,
               urlShift,
               navigate
@@ -76808,6 +77087,10 @@ var WorkspaceDetailView = ({
       timezone
     });
   }, [isCurrentShiftView, workspace?.shift_start, workspace?.shift_end, idleClipDate, timezone]);
+  const workspaceShiftBreaks = useMemo(
+    () => shiftConfig?.shifts?.find((shift2) => shift2.shiftId === workspace?.shift_id)?.breaks || [],
+    [shiftConfig?.shifts, workspace?.shift_id]
+  );
   const uptimeSeries = useMemo(
     () => buildUptimeSeries({
       idleTimeHourly: workspace?.idle_time_hourly,
@@ -76815,17 +77098,26 @@ var WorkspaceDetailView = ({
       shiftEnd: workspace?.shift_end,
       shiftDate: idleClipDate,
       timezone,
-      elapsedMinutes: elapsedShiftMinutes
+      elapsedMinutes: elapsedShiftMinutes,
+      shiftBreaks: workspaceShiftBreaks
     }),
-    [workspace?.idle_time_hourly, workspace?.shift_start, workspace?.shift_end, idleClipDate, timezone, elapsedShiftMinutes]
+    [workspace?.idle_time_hourly, workspace?.shift_start, workspace?.shift_end, idleClipDate, timezone, elapsedShiftMinutes, workspaceShiftBreaks]
   );
   const uptimePieData = useMemo(() => {
     if (!isUptimeMode) return [];
     let activeMinutes = uptimeSeries.activeMinutes;
     let idleMinutes = uptimeSeries.idleMinutes;
     let totalMinutes = uptimeSeries.availableMinutes;
-    const fallbackDuration = elapsedShiftMinutes ?? shiftDurationMinutes;
-    if (!uptimeSeries.hasData && fallbackDuration !== null && fallbackDuration !== void 0) {
+    const fallbackDuration = getBreakExcludedShiftMinutes({
+      shiftStart: workspace?.shift_start,
+      shiftEnd: workspace?.shift_end,
+      elapsedMinutes: elapsedShiftMinutes,
+      shiftBreaks: workspaceShiftBreaks
+    }) ?? elapsedShiftMinutes ?? shiftDurationMinutes;
+    const hasIdleHourlyPayload = Boolean(
+      workspace?.idle_time_hourly && typeof workspace.idle_time_hourly === "object" && Object.keys(workspace.idle_time_hourly).length > 0
+    );
+    if (!uptimeSeries.hasData && !hasIdleHourlyPayload && fallbackDuration !== null && fallbackDuration !== void 0) {
       const idleSeconds = Number(workspace?.idle_time || 0);
       const idleFromAggregate = Math.min(Math.max(Math.round(idleSeconds / 60), 0), fallbackDuration);
       const activeFromAggregate = Math.max(fallbackDuration - idleFromAggregate, 0);
@@ -76838,7 +77130,7 @@ var WorkspaceDetailView = ({
       { name: "Productive", value: activeMinutes },
       { name: "Idle", value: idleMinutes }
     ];
-  }, [isUptimeMode, uptimeSeries, shiftDurationMinutes, elapsedShiftMinutes, workspace?.idle_time]);
+  }, [isUptimeMode, uptimeSeries, shiftDurationMinutes, elapsedShiftMinutes, workspace?.idle_time, workspace?.shift_start, workspace?.shift_end, workspaceShiftBreaks]);
   const overviewTabLabel = isUptimeMode ? "Utilization" : "Efficiency";
   const idleClipFetchEnabled = Boolean(
     workspaceId && idleClipDate && idleClipShiftId !== void 0 && activeTab === "overview" && idleTimeVlmEnabled && isOutputLayout
@@ -77317,7 +77609,8 @@ var WorkspaceDetailView = ({
                             shiftEnd: workspace.shift_end,
                             shiftDate: idleClipDate,
                             timezone,
-                            elapsedMinutes: elapsedShiftMinutes
+                            elapsedMinutes: elapsedShiftMinutes,
+                            shiftBreaks: workspaceShiftBreaks
                           }
                         ) : isAssemblyCycleLayout ? shouldShowCycleTimeUnavailableState ? cycleTimeUnavailableView : shouldShowCycleTimeChart ? /* @__PURE__ */ jsx(
                           CycleTimeOverTimeChart,
@@ -77470,7 +77763,8 @@ var WorkspaceDetailView = ({
                               shiftEnd: workspace.shift_end,
                               shiftDate: idleClipDate,
                               timezone,
-                              elapsedMinutes: elapsedShiftMinutes
+                              elapsedMinutes: elapsedShiftMinutes,
+                              shiftBreaks: workspaceShiftBreaks
                             }
                           ) : isAssemblyCycleLayout ? shouldShowCycleTimeUnavailableState ? cycleTimeUnavailableView : shouldShowCycleTimeChart ? /* @__PURE__ */ jsx(
                             CycleTimeOverTimeChart,