@optifye/dashboard-core 6.10.31 → 6.10.33

package/dist/index.js

@@ -7667,6 +7667,27 @@ var weeklyTopPerformerService = {
     return data?.top_performer ?? null;
   }
 };
+
+// src/lib/services/lineLeaderboardService.ts
+var lineLeaderboardService = {
+  async getLineLeaderboard(supabase, params) {
+    const searchParams = new URLSearchParams();
+    searchParams.set("company_id", params.companyId);
+    searchParams.set("start_date", params.startDate);
+    searchParams.set("end_date", params.endDate);
+    if (params.lineIds && params.lineIds.length > 0) {
+      searchParams.set("line_ids", params.lineIds.join(","));
+    }
+    if (typeof params.limit === "number") {
+      searchParams.set("limit", params.limit.toString());
+    }
+    const data = await fetchBackendJson(
+      supabase,
+      `/api/dashboard/line-leaderboard?${searchParams.toString()}`
+    );
+    return data?.entries ?? [];
+  }
+};
 var SupabaseContext = React25.createContext(void 0);
 var SupabaseProvider = ({ client, children }) => {
   _setSupabaseInstance(client);
@@ -10202,9 +10223,25 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
   const inFlightFetchKeyRef = React25.useRef(null);
   const updateQueueRef = React25.useRef(false);
   const onLineMetricsUpdateRef = React25.useRef(onLineMetricsUpdate);
+  const shiftGroupsRef = React25.useRef(shiftGroups);
+  const operationalShiftKeyRef = React25.useRef(operationalShiftKey);
+  const configuredLineIdsRef = React25.useRef(configuredLineIds);
+  const userAccessibleLineIdsRef = React25.useRef(userAccessibleLineIds);
   React25.useEffect(() => {
     onLineMetricsUpdateRef.current = onLineMetricsUpdate;
   }, [onLineMetricsUpdate]);
+  React25.useEffect(() => {
+    shiftGroupsRef.current = shiftGroups;
+  }, [shiftGroups]);
+  React25.useEffect(() => {
+    operationalShiftKeyRef.current = operationalShiftKey;
+  }, [operationalShiftKey]);
+  React25.useEffect(() => {
+    configuredLineIdsRef.current = configuredLineIds;
+  }, [configuredLineIds]);
+  React25.useEffect(() => {
+    userAccessibleLineIdsRef.current = userAccessibleLineIds;
+  }, [userAccessibleLineIds]);
   const companySpecificMetricsTable = React25.useMemo(
     () => getCompanyMetricsTableName(entityConfig.companyId, "performance_metrics"),
     [entityConfig.companyId]
@@ -10535,8 +10572,29 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
     if (!supabase || shiftLoading || isTimezoneLoading) return;
     fetchAllMetrics({ force: true, reason: "shift-change" });
   }, [isFactoryView, shiftGroupsKey, supabase, shiftLoading, isTimezoneLoading, fetchAllMetrics]);
+  const subscriptionKey = React25.useMemo(() => {
+    if (!supabase || !entityConfig?.companyId) return null;
+    if (shiftLoading || isTimezoneLoading) return null;
+    const isFactory = lineId === (entityConfig.factoryViewId || "factory");
+    if (isFactory && shiftGroups.length === 0) return null;
+    const shiftGroupsKeyPart = isFactory ? shiftGroups.map((g) => `${g.date}-${g.shiftId}-${g.lineIds.join("_")}`).join("|") : operationalShiftKey;
+    return `${lineId}|${entityConfig.companyId}|${shiftGroupsKeyPart}`;
+  }, [
+    supabase,
+    entityConfig?.companyId,
+    entityConfig?.factoryViewId,
+    lineId,
+    shiftLoading,
+    isTimezoneLoading,
+    shiftGroups,
+    operationalShiftKey
+  ]);
   React25.useEffect(() => {
     const currentLineIdToUse = lineIdRef.current;
+    if (!subscriptionKey) {
+      logDebug("[useDashboardMetrics] Realtime setup skipped: subscriptionKey not ready (config still loading)");
+      return;
+    }
     if (!currentLineIdToUse || !supabase || companySpecificMetricsTable.includes("unknown_company") || !entityConfig.companyId) {
       logDebug("[useDashboardMetrics] Realtime setup skipped:", {
         lineId: currentLineIdToUse,
@@ -10549,18 +10607,22 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
     const factoryViewIdentifier = entityConfig.factoryViewId || "factory";
     const isFactory = currentLineIdToUse === factoryViewIdentifier;
     const channels = [];
+    const currentShiftGroups = shiftGroupsRef.current;
+    const currentUserAccessibleLineIds = userAccessibleLineIdsRef.current;
+    const currentConfiguredLineIds = configuredLineIdsRef.current;
     logDebug("[useDashboardMetrics] Realtime setup starting:", {
       lineId: currentLineIdToUse,
       isFactory,
-      shiftGroupsCount: shiftGroups.length,
+      shiftGroupsCount: currentShiftGroups.length,
       companySpecificMetricsTable,
-      configuredLineMetricsTable
+      configuredLineMetricsTable,
+      subscriptionKey
     });
-    if (isFactory && shiftGroups.length > 0) {
+    if (isFactory && currentShiftGroups.length > 0) {
       logDebug("[useDashboardMetrics] Setting up group subscriptions:", {
-        groupCount: shiftGroups.length
+        groupCount: currentShiftGroups.length
       });
-      shiftGroups.forEach((group, index) => {
+      currentShiftGroups.forEach((group, index) => {
         const groupLineIds = group.lineIds.filter((id3) => id3 && id3 !== factoryViewIdentifier);
         if (groupLineIds.length === 0) {
           logDebug("[useDashboardMetrics] Skipping group subscription: no line IDs after filtering", {
@@ -10579,6 +10641,18 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
           { event: "*", schema, table: companySpecificMetricsTable, filter: filter2 },
           (payload) => {
             const payloadData = payload.new || payload.old;
+            console.log("[useDashboardMetrics] \u{1F4E1} WS_METRICS payload received:", {
+              eventType: payload.eventType,
+              lineId: payloadData?.line_id,
+              workspaceId: payloadData?.workspace_id,
+              date: payloadData?.date,
+              shiftId: payloadData?.shift_id,
+              expectedDate: group.date,
+              expectedShiftId: group.shiftId,
+              dateMatch: payloadData?.date === group.date,
+              shiftMatch: payloadData?.shift_id === group.shiftId,
+              efficiency: payloadData?.efficiency
+            });
             logDebug("[useDashboardMetrics] WS realtime payload:", {
               channel: wsChannelName,
               eventType: payload.eventType,
@@ -10589,10 +10663,19 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
               shiftId: payloadData?.shift_id
             });
             if (payloadData?.date === group.date && payloadData?.shift_id === group.shiftId) {
+              console.log("[useDashboardMetrics] \u2705 WS Date/shift match - triggering update");
               queueUpdate();
+            } else {
+              console.log("[useDashboardMetrics] \u274C WS Date/shift mismatch - update SKIPPED");
             }
           }
         ).subscribe((status) => {
+          console.log("[useDashboardMetrics] \u{1F4F6} WS metrics subscription:", {
+            channel: wsChannelName,
+            status,
+            table: companySpecificMetricsTable,
+            filter: filter2
+          });
           logDebug("[useDashboardMetrics] WS subscription status:", {
             channel: wsChannelName,
             status
@@ -10605,6 +10688,17 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
           { event: "*", schema, table: configuredLineMetricsTable, filter: filter2 },
           (payload) => {
             const payloadData = payload.new || payload.old;
+            console.log("[useDashboardMetrics] \u{1F4E1} LINE_METRICS payload received:", {
+              eventType: payload.eventType,
+              lineId: payloadData?.line_id,
+              date: payloadData?.date,
+              shiftId: payloadData?.shift_id,
+              expectedDate: group.date,
+              expectedShiftId: group.shiftId,
+              dateMatch: payloadData?.date === group.date,
+              shiftMatch: payloadData?.shift_id === group.shiftId,
+              avgEfficiency: payloadData?.avg_efficiency
+            });
             logDebug("[useDashboardMetrics] Line metrics realtime payload:", {
               channel: lmChannelName,
               eventType: payload.eventType,
@@ -10614,11 +10708,20 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
               shiftId: payloadData?.shift_id
             });
             if (payloadData?.date === group.date && payloadData?.shift_id === group.shiftId) {
+              console.log("[useDashboardMetrics] \u2705 Date/shift match - triggering update");
               queueUpdate();
               onLineMetricsUpdateRef.current?.();
+            } else {
+              console.log("[useDashboardMetrics] \u274C Date/shift mismatch - update SKIPPED");
             }
           }
         ).subscribe((status) => {
+          console.log("[useDashboardMetrics] \u{1F4F6} Line metrics subscription:", {
+            channel: lmChannelName,
+            status,
+            table: configuredLineMetricsTable,
+            filter: filter2
+          });
           logDebug("[useDashboardMetrics] Line metrics subscription status:", {
             channel: lmChannelName,
             status
@@ -10654,11 +10757,11 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
     } else {
       logDebug("[useDashboardMetrics] Using single-shift subscriptions:", {
         isFactory,
-        shiftGroupsCount: shiftGroups.length
+        shiftGroupsCount: currentShiftGroups.length
       });
       const currentShiftDetails = shiftConfig ? getCurrentShift(defaultTimezone, shiftConfig) : getCurrentShift(defaultTimezone, staticShiftConfig);
       const operationalDateForSubscription = currentShiftDetails.date;
-      const targetLineIds = isFactory ? userAccessibleLineIds || configuredLineIds : [currentLineIdToUse];
+      const targetLineIds = isFactory ? currentUserAccessibleLineIds || currentConfiguredLineIds : [currentLineIdToUse];
       const filteredLineIds = targetLineIds.filter((id3) => id3 && id3 !== factoryViewIdentifier);
       if (filteredLineIds.length === 0) {
         logDebug("[useDashboardMetrics] Realtime setup skipped: no line IDs after filtering", {
@@ -10683,6 +10786,20 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
           { event: "*", schema, table, filter: filter2 },
           (payload) => {
             const payloadData = payload.new || payload.old;
+            console.log(`[useDashboardMetrics] \u{1F4E1} ${table.toUpperCase()} payload received (single-line):`, {
+              eventType: payload.eventType,
+              table: payload.table,
+              lineId: payloadData?.line_id,
+              workspaceId: payloadData?.workspace_id,
+              date: payloadData?.date,
+              shiftId: payloadData?.shift_id,
+              expectedDate: operationalDateForSubscription,
+              expectedShiftId: currentShiftDetails.shiftId,
+              dateMatch: payloadData?.date === operationalDateForSubscription,
+              shiftMatch: payloadData?.shift_id === currentShiftDetails.shiftId,
+              avgEfficiency: payloadData?.avg_efficiency,
+              efficiency: payloadData?.efficiency
+            });
             logDebug("[useDashboardMetrics] Subscription payload:", {
               channel: channelName,
               eventType: payload.eventType,
@@ -10693,10 +10810,21 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
               shiftId: payloadData?.shift_id
             });
             if (payloadData?.date === operationalDateForSubscription && payloadData?.shift_id === currentShiftDetails.shiftId) {
+              console.log(`[useDashboardMetrics] \u2705 ${table} Date/shift match - triggering update`);
               callback();
+            } else {
+              console.log(`[useDashboardMetrics] \u274C ${table} Date/shift mismatch - update SKIPPED`);
             }
           }
         ).subscribe((status) => {
+          console.log(`[useDashboardMetrics] \u{1F4F6} ${table} subscription:`, {
+            channel: channelName,
+            status,
+            table,
+            filter: filter2,
+            expectedDate: operationalDateForSubscription,
+            expectedShiftId: currentShiftDetails.shiftId
+          });
           logDebug("[useDashboardMetrics] Subscription status:", {
             channel: channelName,
             status
@@ -10718,6 +10846,10 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
       });
     };
   }, [
+    // CRITICAL: Use subscriptionKey as the primary dependency for subscription recreation
+    // This ensures subscriptions are only recreated when the actual subscription parameters change,
+    // not during every transient state update during initial load
+    subscriptionKey,
     supabase,
     queueUpdate,
     companySpecificMetricsTable,
@@ -10728,10 +10860,10 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
     defaultTimezone,
     shiftConfig,
     staticShiftConfig,
-    shiftGroups,
-    operationalShiftKey,
-    lineId,
-    userAccessibleLineIds
+    // NOTE: shiftGroups and operationalShiftKey removed - they're accessed via refs
+    // to prevent subscription churn. subscriptionKey encapsulates their stable state.
+    lineId
+    // NOTE: userAccessibleLineIds removed - accessed via ref
   ]);
   const isMetricsForActiveLine = metricsLineId === lineId;
   const safeMetrics = isMetricsForActiveLine ? metrics2 : { workspaceMetrics: [], lineMetrics: [], metadata: void 0, efficiencyLegend: DEFAULT_EFFICIENCY_LEGEND };
@@ -12674,6 +12806,10 @@ function useHlsStream(videoRef, { src, shouldPlay, onFatalError, hlsConfig }) {
             return;
           }
           if (data.type === Hls__default.default.ErrorTypes.NETWORK_ERROR && (data.details === Hls__default.default.ErrorDetails.MANIFEST_LOAD_TIMEOUT || data.details === Hls__default.default.ErrorDetails.MANIFEST_LOAD_ERROR)) {
+            if (data.response?.code === 404 && isR2StreamRef.current) {
+              markStaleStream("manifest 404");
+              return;
+            }
             scheduleManifestRetry("manifest load timeout");
             return;
           }
@@ -12682,7 +12818,7 @@ function useHlsStream(videoRef, { src, shouldPlay, onFatalError, hlsConfig }) {
           if (data.response?.code === 404) {
             if (data.details === Hls__default.default.ErrorDetails.MANIFEST_LOAD_ERROR || data.details === Hls__default.default.ErrorDetails.LEVEL_LOAD_ERROR) {
               if (isR2StreamRef.current) {
-                scheduleManifestRetry("manifest 404");
+                markStaleStream("manifest 404");
                 return;
               }
               hardRestart("404 manifest hard restart");
@@ -13711,7 +13847,7 @@ var useActiveBreaks = (lineIds) => {
   const [isLoading, setIsLoading] = React25.useState(true);
   const [error, setError] = React25.useState(null);
   const supabase = useSupabase();
-  const parseTimeToMinutes2 = (timeStr) => {
+  const parseTimeToMinutes3 = (timeStr) => {
     const [hours, minutes] = timeStr.split(":").map(Number);
     return hours * 60 + minutes;
   };
@@ -13720,8 +13856,8 @@ var useActiveBreaks = (lineIds) => {
     return now4.getHours() * 60 + now4.getMinutes();
   };
   const isTimeInBreak = (breakStart, breakEnd, currentMinutes) => {
-    const startMinutes = parseTimeToMinutes2(breakStart);
-    const endMinutes = parseTimeToMinutes2(breakEnd);
+    const startMinutes = parseTimeToMinutes3(breakStart);
+    const endMinutes = parseTimeToMinutes3(breakEnd);
     if (endMinutes < startMinutes) {
       return currentMinutes >= startMinutes || currentMinutes < endMinutes;
     } else {
@@ -13729,8 +13865,8 @@ var useActiveBreaks = (lineIds) => {
     }
   };
   const calculateBreakProgress = (breakStart, breakEnd, currentMinutes) => {
-    const startMinutes = parseTimeToMinutes2(breakStart);
-    const endMinutes = parseTimeToMinutes2(breakEnd);
+    const startMinutes = parseTimeToMinutes3(breakStart);
+    const endMinutes = parseTimeToMinutes3(breakEnd);
     let elapsedMinutes = 0;
     let remainingMinutes = 0;
     if (endMinutes < startMinutes) {
@@ -13748,8 +13884,8 @@ var useActiveBreaks = (lineIds) => {
     return { elapsedMinutes, remainingMinutes };
   };
   const isTimeInShift = (startTime, endTime, currentMinutes) => {
-    const startMinutes = parseTimeToMinutes2(startTime);
-    const endMinutes = parseTimeToMinutes2(endTime);
+    const startMinutes = parseTimeToMinutes3(startTime);
+    const endMinutes = parseTimeToMinutes3(endTime);
     if (endMinutes < startMinutes) {
       return currentMinutes >= startMinutes || currentMinutes < endMinutes;
     } else {
@@ -13809,8 +13945,8 @@ var useActiveBreaks = (lineIds) => {
               const endTime = breakItem.end || breakItem.endTime || "00:00";
               let duration = breakItem.duration || 0;
               if (!duration || duration === 0) {
-                const startMinutes = parseTimeToMinutes2(startTime);
-                const endMinutes = parseTimeToMinutes2(endTime);
+                const startMinutes = parseTimeToMinutes3(startTime);
+                const endMinutes = parseTimeToMinutes3(endTime);
                 duration = endMinutes < startMinutes ? endMinutes + 24 * 60 - startMinutes : endMinutes - startMinutes;
               }
               return {
@@ -13826,8 +13962,8 @@ var useActiveBreaks = (lineIds) => {
               const endTime = breakItem.end || breakItem.endTime || "00:00";
               let duration = breakItem.duration || 0;
               if (!duration || duration === 0) {
-                const startMinutes = parseTimeToMinutes2(startTime);
-                const endMinutes = parseTimeToMinutes2(endTime);
+                const startMinutes = parseTimeToMinutes3(startTime);
+                const endMinutes = parseTimeToMinutes3(endTime);
                 duration = endMinutes < startMinutes ? endMinutes + 24 * 60 - startMinutes : endMinutes - startMinutes;
               }
               return {
@@ -15846,6 +15982,13 @@ var useSupervisorsByLineIds = (lineIds, options) => {
     refetch: fetchSupervisors
   };
 };
+var DEBUG_DASHBOARD = process.env.NEXT_PUBLIC_DEBUG_DASHBOARD === "true";
+var logIdleTimeReasonsDebug = (...args) => {
+  if (DEBUG_DASHBOARD) {
+    console.log(...args);
+  }
+};
+var nowMs = () => typeof performance !== "undefined" ? performance.now() : Date.now();
 function useIdleTimeReasons({
   workspaceId,
   lineId,
@@ -15865,23 +16008,44 @@ function useIdleTimeReasons({
   const lastRequestKeyRef = React25.useRef("");
   const fetchData = React25.useCallback(async () => {
     if (!workspaceId && !lineId) {
+      logIdleTimeReasonsDebug("[useIdleTimeReasons] Skipping fetch (missing id)", {
+        requestKey,
+        workspaceId,
+        lineId
+      });
       setError("At least one of workspaceId or lineId is required");
       setIsFetching(false);
       return;
     }
     const token = session?.access_token;
     if (!token) {
+      logIdleTimeReasonsDebug("[useIdleTimeReasons] Skipping fetch (no auth token)", {
+        requestKey,
+        workspaceId,
+        lineId
+      });
       setError("Not authenticated");
       setIsFetching(false);
       return;
     }
     const currentRequestKey = requestKey;
     lastRequestKeyRef.current = currentRequestKey;
+    const startedAt = nowMs();
+    logIdleTimeReasonsDebug("[useIdleTimeReasons] Fetch start", {
+      requestKey: currentRequestKey,
+      workspaceId,
+      lineId,
+      date,
+      shiftId,
+      startDate,
+      endDate
+    });
     setIsFetching(true);
     if (!keepPreviousData) {
       setData(null);
     }
     setError(null);
+    let errorMessage = null;
     try {
       const result = await fetchIdleTimeReasons({
         workspaceId,
@@ -15898,22 +16062,32 @@ function useIdleTimeReasons({
       }
     } catch (err) {
       console.error("[useIdleTimeReasons] Error:", err);
+      errorMessage = err instanceof Error ? err.message : "Failed to fetch idle time reasons";
       if (isMountedRef.current && lastRequestKeyRef.current === currentRequestKey) {
-        setError(err instanceof Error ? err.message : "Failed to fetch idle time reasons");
+        setError(errorMessage);
       }
     } finally {
       if (isMountedRef.current && lastRequestKeyRef.current === currentRequestKey) {
         setIsFetching(false);
       }
+      const fetchEndAt = nowMs();
+      const elapsedMs = startedAt ? Math.round(fetchEndAt - startedAt) : null;
+      logIdleTimeReasonsDebug("[useIdleTimeReasons] Fetch end", {
+        requestKey: currentRequestKey,
+        elapsedMs,
+        error: errorMessage
+      });
     }
   }, [workspaceId, lineId, date, shiftId, startDate, endDate, session?.access_token, requestKey, keepPreviousData]);
   React25.useEffect(() => {
     isMountedRef.current = true;
     if (!enabled) {
+      logIdleTimeReasonsDebug("[useIdleTimeReasons] Disabled", { requestKey });
       setIsFetching(false);
     } else if (session?.access_token) {
       fetchData();
     } else {
+      logIdleTimeReasonsDebug("[useIdleTimeReasons] Waiting for auth token", { requestKey });
       setError("Not authenticated");
       setIsFetching(false);
     }
@@ -30608,9 +30782,9 @@ var MapGridView = React25__namespace.default.memo(({
   }, [workspaces]);
   const getPerformanceColor = React25.useCallback((efficiency) => {
     const color2 = getEfficiencyColor(efficiency, effectiveLegend);
-    if (color2 === "green") return "border-green-500 bg-green-50";
-    if (color2 === "yellow") return "border-yellow-500 bg-yellow-50";
-    return "border-red-500 bg-red-50";
+    if (color2 === "green") return "bg-green-500 text-white border-green-600";
+    if (color2 === "yellow") return "bg-yellow-400 text-white border-yellow-500";
+    return "bg-red-500 text-white border-red-600";
   }, [effectiveLegend]);
   const prewarmClipsInit = React25.useCallback((workspace) => {
     if (!dashboardConfig?.s3Config) return;
@@ -30678,52 +30852,52 @@ var MapGridView = React25__namespace.default.memo(({
           /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("pattern", { id: "grid", width: "40", height: "40", patternUnits: "userSpaceOnUse", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M 40 0 L 0 0 0 40", fill: "none", stroke: "gray", strokeWidth: "0.5" }) }) }),
           /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "100%", height: "100%", fill: "url(#grid)" })
         ] }) }),
-        activePositions.map((position) => {
+        workspacePositions.map((position) => {
           const wsKey = position.id.toUpperCase();
           const workspace = workspaceMetricsMap.get(wsKey);
-          if (!workspace) return null;
-          const workspaceId = workspace.workspace_uuid || workspace.workspace_name;
-          const workspaceKey = `${workspace.line_id || "unknown"}-${workspaceId}`;
-          const performanceColor = getPerformanceColor(workspace.efficiency);
-          const showExclamation = workspace.show_exclamation ?? (workspace.efficiency < 50 && workspace.efficiency >= 10);
-          const workspaceDisplayName = displayNames[`${workspace.line_id}_${workspace.workspace_name}`] || // Always pass line_id to fallback to ensure correct mapping per line
-          getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
+          const isInactivePlaceholder = position.id.startsWith("INACTIVE");
+          const effectiveWorkspace = workspace || {
+            workspace_name: position.id,
+            // Fallback to config ID
+            workspace_uuid: position.id,
+            // Use config ID as temporary UUID
+            line_id: "",
+            efficiency: 0,
+            show_exclamation: false
+          };
+          const workspaceId = effectiveWorkspace.workspace_uuid || effectiveWorkspace.workspace_name;
+          const workspaceKey = `${effectiveWorkspace.line_id || "unknown"}-${workspaceId}`;
+          const isConveyorRow = position.size === "conveyor_row";
+          const performanceColor = isInactivePlaceholder || isConveyorRow ? "bg-slate-200 border-slate-300 text-slate-500" : getPerformanceColor(effectiveWorkspace.efficiency);
+          !isInactivePlaceholder && !isConveyorRow && (effectiveWorkspace.show_exclamation ?? (effectiveWorkspace.efficiency < 50 && effectiveWorkspace.efficiency >= 10));
+          const configLabel = position.label;
+          const workspaceDisplayName = configLabel || (isInactivePlaceholder ? "INACTIVE" : displayNames[`${effectiveWorkspace.line_id}_${effectiveWorkspace.workspace_name}`] || getWorkspaceDisplayName(effectiveWorkspace.workspace_name, effectiveWorkspace.line_id) || position.id);
           return /* @__PURE__ */ jsxRuntime.jsx(
             motion.div,
             {
               initial: { opacity: 0, scale: 0.8 },
               animate: { opacity: 1, scale: 1 },
               transition: { duration: 0.3 },
-              className: "absolute cursor-pointer",
+              className: `absolute ${isInactivePlaceholder || isConveyorRow ? "cursor-default" : "cursor-pointer"}`,
               style: {
                 left: `${position.x}%`,
                 top: `${position.y}%`,
                 transform: "translate(-50%, -50%)"
               },
-              onClick: () => handleWorkspaceClick(workspace),
-              onMouseEnter: () => onWorkspaceHover?.(workspaceId),
-              onMouseLeave: () => onWorkspaceHoverEnd?.(workspaceId),
-              children: /* @__PURE__ */ jsxRuntime.jsxs(
+              onClick: () => !isInactivePlaceholder && !isConveyorRow && workspace && handleWorkspaceClick(workspace),
+              onMouseEnter: () => !isInactivePlaceholder && !isConveyorRow && onWorkspaceHover?.(workspaceId),
+              onMouseLeave: () => !isInactivePlaceholder && !isConveyorRow && onWorkspaceHoverEnd?.(workspaceId),
+              children: /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
                 {
                   className: `
-                  relative rounded-lg border-2 shadow-lg hover:shadow-xl 
-                  transition-all duration-200 hover:scale-105 bg-white
+                  relative 
+                  rounded-lg border-2 shadow-sm 
+                  ${!isInactivePlaceholder && !isConveyorRow ? "shadow-lg hover:shadow-xl transition-all duration-200 hover:scale-105" : ""} 
                   ${performanceColor}
-                  ${position.size === "conveyor" ? "w-32 h-24" : position.size === "large" ? "w-40 h-32" : "w-36 h-28"}
+                  ${position.size === "conveyor" ? "w-32 h-24" : position.size === "large" ? "w-40 h-32" : position.size === "small_square" ? "w-16 h-16" : position.size === "wide_rectangle" ? "w-32 h-16" : position.size === "conveyor_row" ? "w-3/4 h-16" : "w-36 h-28"}
                 `,
-                  children: [
-                    showExclamation && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -top-2 -left-2 z-30", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -inset-1 bg-red-400/50 rounded-full blur-sm animate-pulse" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -inset-0.5 bg-red-500/30 rounded-full blur-md animate-ping [animation-duration:1.5s]" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-[#E34329] w-5 h-5 rounded-full flex items-center justify-center text-white font-bold text-xs shadow-lg ring-2 ring-red-400/40 border border-red-400/80 animate-pulse", children: "!" })
-                    ] }) }),
-                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 left-0 right-0 px-2 py-1.5 border-b border-gray-200", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-bold text-gray-800 truncate text-center leading-tight", children: workspaceDisplayName }) }),
-                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-0 left-0 right-0 px-2 py-2", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-2xl font-bold text-gray-900", children: [
-                      Math.round(workspace.efficiency),
-                      "%"
-                    ] }) }) })
-                  ]
+                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `absolute inset-0 px-2 py-1.5 flex items-center justify-center`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `text-xs font-bold ${isInactivePlaceholder ? "text-gray-400" : isConveyorRow ? "text-gray-400 text-lg tracking-widest uppercase" : "text-white"} text-center leading-tight whitespace-normal break-words w-full`, children: workspaceDisplayName }) })
                 }
               )
             },
@@ -40654,7 +40828,7 @@ var LineMonthlyHistory = ({
   const averages = (analysisMonthlyData || []).reduce(
     (acc, day) => {
       const shiftData = getShiftData2(day, selectedShiftId);
-      if (!shiftData || shiftData?.avg_efficiency < 10) {
+      if (!shiftData || shiftData?.avg_efficiency < 5) {
         return acc;
       }
       return {
@@ -41116,7 +41290,7 @@ var LineMonthlyPdfGenerator = ({
       });
       const validShifts = validDays.map(
         (day) => getLineShiftData2(day, selectedShiftId)
-      ).filter((shift) => shift.avg_efficiency > 0);
+      ).filter((shift) => shift.avg_efficiency >= 5);
       const monthlyMetrics = validShifts.length > 0 ? {
         avgEfficiency: validShifts.reduce((sum, shift) => sum + shift.avg_efficiency, 0) / validShifts.length,
         avgUnderperforming: validShifts.reduce((sum, shift) => sum + shift.underperforming_workspaces, 0) / validShifts.length,
@@ -41484,7 +41658,7 @@ var LinePdfGenerator = ({
       doc.setLineWidth(0.8);
       doc.line(20, 118, 190, 118);
       const hourlyOverviewStartY = 123;
-      const parseTimeToMinutes2 = (timeStr) => {
+      const parseTimeToMinutes3 = (timeStr) => {
         const [hours, minutes] = timeStr.split(":");
         const hour = parseInt(hours, 10);
         const minute = parseInt(minutes || "0", 10);
@@ -41517,7 +41691,7 @@ var LinePdfGenerator = ({
         };
       };
       const getHourlyTimeRanges = (startTimeStr, endTimeStr) => {
-        const startMinutes = parseTimeToMinutes2(startTimeStr);
+        const startMinutes = parseTimeToMinutes3(startTimeStr);
         if (Number.isNaN(startMinutes)) {
           return [];
         }
@@ -41525,7 +41699,7 @@ var LinePdfGenerator = ({
           const defaultHours = 11;
           return Array.from({ length: defaultHours }, (_, i) => buildRange(startMinutes + i * 60, 60));
         }
-        const endMinutes = parseTimeToMinutes2(endTimeStr);
+        const endMinutes = parseTimeToMinutes3(endTimeStr);
         if (Number.isNaN(endMinutes)) {
           const fallbackHours = 11;
           return Array.from({ length: fallbackHours }, (_, i) => buildRange(startMinutes + i * 60, 60));
@@ -54572,6 +54746,376 @@ var KPIDetailViewWithDisplayNames = withSelectedLineDisplayNames(KPIDetailView);
 var KPIDetailView_default = KPIDetailViewWithDisplayNames;
 var isNonEmptyString = (value) => typeof value === "string" && value.trim().length > 0;
 var resolveCompanyId = (...candidates) => candidates.find(isNonEmptyString);
+var parseTimeToMinutes2 = (value) => {
+  if (!value) return null;
+  const [hourStr, minuteStr] = value.split(":");
+  const hour = Number.parseInt(hourStr ?? "", 10);
+  const minute = Number.parseInt(minuteStr ?? "", 10);
+  if (!Number.isFinite(hour) || !Number.isFinite(minute)) return null;
+  return hour * 60 + minute;
+};
+var getShiftEndDate = (shift, timezone) => {
+  if (!shift?.date) return null;
+  const startTime = shift.startTime || "06:00";
+  const endTime = shift.endTime || "18:00";
+  const startMinutes = parseTimeToMinutes2(startTime);
+  const endMinutes = parseTimeToMinutes2(endTime);
+  if (startMinutes === null || endMinutes === null) return null;
+  const shiftStartDate = dateFnsTz.fromZonedTime(`${shift.date}T${startTime}:00`, timezone);
+  let durationMinutes = endMinutes - startMinutes;
+  if (durationMinutes <= 0) durationMinutes += 24 * 60;
+  return dateFns.addMinutes(shiftStartDate, durationMinutes);
+};
+var getMonthDateInfo = (timezone) => {
+  const zonedNow = dateFnsTz.toZonedTime(/* @__PURE__ */ new Date(), timezone);
+  const year = zonedNow.getFullYear();
+  const monthIndex = zonedNow.getMonth();
+  const day = zonedNow.getDate();
+  const startDate = buildDateKey(year, monthIndex, 1);
+  const endDate = buildDateKey(year, monthIndex, day);
+  const lastDay = new Date(year, monthIndex + 1, 0).getDate();
+  const monthEndKey = buildDateKey(year, monthIndex, lastDay);
+  const monthEndDate = dateFnsTz.fromZonedTime(`${monthEndKey}T23:59:59`, timezone);
+  return { startDate, endDate, monthEndDate };
+};
+var LeaderboardCountdown = ({ targetDate, format: format7, finishedLabel = "Finished", placeholder = "--", onFinished }) => {
+  const [time2, setTime] = React25.useState("");
+  const hasFinishedRef = React25.useRef(false);
+  React25.useEffect(() => {
+    hasFinishedRef.current = false;
+  }, [targetDate]);
+  React25.useEffect(() => {
+    if (!targetDate) {
+      setTime(placeholder);
+      return;
+    }
+    const tick = () => {
+      const now4 = /* @__PURE__ */ new Date();
+      const diff = targetDate.getTime() - now4.getTime();
+      if (diff <= 0) {
+        setTime(finishedLabel);
+        if (!hasFinishedRef.current && onFinished) {
+          hasFinishedRef.current = true;
+          onFinished();
+        }
+        return;
+      }
+      if (format7 === "days") {
+        const days = Math.floor(diff / (1e3 * 60 * 60 * 24));
+        const hours = Math.floor(diff % (1e3 * 60 * 60 * 24) / (1e3 * 60 * 60));
+        setTime(`${days} days ${hours} hours`);
+        return;
+      }
+      const totalSeconds = Math.floor(diff / 1e3);
+      const h = Math.floor(totalSeconds / 3600);
+      const m = Math.floor(totalSeconds % 3600 / 60);
+      const s = totalSeconds % 60;
+      setTime(`${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}:${s.toString().padStart(2, "0")}`);
+    };
+    tick();
+    const interval = setInterval(tick, 1e3);
+    return () => clearInterval(interval);
+  }, [targetDate, format7, finishedLabel, placeholder, onFinished]);
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: time2 });
+};
+var LinesLeaderboard = ({
+  lines,
+  onLineClick,
+  timeRange,
+  setTimeRange,
+  todayEfficiencyByLineId,
+  monthlyEfficiencyByLineId,
+  supervisorsByLineId,
+  supervisorNamesByLineId,
+  isLoadingToday,
+  isLoadingMonthly,
+  shiftEndDate,
+  monthEndDate
+}) => {
+  const formatEfficiency = (value) => typeof value === "number" && Number.isFinite(value) ? `${value.toFixed(1)}%` : "--";
+  const handleTimeRangeChange = React25__namespace.default.useCallback((newRange) => {
+    if (newRange === timeRange) return;
+    trackCoreEvent("Leaderboard Time Range Changed", {
+      from_range: timeRange,
+      to_range: newRange,
+      from_page: "leaderboard",
+      lines_count: lines.length,
+      has_monthly_data: monthlyEfficiencyByLineId ? monthlyEfficiencyByLineId.size > 0 : false
+    });
+    setTimeRange(newRange);
+  }, [timeRange, lines.length, monthlyEfficiencyByLineId, setTimeRange]);
+  const handleLeaderboardLineClick = React25__namespace.default.useCallback((item, clickSource) => {
+    trackCoreEvent("Leaderboard Line Clicked", {
+      line_id: item.line.id,
+      line_name: item.line.line_name,
+      rank: item.rank,
+      efficiency: item.efficiency,
+      time_range: timeRange,
+      click_source: clickSource,
+      from_page: "leaderboard",
+      supervisor_name: item.supervisorName || "Unassigned"
+    });
+    onLineClick(item.line);
+  }, [onLineClick, timeRange]);
+  const viewLoadedTrackedRef = React25__namespace.default.useRef(null);
+  const leaderboardData = React25__namespace.default.useMemo(() => {
+    const loading = timeRange === "today" ? isLoadingToday : isLoadingMonthly;
+    const efficiencyMap = timeRange === "today" ? todayEfficiencyByLineId : monthlyEfficiencyByLineId;
+    return lines.map((line) => {
+      const supervisors = supervisorsByLineId?.get(line.id) || [];
+      const primarySupervisor = supervisors[0];
+      const supervisorName = supervisorNamesByLineId.get(line.id) || primarySupervisor?.displayName || "Unassigned";
+      const supervisorImage = primarySupervisor?.profilePhotoUrl || null;
+      const hasEfficiency = efficiencyMap.has(line.id);
+      const efficiency = loading ? null : hasEfficiency ? efficiencyMap.get(line.id) ?? 0 : timeRange === "monthly" ? 0 : null;
+      const sortValue = typeof efficiency === "number" ? efficiency : -1;
+      return {
+        id: line.id,
+        line,
+        supervisorName,
+        supervisorImage,
+        supervisors,
+        efficiency,
+        sortValue
+      };
+    }).sort((a, b) => b.sortValue - a.sortValue).map((item, index) => ({ ...item, rank: index + 1 }));
+  }, [
+    lines,
+    timeRange,
+    todayEfficiencyByLineId,
+    monthlyEfficiencyByLineId,
+    supervisorsByLineId,
+    supervisorNamesByLineId,
+    isLoadingToday,
+    isLoadingMonthly
+  ]);
+  React25__namespace.default.useEffect(() => {
+    const isLoading = timeRange === "today" ? isLoadingToday : isLoadingMonthly;
+    const trackingKey = `${timeRange}-${leaderboardData.length}`;
+    if (leaderboardData.length > 0 && !isLoading && viewLoadedTrackedRef.current !== trackingKey) {
+      viewLoadedTrackedRef.current = trackingKey;
+      const topLine = leaderboardData[0];
+      const bottomLine = leaderboardData[leaderboardData.length - 1];
+      trackCoreEvent("Leaderboard View Loaded", {
+        time_range: timeRange,
+        lines_count: leaderboardData.length,
+        top_line_id: topLine?.line.id,
+        top_line_name: topLine?.line.line_name,
+        top_efficiency: topLine?.efficiency,
+        bottom_line_id: bottomLine?.line.id,
+        bottom_line_name: bottomLine?.line.line_name,
+        bottom_efficiency: bottomLine?.efficiency,
+        efficiency_spread: topLine && bottomLine && topLine.efficiency !== null && bottomLine.efficiency !== null ? (topLine.efficiency - bottomLine.efficiency).toFixed(1) : null,
+        from_page: "kpis_overview"
+      });
+    }
+  }, [timeRange, leaderboardData, isLoadingToday, isLoadingMonthly]);
+  const topThree = leaderboardData.slice(0, 3);
+  leaderboardData.slice(3);
+  const countdownTarget = timeRange === "monthly" ? monthEndDate : shiftEndDate;
+  const countdownFormat = timeRange === "monthly" ? "days" : "clock";
+  const countdownFinishedLabel = timeRange === "monthly" ? "Finished" : "Shift Ended";
+  const handleCountdownFinished = React25__namespace.default.useCallback(() => {
+    trackCoreEvent("Leaderboard Countdown Finished", {
+      countdown_type: timeRange === "monthly" ? "month_end" : "shift_end",
+      time_range: timeRange,
+      from_page: "leaderboard"
+    });
+  }, [timeRange]);
+  const podiumOrder = [
+    topThree[1],
+    // 2nd
+    topThree[0],
+    // 1st
+    topThree[2]
+    // 3rd
+  ].filter(Boolean);
+  const getRankColor = (rank) => {
+    switch (rank) {
+      case 1:
+        return "from-yellow-50 to-yellow-100 border-yellow-200 text-yellow-800";
+      case 2:
+        return "from-gray-50 to-gray-100 border-gray-200 text-gray-700";
+      case 3:
+        return "from-orange-50 to-orange-100 border-orange-200 text-orange-800";
+      default:
+        return "bg-white border-gray-100";
+    }
+  };
+  React25__namespace.default.useEffect(() => {
+    const style = document.createElement("style");
+    style.innerHTML = `
+      @keyframes float {
+        0% { transform: translateY(0px); }
+        50% { transform: translateY(-8px); }
+        100% { transform: translateY(0px); }
+      }
+      .animate-float-slow {
+        animation: float 4s ease-in-out infinite;
+      }
+      .animate-float-medium {
+        animation: float 3.5s ease-in-out infinite;
+        animation-delay: 0.5s;
+      }
+      .animate-float-fast {
+        animation: float 3s ease-in-out infinite;
+        animation-delay: 1s;
+      }
+    `;
+    document.head.appendChild(style);
+    return () => {
+      document.head.removeChild(style);
+    };
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col h-full gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col h-[70%] min-h-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-none relative flex flex-col md:flex-row justify-center items-center gap-4 pt-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex bg-gray-100/80 p-1 rounded-xl z-0", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => handleTimeRangeChange("today"),
+              className: `px-8 py-2.5 text-sm font-bold rounded-lg transition-all duration-200 ${timeRange === "today" ? "bg-white text-slate-900 shadow-md ring-1 ring-black/5" : "text-slate-500 hover:text-slate-700"}`,
+              children: "Daily"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => handleTimeRangeChange("monthly"),
+              className: `px-8 py-2.5 text-sm font-bold rounded-lg transition-all duration-200 ${timeRange === "monthly" ? "bg-white text-slate-900 shadow-md ring-1 ring-black/5" : "text-slate-500 hover:text-slate-700"}`,
+              children: "Monthly"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "md:absolute md:right-0 md:top-1/2 md:-translate-y-1/2 flex items-center gap-2.5 px-4 py-2 bg-white rounded-full shadow-sm border border-gray-100", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "w-4 h-4 text-orange-500" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold text-gray-400 uppercase tracking-wider", children: "Ends in" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-bold text-gray-900 tabular-nums tracking-tight font-mono", children: /* @__PURE__ */ jsxRuntime.jsx(
+              LeaderboardCountdown,
+              {
+                targetDate: countdownTarget,
+                format: countdownFormat,
+                finishedLabel: countdownFinishedLabel,
+                placeholder: timeRange === "monthly" ? "--" : "--:--:--",
+                onFinished: handleCountdownFinished
+              }
+            ) })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 hidden sm:flex justify-center items-end gap-2 md:gap-4 lg:gap-6 xl:gap-10 pb-4 pt-4 min-h-0", children: podiumOrder.map((item, index) => {
+        if (!item) return null;
+        const isFirst = item.rank === 1;
+        const isSecond = item.rank === 2;
+        item.rank === 3;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            onClick: () => handleLeaderboardLineClick(item, "podium"),
+            className: `relative flex flex-col items-center cursor-pointer z-10 transition-transform hover:scale-105`,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative -mb-4 z-20 ${isFirst ? "animate-float-slow" : isSecond ? "animate-float-medium" : "animate-float-fast"}`, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: `absolute inset-0 rounded-full blur-xl opacity-40 ${isFirst ? "bg-yellow-400" : isSecond ? "bg-gray-400" : "bg-orange-400"}` }),
+                item.supervisors && item.supervisors.length > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex -space-x-3 md:-space-x-4", children: [
+                    item.supervisors.slice(0, 3).map((supervisor) => /* @__PURE__ */ jsxRuntime.jsx(
+                      "div",
+                      {
+                        className: "relative inline-block w-10 h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 xl:w-16 xl:h-16 rounded-full ring-2 ring-white bg-white shadow-sm z-0 hover:z-10 transition-all hover:scale-110 overflow-hidden",
+                        children: supervisor.profilePhotoUrl ? /* @__PURE__ */ jsxRuntime.jsx(
+                          "img",
+                          {
+                            src: supervisor.profilePhotoUrl,
+                            alt: supervisor.displayName,
+                            className: "w-full h-full object-cover rounded-full"
+                          }
+                        ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center bg-gradient-to-br from-slate-50 to-slate-100", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs md:text-sm lg:text-base font-bold text-gray-600 uppercase", children: getInitials(supervisor.displayName) }) })
+                      },
+                      supervisor.userId
+                    )),
+                    item.supervisors.length > 3 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex w-10 h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 xl:w-16 xl:h-16 rounded-full ring-2 ring-white bg-gray-100 items-center justify-center text-xs md:text-sm font-medium text-gray-600 z-0", children: [
+                      "+",
+                      item.supervisors.length - 3
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: `absolute -bottom-2 md:-bottom-3 left-1/2 -translate-x-1/2 w-6 h-6 md:w-8 md:h-8 xl:w-10 xl:h-10 rounded-full flex items-center justify-center text-[10px] md:text-xs lg:text-sm xl:text-base font-extrabold text-white shadow-lg ${isFirst ? "bg-gradient-to-br from-yellow-400 to-yellow-600 ring-2 md:ring-4 ring-yellow-50" : isSecond ? "bg-gradient-to-br from-gray-400 to-gray-600 ring-2 md:ring-4 ring-gray-50" : "bg-gradient-to-br from-orange-400 to-orange-600 ring-2 md:ring-4 ring-orange-50"}`, children: item.rank })
+                ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative rounded-full p-1.5 bg-gradient-to-br ${isFirst ? "from-yellow-300 via-yellow-400 to-yellow-600 shadow-yellow-500/50" : isSecond ? "from-gray-300 via-gray-400 to-gray-500 shadow-gray-500/50" : "from-orange-300 via-orange-400 to-orange-600 shadow-orange-500/50"} shadow-xl`, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-12 h-12 md:w-16 md:h-16 lg:w-20 lg:h-20 xl:w-24 xl:h-24 rounded-full bg-white flex items-center justify-center overflow-hidden border-2 border-white/50", children: item.supervisorImage ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: item.supervisorImage, alt: item.supervisorName, className: "w-full h-full object-cover" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center bg-gradient-to-br from-slate-50 to-slate-100", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `text-base md:text-lg lg:text-xl xl:text-2xl font-bold ${isFirst ? "text-yellow-600" : isSecond ? "text-gray-600" : "text-orange-600"}`, children: getInitials(item.supervisorName) }) }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: `absolute -bottom-2 md:-bottom-3 left-1/2 -translate-x-1/2 w-6 h-6 md:w-8 md:h-8 xl:w-10 xl:h-10 rounded-full flex items-center justify-center text-[10px] md:text-xs lg:text-sm xl:text-base font-extrabold text-white shadow-lg ${isFirst ? "bg-gradient-to-br from-yellow-400 to-yellow-600 ring-2 md:ring-4 ring-yellow-50" : isSecond ? "bg-gradient-to-br from-gray-400 to-gray-600 ring-2 md:ring-4 ring-gray-50" : "bg-gradient-to-br from-orange-400 to-orange-600 ring-2 md:ring-4 ring-orange-50"}`, children: item.rank })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: `flex flex-col items-center w-32 md:w-40 lg:w-48 xl:w-60 px-2 md:px-3 xl:px-4 pb-3 md:pb-4 pt-8 md:pt-10 rounded-2xl border bg-gradient-to-b shadow-2xl backdrop-blur-sm ${getRankColor(item.rank)} ${isFirst ? "h-44 md:h-52 lg:h-60 xl:h-64" : isSecond ? "h-36 md:h-44 lg:h-52 xl:h-56" : "h-28 md:h-36 lg:h-44 xl:h-48"}`,
+                  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 flex flex-col items-center justify-center w-full", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: `font-bold text-gray-900 text-center line-clamp-1 mb-1 ${isFirst ? "text-xs md:text-sm lg:text-base xl:text-lg" : "text-[10px] md:text-xs lg:text-sm xl:text-base"}`, children: item.supervisorName }),
+                    /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-gray-600 text-center line-clamp-1 font-medium opacity-80 bg-white/50 px-2 md:px-3 py-0.5 rounded-full ${isFirst ? "text-[9px] md:text-[10px] lg:text-xs xl:text-sm mb-2 md:mb-3" : "text-[8px] md:text-[9px] lg:text-[10px] xl:text-xs mb-1 md:mb-2"}`, children: item.line.line_name }),
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center mt-auto", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: `font-bold uppercase tracking-widest mb-0.5 ${isFirst ? "text-yellow-700/70 text-[8px] md:text-[9px] lg:text-[10px] xl:text-xs" : isSecond ? "text-gray-600/70 text-[7px] md:text-[8px] lg:text-[9px] xl:text-[10px]" : "text-orange-700/70 text-[7px] md:text-[8px] lg:text-[9px] xl:text-[10px]"}`, children: "Efficiency" }),
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: `font-black tracking-tight leading-none ${isFirst ? "text-lg md:text-xl lg:text-2xl xl:text-3xl text-transparent bg-clip-text bg-gradient-to-br from-yellow-600 to-yellow-800 drop-shadow-sm" : isSecond ? "text-base md:text-lg lg:text-xl xl:text-2xl text-transparent bg-clip-text bg-gradient-to-br from-gray-600 to-gray-800 drop-shadow-sm" : "text-sm md:text-base lg:text-lg xl:text-xl text-transparent bg-clip-text bg-gradient-to-br from-orange-600 to-orange-800 drop-shadow-sm"}`, children: formatEfficiency(item.efficiency) })
+                    ] })
+                  ] })
+                }
+              )
+            ]
+          },
+          item.id
+        );
+      }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-none h-[30%] min-h-0 flex flex-col", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden h-full flex flex-col", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-auto flex-1", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full border-collapse", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("thead", { className: "bg-gray-50 border-b border-gray-200 sticky top-0 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider w-16", children: "Rank" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider", children: "Assigned To" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-4 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider", children: "Line" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-4 py-3 text-right text-xs font-semibold text-gray-500 uppercase tracking-wider", children: "Efficiency" })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "divide-y divide-gray-100", children: leaderboardData.map((item) => {
+        const isTopThree = item.rank <= 3;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "tr",
+          {
+            onClick: () => handleLeaderboardLineClick(item, isTopThree ? "podium" : "table"),
+            className: `hover:bg-gray-50 transition-colors cursor-pointer group ${isTopThree ? "sm:hidden" : ""}`,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center w-8 h-8 rounded-full bg-gray-100 text-gray-600 font-bold text-sm", children: item.rank }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+                item.supervisors && item.supervisors.length > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex -space-x-2", children: [
+                  item.supervisors.slice(0, 3).map((supervisor) => /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      className: "relative inline-block w-7 h-7 rounded-full ring-2 ring-white bg-white shadow-sm overflow-hidden",
+                      children: supervisor.profilePhotoUrl ? /* @__PURE__ */ jsxRuntime.jsx(
+                        "img",
+                        {
+                          src: supervisor.profilePhotoUrl,
+                          alt: supervisor.displayName,
+                          className: "w-full h-full object-cover rounded-full"
+                        }
+                      ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center bg-gray-100 text-[10px] font-bold text-gray-600 uppercase rounded-full", children: getInitials(supervisor.displayName) })
+                    },
+                    supervisor.userId
+                  )),
+                  item.supervisors.length > 3 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex w-7 h-7 rounded-full ring-2 ring-white bg-gray-100 items-center justify-center text-[10px] font-medium text-gray-600", children: [
+                    "+",
+                    item.supervisors.length - 3
+                  ] })
+                ] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-8 h-8 rounded-full bg-gray-100 flex items-center justify-center text-gray-500 overflow-hidden border border-gray-200 flex-shrink-0", children: item.supervisorImage ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: item.supervisorImage, alt: item.supervisorName, className: "w-full h-full object-cover" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-bold", children: getInitials(item.supervisorName) }) }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-gray-900", children: item.supervisorName })
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 whitespace-nowrap text-sm text-gray-500", children: item.line.line_name }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 whitespace-nowrap text-right", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-end", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-bold text-gray-900", children: formatEfficiency(item.efficiency) }) }) })
+            ]
+          },
+          item.id
+        );
+      }) })
+    ] }) }) }) })
+  ] });
+};
 var LineCard = ({
   line,
   kpis,
@@ -54730,6 +55274,8 @@ var KPIsOverviewView = ({
   lineIds
 }) => {
   const [lines, setLines] = React25.useState([]);
+  const [activeTab, setActiveTab] = React25.useState("today");
+  const [timeRange, setTimeRange] = React25.useState("today");
   const [loading, setLoading] = React25.useState(true);
   const [error, setError] = React25.useState(null);
   const [topPerformer, setTopPerformer] = React25.useState({
@@ -54743,6 +55289,10 @@ var KPIsOverviewView = ({
   });
   const [topPerformerLoading, setTopPerformerLoading] = React25.useState(true);
   const [topPerformerImageError, setTopPerformerImageError] = React25.useState(false);
+  const [monthlyEfficiencyByLineId, setMonthlyEfficiencyByLineId] = React25.useState(/* @__PURE__ */ new Map());
+  const [monthlyLoading, setMonthlyLoading] = React25.useState(false);
+  const [monthlyError, setMonthlyError] = React25.useState(null);
+  const monthlyRequestKeyRef = React25.useRef(null);
   const supabase = useSupabase();
   const dashboardConfig = useDashboardConfig();
   const entityConfig = useEntityConfig();
@@ -54757,6 +55307,7 @@ var KPIsOverviewView = ({
   const supervisorEnabled = dashboardConfig?.supervisorConfig?.enabled || false;
   const dbTimezone = useAppTimezone();
   const configuredTimezone = dbTimezone || dateTimeConfig.defaultTimezone || "UTC";
+  const { startDate: monthStartDate, endDate: monthEndDateKey, monthEndDate } = getMonthDateInfo(configuredTimezone);
   const factoryViewId = entityConfig.factoryViewId || "factory";
   const {
     lineMetrics,
@@ -54774,6 +55325,16 @@ var KPIsOverviewView = ({
     });
     return map;
   }, [lineMetrics]);
+  const todayEfficiencyByLineId = React25__namespace.default.useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    kpisByLineId.forEach((kpis, lineId) => {
+      const value = kpis?.efficiency?.value;
+      if (typeof value === "number" && Number.isFinite(value)) {
+        map.set(lineId, value);
+      }
+    });
+    return map;
+  }, [kpisByLineId]);
   const visibleLineIds = React25__namespace.default.useMemo(() => lines.map((l) => l.id), [lines]);
   const { supervisorNamesByLineId, supervisorsByLineId, allSupervisorsMap } = useSupervisorsByLineIds(visibleLineIds, {
     enabled: supervisorEnabled && visibleLineIds.length > 0
@@ -54837,6 +55398,61 @@ var KPIsOverviewView = ({
     };
     fetchLines();
   }, [supabase, dashboardConfig, lineIds]);
+  const fetchMonthlyLeaderboard = React25.useCallback(async () => {
+    if (!supabase || !resolvedCompanyId || lines.length === 0) return;
+    const targetLineIds = lines.map((line) => line.id);
+    const lineIdsKey = targetLineIds.slice().sort().join(",");
+    const requestKey = `${resolvedCompanyId}|${monthStartDate}|${monthEndDateKey}|${lineIdsKey}`;
+    if (monthlyRequestKeyRef.current === requestKey) return;
+    monthlyRequestKeyRef.current = requestKey;
+    setMonthlyLoading(true);
+    setMonthlyError(null);
+    const fetchStartTime = Date.now();
+    const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+    const currentMonth = (/* @__PURE__ */ new Date()).getMonth() + 1;
+    try {
+      const entries = await lineLeaderboardService.getLineLeaderboard(supabase, {
+        companyId: resolvedCompanyId,
+        startDate: monthStartDate,
+        endDate: monthEndDateKey,
+        lineIds: targetLineIds
+      });
+      const nextMap = /* @__PURE__ */ new Map();
+      targetLineIds.forEach((lineId) => nextMap.set(lineId, 0));
+      entries.forEach((entry) => {
+        const value = Number(entry.avg_efficiency);
+        nextMap.set(entry.line_id, Number.isFinite(value) ? value : 0);
+      });
+      setMonthlyEfficiencyByLineId(nextMap);
+      trackCoreEvent("Leaderboard Monthly Data Fetched", {
+        success: true,
+        lines_count: entries.length,
+        fetch_duration_ms: Date.now() - fetchStartTime,
+        year: currentYear,
+        month: currentMonth,
+        has_data: entries.length > 0,
+        from_page: "leaderboard"
+      });
+    } catch (err) {
+      console.error("[KPIsOverviewView] Failed to load monthly leaderboard:", err);
+      setMonthlyError("Failed to load monthly leaderboard");
+      monthlyRequestKeyRef.current = null;
+      trackCoreEvent("Leaderboard Monthly Data Fetched", {
+        success: false,
+        error_message: err instanceof Error ? err.message : "Unknown error",
+        fetch_duration_ms: Date.now() - fetchStartTime,
+        year: currentYear,
+        month: currentMonth,
+        from_page: "leaderboard"
+      });
+    } finally {
+      setMonthlyLoading(false);
+    }
+  }, [supabase, resolvedCompanyId, lines, monthStartDate, monthEndDateKey]);
+  React25.useEffect(() => {
+    if (activeTab !== "leaderboard") return;
+    fetchMonthlyLeaderboard();
+  }, [activeTab, timeRange, fetchMonthlyLeaderboard]);
   const formatTopPerformerWeek = (periodStart, periodEnd) => {
     if (!periodStart || !periodEnd) return "Last Week";
     const startDate = /* @__PURE__ */ new Date(`${periodStart}T00:00:00`);
@@ -54847,6 +55463,21 @@ var KPIsOverviewView = ({
     return `${startLabel} - ${endLabel}`;
   };
   const buildTopPerformerDisplay = (record) => {
+    const supervisorAvatars = [];
+    if (record.supervisors && record.supervisors.length > 0) {
+      for (const s of record.supervisors) {
+        let supervisorName = "Supervisor";
+        if (s.first_name) {
+          supervisorName = s.last_name ? `${s.first_name} ${s.last_name}` : s.first_name;
+        }
+        supervisorAvatars.push({
+          userId: s.user_id,
+          name: supervisorName,
+          imageUrl: s.profile_photo_url || null,
+          initials: getInitials(supervisorName)
+        });
+      }
+    }
     let displayName = record.recipient_name || "Supervisor";
     if (record.first_name) {
       displayName = record.last_name ? `${record.first_name} ${record.last_name}` : record.first_name;
@@ -54865,16 +55496,26 @@ var KPIsOverviewView = ({
         displayName = parts[0].charAt(0).toUpperCase() + parts[0].slice(1);
       }
     }
+    if (supervisorAvatars.length === 0 && record.recipient_user_id) {
+      supervisorAvatars.push({
+        userId: record.recipient_user_id,
+        name: displayName,
+        imageUrl: record.profile_photo_url || null,
+        initials: getInitials(displayName)
+      });
+    }
     const efficiencyValue = typeof record.avg_efficiency === "number" ? record.avg_efficiency : Number.parseFloat(String(record.avg_efficiency));
     const efficiency = Number.isFinite(efficiencyValue) ? efficiencyValue : null;
+    const unitLabel = record.winning_line_name || record.unit || "Line";
     return {
       name: displayName,
       role: "Sup.",
-      unit: record.unit || "Line",
+      unit: unitLabel,
       periodLabel: formatTopPerformerWeek(record.period_start, record.period_end),
       efficiency,
       imageUrl: record.profile_photo_url || null,
-      initials: getInitials(displayName)
+      initials: getInitials(displayName),
+      supervisors: supervisorAvatars.length > 0 ? supervisorAvatars : void 0
     };
   };
   const handleLineClick = (line, kpis) => {
@@ -54905,6 +55546,16 @@ var KPIsOverviewView = ({
       navigation.navigate("/");
     }
   }, [onBackClick, backLinkUrl, navigation]);
+  const handleTabChange = React25.useCallback((newTab) => {
+    if (newTab === activeTab) return;
+    trackCoreEvent("Leaderboard Tab Switched", {
+      from_tab: activeTab,
+      to_tab: newTab,
+      from_page: "kpis_overview",
+      lines_count: lines.length
+    });
+    setActiveTab(newTab);
+  }, [activeTab, lines.length]);
   const formatLocalDate2 = (date) => {
     const options = {
       year: "numeric",
@@ -54913,7 +55564,20 @@ var KPIsOverviewView = ({
     };
     return date.toLocaleDateString("en-US", options);
   };
+  const getMonthRange = () => {
+    const now4 = /* @__PURE__ */ new Date();
+    const startOfMonth2 = new Date(now4.getFullYear(), now4.getMonth(), 1);
+    const endOfMonth2 = new Date(now4.getFullYear(), now4.getMonth() + 1, 0);
+    const startLabel = startOfMonth2.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+    const endLabel = endOfMonth2.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+    return `${startLabel} - ${endLabel}, ${now4.getFullYear()}`;
+  };
+  const isMonthlyMode = activeTab === "leaderboard" && timeRange === "monthly";
   const currentShiftDetails = getCurrentShift(configuredTimezone, shiftConfig);
+  const shiftEndDate = React25__namespace.default.useMemo(
+    () => getShiftEndDate(currentShiftDetails, configuredTimezone),
+    [currentShiftDetails, configuredTimezone]
+  );
   const shiftName = (currentShiftDetails.shiftName || "Day").replace(/ Shift$/i, "");
   const showTopPerformerImage = Boolean(topPerformer.imageUrl) && !topPerformerImageError;
   typeof topPerformer.efficiency === "number" && Number.isFinite(topPerformer.efficiency);
@@ -55021,29 +55685,61 @@ var KPIsOverviewView = ({
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-lg font-semibold text-gray-900", children: "Overview" }),
+            /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-lg font-semibold text-gray-900", children: activeTab === "leaderboard" ? "Leaderboard" : "Overview" }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-emerald-500 animate-pulse ring-2 ring-emerald-500/20" })
           ] }) }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-12" })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center justify-center gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline-flex items-center px-2.5 py-1 bg-gray-100 rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-gray-700", children: formatLocalDate2(/* @__PURE__ */ new Date()) }) }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center gap-1 px-2.5 py-1 bg-gray-100 rounded-full", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-gray-700 scale-90", children: getShiftIcon(currentShiftDetails.shiftId) }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-gray-700", children: shiftName })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline-flex items-center px-2.5 py-1 bg-green-100 rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-green-700", children: /* @__PURE__ */ jsxRuntime.jsx(ISTTimer_default, {}) }) })
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: `inline-flex items-center bg-gray-100 rounded-full ${isMonthlyMode ? "px-4 py-1.5 ring-1 ring-gray-200 shadow-sm" : "px-2.5 py-1"}`, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `font-medium text-gray-700 ${isMonthlyMode ? "text-sm" : "text-xs"}`, children: isMonthlyMode ? getMonthRange() : formatLocalDate2(/* @__PURE__ */ new Date()) }) }),
+          !isMonthlyMode && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center gap-1 px-2.5 py-1 bg-gray-100 rounded-full", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-gray-700 scale-90", children: getShiftIcon(currentShiftDetails.shiftId) }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-gray-700", children: shiftName })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline-flex items-center px-2.5 py-1 bg-green-100 rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-green-700", children: /* @__PURE__ */ jsxRuntime.jsx(ISTTimer_default, {}) }) })
+          ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 bg-white shadow-md hover:shadow-lg transition-all duration-300 ease-out hover:scale-[1.01] relative rounded-2xl border border-amber-100 pl-2 pr-4 py-1.5 flex items-center justify-between group", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 min-w-0", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex-shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-full border-2 border-amber-100 overflow-hidden bg-amber-50 shadow-sm transition-transform group-hover:scale-105", children: showTopPerformerImage ? /* @__PURE__ */ jsxRuntime.jsx(
-            "img",
-            {
-              src: topPerformer.imageUrl || "",
-              alt: "Top Performer",
-              className: "w-full h-full object-cover",
-              onError: () => setTopPerformerImageError(true)
-            }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center bg-amber-50 text-sm font-bold text-amber-600", children: topPerformer.initials }) }) }),
+        activeTab !== "leaderboard" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 bg-white shadow-md hover:shadow-lg transition-all duration-300 ease-out hover:scale-[1.01] relative rounded-2xl border border-amber-100 pl-2 pr-4 py-1.5 flex items-center justify-between group", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 min-w-0", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-shrink-0", children: [
+            (!topPerformer.supervisors || topPerformer.supervisors.length <= 1) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-full border-2 border-amber-100 overflow-hidden bg-amber-50 shadow-sm transition-transform group-hover:scale-105", children: showTopPerformerImage ? /* @__PURE__ */ jsxRuntime.jsx(
+              "img",
+              {
+                src: topPerformer.imageUrl || "",
+                alt: "Top Performer",
+                className: "w-full h-full object-cover",
+                onError: () => setTopPerformerImageError(true)
+              }
+            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center bg-amber-50 text-sm font-bold text-amber-600", children: topPerformer.initials }) }),
+            topPerformer.supervisors && topPerformer.supervisors.length > 1 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex -space-x-2", children: [
+              topPerformer.supervisors.slice(0, 3).map((supervisor, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
+                {
+                  className: "relative inline-block w-9 h-9 rounded-full ring-2 ring-white bg-amber-50 shadow-sm z-0 hover:z-10 transition-all hover:scale-110 group/avatar",
+                  style: { zIndex: 3 - idx },
+                  children: [
+                    supervisor.imageUrl ? /* @__PURE__ */ jsxRuntime.jsx(
+                      "img",
+                      {
+                        src: supervisor.imageUrl,
+                        alt: supervisor.name,
+                        className: "w-full h-full object-cover rounded-full"
+                      }
+                    ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center text-xs font-bold text-amber-600 uppercase rounded-full", children: supervisor.initials }),
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-gray-900 text-white text-[10px] font-medium rounded shadow-lg opacity-0 group-hover/avatar:opacity-100 transition-opacity whitespace-nowrap pointer-events-none z-20", children: [
+                      supervisor.name,
+                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-full left-1/2 -translate-x-1/2 -mt-[1px] border-4 border-transparent border-t-gray-900" })
+                    ] })
+                  ]
+                },
+                supervisor.userId
+              )),
+              topPerformer.supervisors.length > 3 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex w-9 h-9 rounded-full ring-2 ring-white bg-amber-100 items-center justify-center text-xs font-medium text-amber-700 z-0", children: [
+                "+",
+                topPerformer.supervisors.length - 3
+              ] })
+            ] })
+          ] }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 leading-none mb-1", children: [
               /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-amber-600 uppercase tracking-widest", children: "Performer of the week" }),
@@ -55069,6 +55765,24 @@ var KPIsOverviewView = ({
               ) })
             ] })
           ] })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex bg-gray-100/80 p-1 rounded-xl w-full", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => handleTabChange("today"),
+              className: `flex-1 py-2 text-xs font-medium rounded-lg transition-all duration-200 ${activeTab === "today" ? "bg-white text-blue-600 shadow-sm ring-1 ring-black/5" : "text-gray-600 hover:text-gray-900"}`,
+              children: "Overview"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => handleTabChange("leaderboard"),
+              className: `flex-1 py-2 text-xs font-medium rounded-lg transition-all duration-200 ${activeTab === "leaderboard" ? "bg-white text-blue-600 shadow-sm ring-1 ring-black/5" : "text-gray-600 hover:text-gray-900"}`,
+              children: "Leaderboard"
+            }
+          )
         ] }) })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden sm:block", children: [
@@ -55083,19 +55797,49 @@ var KPIsOverviewView = ({
             }
           ) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl md:text-3xl lg:text-4xl font-semibold text-gray-900 tracking-tight", children: "Overview" }),
+            /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl md:text-3xl lg:text-4xl font-semibold text-gray-900 tracking-tight", children: activeTab === "leaderboard" ? "Leaderboard" : "Overview" }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2.5 w-2.5 rounded-full bg-emerald-500 animate-pulse ring-4 ring-emerald-500/10 flex-shrink-0" })
           ] }),
-          !topPerformerLoading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute right-0 top-1/2 -translate-y-1/2 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-2xl border border-amber-200 shadow-md pl-1.5 pr-4 py-1.5 flex items-center gap-4 transition-all hover:shadow-lg hover:border-amber-300 group", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-full ring-2 ring-amber-100 overflow-hidden bg-amber-50 shadow-inner flex-shrink-0 transition-transform group-hover:scale-105", children: showTopPerformerImage ? /* @__PURE__ */ jsxRuntime.jsx(
-              "img",
-              {
-                src: topPerformer.imageUrl || "",
-                alt: topPerformer.name,
-                className: "w-full h-full object-cover",
-                onError: () => setTopPerformerImageError(true)
-              }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center text-sm font-bold text-amber-600 uppercase", children: topPerformer.initials }) }) }),
+          !topPerformerLoading && activeTab !== "leaderboard" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute right-0 top-1/2 -translate-y-1/2 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-2xl border border-amber-200 shadow-md pl-1.5 pr-4 py-1.5 flex items-center gap-4 transition-all hover:shadow-lg hover:border-amber-300 group", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+              (!topPerformer.supervisors || topPerformer.supervisors.length <= 1) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-full ring-2 ring-amber-100 overflow-hidden bg-amber-50 shadow-inner flex-shrink-0 transition-transform group-hover:scale-105", children: showTopPerformerImage ? /* @__PURE__ */ jsxRuntime.jsx(
+                "img",
+                {
+                  src: topPerformer.imageUrl || "",
+                  alt: topPerformer.name,
+                  className: "w-full h-full object-cover",
+                  onError: () => setTopPerformerImageError(true)
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center text-sm font-bold text-amber-600 uppercase", children: topPerformer.initials }) }),
+              topPerformer.supervisors && topPerformer.supervisors.length > 1 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex -space-x-2", children: [
+                topPerformer.supervisors.slice(0, 3).map((supervisor, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
+                  "div",
+                  {
+                    className: "relative inline-block w-10 h-10 rounded-full ring-2 ring-white bg-amber-50 shadow-sm z-0 hover:z-10 transition-all hover:scale-110 group/avatar",
+                    style: { zIndex: 3 - idx },
+                    children: [
+                      supervisor.imageUrl ? /* @__PURE__ */ jsxRuntime.jsx(
+                        "img",
+                        {
+                          src: supervisor.imageUrl,
+                          alt: supervisor.name,
+                          className: "w-full h-full object-cover rounded-full"
+                        }
+                      ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center text-sm font-bold text-amber-600 uppercase rounded-full", children: supervisor.initials }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-gray-900 text-white text-[10px] font-medium rounded shadow-lg opacity-0 group-hover/avatar:opacity-100 transition-opacity whitespace-nowrap pointer-events-none z-20", children: [
+                        supervisor.name,
+                        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-full left-1/2 -translate-x-1/2 -mt-[1px] border-4 border-transparent border-t-gray-900" })
+                      ] })
+                    ]
+                  },
+                  supervisor.userId
+                )),
+                topPerformer.supervisors.length > 3 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex w-10 h-10 rounded-full ring-2 ring-white bg-amber-100 items-center justify-center text-sm font-medium text-amber-700 z-0", children: [
+                  "+",
+                  topPerformer.supervisors.length - 3
+                ] })
+              ] })
+            ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col min-w-0", children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-[10px] leading-tight mb-1", children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold text-amber-600 uppercase tracking-widest", children: "Performer of the week" }),
@@ -55124,40 +55868,84 @@ var KPIsOverviewView = ({
           ] }) })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-blue-50/50 px-4 py-2 rounded-xl border border-blue-100/50 backdrop-blur-sm", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-6", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-blue-700", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-4 h-4 opacity-70", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base font-semibold tabular-nums", children: /* @__PURE__ */ jsxRuntime.jsx(ISTTimer_default, {}) })
+          !isMonthlyMode && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-blue-700", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-4 h-4 opacity-70", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base font-semibold tabular-nums", children: /* @__PURE__ */ jsxRuntime.jsx(ISTTimer_default, {}) })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-4 bg-blue-200" })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-4 bg-blue-200" }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-blue-600", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-4 h-4 opacity-70", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: formatLocalDate2(/* @__PURE__ */ new Date()) })
+            /* @__PURE__ */ jsxRuntime.jsx("svg", { className: `w-4 h-4 opacity-70 ${isMonthlyMode ? "scale-110" : ""}`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${isMonthlyMode ? "text-base font-medium" : "text-sm font-medium"}`, children: isMonthlyMode ? getMonthRange() : formatLocalDate2(/* @__PURE__ */ new Date()) })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-4 bg-blue-200" }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-blue-600", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "opacity-70", children: getShiftIcon(currentShiftDetails.shiftId) }),
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-semibold uppercase tracking-wider", children: [
-              shiftName,
-              " Shift"
+          !isMonthlyMode && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-4 bg-blue-200" }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-blue-600", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "opacity-70", children: getShiftIcon(currentShiftDetails.shiftId) }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-semibold uppercase tracking-wider", children: [
+                shiftName,
+                " Shift"
+              ] })
             ] })
           ] })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex justify-start", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-1.5 lg:gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => handleTabChange("today"),
+              className: `px-3 lg:px-4 py-1.5 lg:py-2 text-sm lg:text-base font-medium rounded-lg transition-colors whitespace-nowrap ${activeTab === "today" ? "bg-blue-50 text-blue-600" : "text-gray-600 hover:bg-gray-50"}`,
+              children: "Overview"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => handleTabChange("leaderboard"),
+              className: `px-3 lg:px-4 py-1.5 lg:py-2 text-sm lg:text-base font-medium rounded-lg transition-colors whitespace-nowrap ${activeTab === "leaderboard" ? "bg-blue-50 text-blue-600" : "text-gray-600 hover:bg-gray-50"}`,
+              children: "Leaderboard"
+            }
+          )
         ] }) })
       ] })
     ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex-1 p-3 sm:p-4 md:p-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3 sm:gap-4 md:gap-6", children: lines.map((line) => /* @__PURE__ */ jsxRuntime.jsx(
-      LineCard,
-      {
-        line,
-        kpis: metricsError ? null : kpisByLineId.get(line.id) ?? (metricsLoading ? null : defaultKPIs),
-        isLoading: metricsLoading,
-        error: metricsError,
-        onClick: (kpis) => handleLineClick(line, kpis),
-        supervisorEnabled,
-        supervisorName: supervisorNamesByLineId.get(line.id) || null,
-        supervisors: supervisorsByLineId?.get(line.id)
-      },
-      line.id
-    )) }) })
+    /* @__PURE__ */ jsxRuntime.jsx("main", { className: `flex-1 p-3 sm:p-4 md:p-6 bg-slate-50 ${activeTab === "leaderboard" ? "overflow-hidden flex flex-col" : "overflow-y-auto"}`, children: activeTab === "today" ? (
+      /* Line Cards Grid */
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3 sm:gap-4 md:gap-6", children: lines.map((line) => /* @__PURE__ */ jsxRuntime.jsx(
+        LineCard,
+        {
+          line,
+          kpis: metricsError ? null : kpisByLineId.get(line.id) ?? (metricsLoading ? null : defaultKPIs),
+          isLoading: metricsLoading,
+          error: metricsError,
+          onClick: (kpis) => handleLineClick(line, kpis),
+          supervisorEnabled,
+          supervisorName: supervisorNamesByLineId.get(line.id) || null,
+          supervisors: supervisorsByLineId?.get(line.id)
+        },
+        line.id
+      )) })
+    ) : (
+      /* Leaderboard View */
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+        LinesLeaderboard,
+        {
+          lines,
+          onLineClick: (line) => handleLineClick(line),
+          timeRange,
+          setTimeRange,
+          todayEfficiencyByLineId,
+          monthlyEfficiencyByLineId,
+          supervisorsByLineId,
+          supervisorNamesByLineId,
+          isLoadingToday: metricsLoading,
+          isLoadingMonthly: monthlyLoading,
+          shiftEndDate,
+          monthEndDate
+        }
+      ) })
+    ) })
   ] });
 };
 var KPIsOverviewView_default = KPIsOverviewView;
@@ -55303,6 +56091,12 @@ var LeaderboardDetailView = React25.memo(({
   const [activeTab, setActiveTab] = React25.useState("today");
   const timezone = useAppTimezone();
   const staticShiftConfig = useShiftConfig();
+  const representativeLineId = lineId || lines[0]?.id;
+  const {
+    shiftConfig: dynamicShiftConfig,
+    isLoading: isDynamicShiftConfigLoading
+  } = useDynamicShiftConfig(representativeLineId);
+  const activeShiftConfig = dynamicShiftConfig ?? staticShiftConfig;
   const shiftId = React25.useMemo(
     () => typeof shift === "number" ? shift : typeof shift === "string" ? parseInt(shift) : void 0,
     [shift]
@@ -55336,7 +56130,7 @@ var LeaderboardDetailView = React25.memo(({
       return shiftId.toString();
     }
     try {
-      const current = getCurrentShift(timezone || "Asia/Kolkata", staticShiftConfig);
+      const current = getCurrentShift(timezone || "Asia/Kolkata", activeShiftConfig);
       return current.shiftId.toString();
     } catch (e) {
       return "0";
@@ -55348,13 +56142,13 @@ var LeaderboardDetailView = React25.memo(({
     }
   }, [shiftId]);
   React25.useEffect(() => {
-    if (shiftId !== void 0 || !staticShiftConfig) return;
+    if (shiftId !== void 0 || isDynamicShiftConfigLoading || !activeShiftConfig) return;
     try {
-      const current = getCurrentShift(timezone || "Asia/Kolkata", staticShiftConfig);
+      const current = getCurrentShift(timezone || "Asia/Kolkata", activeShiftConfig);
       setSelectedShiftFilter((prev) => prev === "0" ? current.shiftId.toString() : prev);
     } catch (e) {
     }
-  }, [shiftId, staticShiftConfig, timezone]);
+  }, [shiftId, activeShiftConfig, isDynamicShiftConfigLoading, timezone]);
   const [todayEntries, setTodayEntries] = React25.useState([]);
   const [monthlyEntries, setMonthlyEntries] = React25.useState([]);
   const [todayLoading, setTodayLoading] = React25.useState(false);
@@ -55451,8 +56245,8 @@ var LeaderboardDetailView = React25.memo(({
     return Array.from(uniqueLines.entries()).map(([id3, name]) => ({ id: id3, label: name }));
   }, [configuredLineIds, lines, getLineName]);
   const shiftOptions = React25.useMemo(() => {
-    if (staticShiftConfig?.shifts && staticShiftConfig.shifts.length > 0) {
-      return staticShiftConfig.shifts.map((shift2) => ({
+    if (activeShiftConfig?.shifts && activeShiftConfig.shifts.length > 0) {
+      return activeShiftConfig.shifts.map((shift2) => ({
         id: shift2.shiftId.toString(),
         label: shift2.shiftName
       }));
@@ -55461,14 +56255,14 @@ var LeaderboardDetailView = React25.memo(({
       { id: "0", label: "Day Shift" },
       { id: "1", label: "Night Shift" }
     ];
-  }, [staticShiftConfig]);
+  }, [activeShiftConfig]);
   const currentShiftInfo = React25.useMemo(() => {
     try {
-      return getCurrentShift(timezone || "Asia/Kolkata", staticShiftConfig);
+      return getCurrentShift(timezone || "Asia/Kolkata", activeShiftConfig);
     } catch (e) {
       return { shiftId: 0, date: (/* @__PURE__ */ new Date()).toISOString().split("T")[0], shiftName: "Day" };
     }
-  }, [timezone, staticShiftConfig]);
+  }, [timezone, activeShiftConfig]);
   const selectedShiftId = React25.useMemo(() => {
     const parsed = Number(selectedShiftFilter);
     return Number.isFinite(parsed) ? parsed : void 0;
@@ -55709,7 +56503,7 @@ var LeaderboardDetailView = React25.memo(({
   ]);
   const getShiftName = React25.useCallback((shiftId2) => {
     if (shiftId2 !== void 0) {
-      return getShiftNameById(shiftId2, timezone || "Asia/Kolkata", staticShiftConfig);
+      return getShiftNameById(shiftId2, timezone || "Asia/Kolkata", activeShiftConfig);
     }
     if (shiftGroups.length > 1) {
       const shiftNames = shiftGroups.map((g) => g.shiftName).join(" & ");
@@ -55717,14 +56511,14 @@ var LeaderboardDetailView = React25.memo(({
     } else if (shiftGroups.length === 1) {
       return shiftGroups[0].shiftName;
     }
-    const currentShift = getCurrentShift(timezone || "Asia/Kolkata", staticShiftConfig);
-    return currentShift.shiftName || getShiftNameById(currentShift.shiftId, timezone || "Asia/Kolkata", staticShiftConfig);
-  }, [timezone, staticShiftConfig, shiftGroups]);
+    const currentShift = getCurrentShift(timezone || "Asia/Kolkata", activeShiftConfig);
+    return currentShift.shiftName || getShiftNameById(currentShift.shiftId, timezone || "Asia/Kolkata", activeShiftConfig);
+  }, [timezone, activeShiftConfig, shiftGroups]);
   const getShiftIcon = React25.useCallback((shiftId2) => {
     if (shiftId2 === void 0 && shiftGroups.length > 1) {
       return /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) });
     }
-    const effectiveShiftId = shiftId2 !== void 0 ? shiftId2 : shiftGroups.length === 1 ? shiftGroups[0].shiftId : getCurrentShift(timezone || "Asia/Kolkata", staticShiftConfig).shiftId;
+    const effectiveShiftId = shiftId2 !== void 0 ? shiftId2 : shiftGroups.length === 1 ? shiftGroups[0].shiftId : getCurrentShift(timezone || "Asia/Kolkata", activeShiftConfig).shiftId;
     const shiftNameLower = getShiftName(effectiveShiftId).toLowerCase();
     if (shiftNameLower.includes("day") || shiftNameLower.includes("morning")) {
       return /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" }) });
@@ -55736,7 +56530,7 @@ var LeaderboardDetailView = React25.memo(({
       return /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z" }) });
     }
     return /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) });
-  }, [getShiftName, shiftGroups, timezone, staticShiftConfig]);
+  }, [getShiftName, shiftGroups, timezone, activeShiftConfig]);
   const formatDate2 = React25.useCallback((date2) => {
     return new Intl.DateTimeFormat("en-US", {
       weekday: "long",
@@ -55970,7 +56764,7 @@ var LeaderboardDetailView = React25.memo(({
               {
                 onClick: () => setActiveTab("today"),
                 className: `flex-1 px-2 py-1.5 text-xs font-medium rounded-md transition-all duration-200 ${activeTab === "today" ? "bg-white text-gray-900 shadow-sm" : "text-gray-600"}`,
-                children: "Today"
+                children: "Daily"
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -55978,7 +56772,7 @@ var LeaderboardDetailView = React25.memo(({
               {
                 onClick: () => setActiveTab("monthly"),
                 className: `flex-1 px-2 py-1.5 text-xs font-medium rounded-md transition-all duration-200 ${activeTab === "monthly" ? "bg-white text-gray-900 shadow-sm" : "text-gray-600"}`,
-                children: "Monthly History"
+                children: "Monthly"
               }
             )
           ] }),
@@ -56017,7 +56811,7 @@ var LeaderboardDetailView = React25.memo(({
               {
                 onClick: () => setActiveTab("today"),
                 className: `px-2 lg:px-3 py-1 lg:py-1.5 text-sm lg:text-base font-medium rounded-lg transition-colors whitespace-nowrap ${activeTab === "today" ? "bg-blue-50 text-blue-600" : "text-gray-600 hover:bg-gray-50"}`,
-                children: "Today"
+                children: "Daily"
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -56025,7 +56819,7 @@ var LeaderboardDetailView = React25.memo(({
               {
                 onClick: () => setActiveTab("monthly"),
                 className: `px-2 lg:px-3 py-1 lg:py-1.5 text-sm lg:text-base font-medium rounded-lg transition-colors whitespace-nowrap ${activeTab === "monthly" ? "bg-blue-50 text-blue-600" : "text-gray-600 hover:bg-gray-50"}`,
-                children: "Monthly History"
+                children: "Monthly"
               }
             )
           ] }),
@@ -59098,6 +59892,7 @@ var getInitialTab = (sourceType, defaultTab, fromMonthly, urlDate) => {
   }
   return "overview";
 };
+var DEBUG_DASHBOARD2 = process.env.NEXT_PUBLIC_DEBUG_DASHBOARD === "true";
 var chartCardVariants = {
   initial: { opacity: 0, y: 10 },
   animate: {
@@ -59534,6 +60329,34 @@ var WorkspaceDetailView = ({
   const idleTimeReasonsEnabled = Boolean(
     workspaceId && idleTimeReasonsDate && idleTimeReasonsShiftId !== void 0
   );
+  React25.useEffect(() => {
+    if (!DEBUG_DASHBOARD2) return;
+    console.log("[WorkspaceDetailView] IdleTimeReasons gate", {
+      workspaceId,
+      idleTimeReasonsDate,
+      idleTimeReasonsShiftId,
+      idleTimeReasonsEnabled,
+      isShiftConfigLoading,
+      calculatedOperationalDate,
+      calculatedShiftId,
+      workspaceDate: workspace?.date,
+      workspaceShiftId: workspace?.shift_id,
+      parsedShiftId,
+      hasWorkspaceSnapshot
+    });
+  }, [
+    workspaceId,
+    idleTimeReasonsDate,
+    idleTimeReasonsShiftId,
+    idleTimeReasonsEnabled,
+    isShiftConfigLoading,
+    calculatedOperationalDate,
+    calculatedShiftId,
+    workspace?.date,
+    workspace?.shift_id,
+    parsedShiftId,
+    hasWorkspaceSnapshot
+  ]);
   const {
     chartData: idleTimeChartData,
     isLoading: idleTimeLoading,
@@ -66883,6 +67706,7 @@ exports.isValidWorkspaceDetailedMetricsPayload = isValidWorkspaceDetailedMetrics
 exports.isValidWorkspaceMetricsPayload = isValidWorkspaceMetricsPayload;
 exports.isWorkspaceDisplayNamesLoaded = isWorkspaceDisplayNamesLoaded;
 exports.isWorkspaceDisplayNamesLoading = isWorkspaceDisplayNamesLoading;
+exports.lineLeaderboardService = lineLeaderboardService;
 exports.linesService = linesService;
 exports.mergeWithDefaultConfig = mergeWithDefaultConfig;
 exports.migrateLegacyConfiguration = migrateLegacyConfiguration;