@optifye/dashboard-core 6.12.23 → 6.12.25

package/dist/index.js

@@ -14615,6 +14615,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) {
@@ -14961,10 +14987,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:", {
@@ -37820,12 +37848,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,
@@ -63964,6 +63990,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) => ({
@@ -64002,6 +64030,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,
@@ -64028,20 +64067,34 @@ var useLiveMonitorBootstrap = ({
     () => Array.from(new Set(rawBlueComparisonLineIdsKey ? rawBlueComparisonLineIdsKey.split(",") : [])),
     [rawBlueComparisonLineIdsKey]
   );
+  const realtimeLineIds = React144.useMemo(
+    () => Array.from(new Set([...normalizedLineIds, ...normalizedBlueComparisonLineIds].filter(Boolean))).sort(),
+    [normalizedLineIds, normalizedBlueComparisonLineIds]
+  );
   const requestKey = React144.useMemo(
     () => `${normalizedLineIds.slice().sort().join(",")}|blue:${normalizedBlueComparisonLineIds.slice().sort().join(",")}`,
     [normalizedLineIds, normalizedBlueComparisonLineIds]
   );
+  const realtimeLineIdsKey = React144.useMemo(() => realtimeLineIds.join(","), [realtimeLineIds]);
+  const companySpecificMetricsTable = React144.useMemo(
+    () => getCompanyMetricsTableName(resolvedCompanyId, "performance_metrics"),
+    [resolvedCompanyId]
+  );
   const [state, setState] = React144.useState(() => createEmptyState());
   const [rawState, setRawState] = React144.useState(null);
   const [isLoading, setIsLoading] = React144.useState(false);
   const [error, setError] = React144.useState(null);
   const activeRequestIdRef = React144.useRef(0);
+  const isFetchingRef = React144.useRef(false);
+  const pendingRealtimeRefreshRef = React144.useRef(false);
+  const realtimeRefreshTimerRef = React144.useRef(null);
+  const lastRealtimeRefreshStartedAtRef = React144.useRef(0);
   const fetchBootstrap = React144.useCallback(async (force = false) => {
     if (!enabled || !supabase || !resolvedCompanyId || normalizedLineIds.length === 0) {
       return;
     }
     const requestId = ++activeRequestIdRef.current;
+    isFetchingRef.current = true;
     setIsLoading(true);
     setError(null);
     try {
@@ -64054,6 +64107,7 @@ var useLiveMonitorBootstrap = ({
       if (force) {
         searchParams.set("force_refresh", "true");
       }
+      appendQaGreenStreakSearchParams(searchParams);
       const response = await fetchBackendJson(
         supabase,
         `/api/dashboard/monitor-bootstrap?${searchParams.toString()}`,
@@ -64091,6 +64145,7 @@ var useLiveMonitorBootstrap = ({
     } finally {
       if (requestId === activeRequestIdRef.current) {
         setIsLoading(false);
+        isFetchingRef.current = false;
       }
     }
   }, [
@@ -64101,6 +64156,52 @@ var useLiveMonitorBootstrap = ({
     normalizedBlueComparisonLineIds,
     requestKey
   ]);
+  const fetchBootstrapRef = React144.useRef(fetchBootstrap);
+  React144.useEffect(() => {
+    fetchBootstrapRef.current = fetchBootstrap;
+  }, [fetchBootstrap]);
+  const clearRealtimeRefreshTimer = React144.useCallback(() => {
+    if (realtimeRefreshTimerRef.current !== null) {
+      window.clearTimeout(realtimeRefreshTimerRef.current);
+      realtimeRefreshTimerRef.current = null;
+    }
+  }, []);
+  const scheduleRealtimeRefresh = React144.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 = React144.useCallback(() => {
+    if (!enabled || !supabase) {
+      pendingRealtimeRefreshRef.current = false;
+      clearRealtimeRefreshTimer();
+      return;
+    }
+    pendingRealtimeRefreshRef.current = true;
+    scheduleRealtimeRefresh();
+  }, [clearRealtimeRefreshTimer, enabled, scheduleRealtimeRefresh, supabase]);
+  React144.useEffect(() => {
+    return () => {
+      pendingRealtimeRefreshRef.current = false;
+      clearRealtimeRefreshTimer();
+    };
+  }, [clearRealtimeRefreshTimer]);
   React144.useEffect(() => {
     if (!enabled || !rawState || !resolvedCompanyId) {
       return;
@@ -64179,6 +64280,83 @@ var useLiveMonitorBootstrap = ({
     }
     void fetchBootstrap(false);
   }, [enabled, resolvedCompanyId, normalizedLineIds, supabase, fetchBootstrap]);
+  const realtimeScopeKey = React144.useMemo(() => Array.from(createResolvedScopeLookup(
+    state.resolvedScope,
+    state.workspaceMetrics,
+    state.blueComparisonWorkspaceMetrics
+  )).sort().join("||"), [state.resolvedScope, state.workspaceMetrics, state.blueComparisonWorkspaceMetrics]);
+  React144.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
+  ]);
+  React144.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]);
   React144.useEffect(() => {
     if (!enabled || !resolvedCompanyId || normalizedLineIds.length === 0 || !supabase) {
       return void 0;
@@ -64933,7 +65111,6 @@ function HomeView({
   const allGreenMilestoneTrackingRef = React144.useRef({ identity: null, lastMilestoneSeconds: null });
   const allGreenStreakTimerBaselineRef = React144.useRef(null);
   const [showAllGreenCelebration, setShowAllGreenCelebration] = React144.useState(false);
-  const [allGreenCelebrationStartedAtMs, setAllGreenCelebrationStartedAtMs] = React144.useState(null);
   const [greenStreakMilestoneBanner, setGreenStreakMilestoneBanner] = React144.useState(null);
   const [allGreenStreakNowMs, setAllGreenStreakNowMs] = React144.useState(() => Date.now());
   const currentAllGreenStreakNowMs = Math.max(allGreenStreakNowMs, Date.now());
@@ -64996,13 +65173,11 @@ function HomeView({
     };
   }, [allGreenMilestoneIdentity, allGreenStreakDisplay, currentAllGreenStreakNowMs]);
   const allGreenCelebrationTimerText = React144.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]);
   React144.useEffect(() => {
     const hasPossibleStreakTimer = showAllGreenCelebration || Boolean(allGreenStreakDisplay) || workspaceMetricsWithBreakState.some((workspace) => workspace.video_grid_green_streak_active === true);
     if (!hasPossibleStreakTimer) {
@@ -65021,17 +65196,14 @@ function HomeView({
       allGreenCelebrationTimerRef.current = null;
     }
     setShowAllGreenCelebration(false);
-    setAllGreenCelebrationStartedAtMs(null);
   }, []);
   const triggerAllGreenCelebration = React144.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);
   }, []);

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:", {
@@ -37791,12 +37819,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,
@@ -63935,6 +63961,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 +64001,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 +64038,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 +64078,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 +64116,7 @@ var useLiveMonitorBootstrap = ({
     } finally {
       if (requestId === activeRequestIdRef.current) {
         setIsLoading(false);
+        isFetchingRef.current = false;
       }
     }
   }, [
@@ -64072,6 +64127,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 +64251,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 +65082,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 +65144,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 +65167,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);
   }, []);

package/package.json

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