@optifye/dashboard-core 6.11.36 → 6.11.38

package/dist/index.js

@@ -58812,6 +58812,50 @@ var UserUsageStats = ({
     ] })
   ] });
 };
+
+// src/lib/utils/teamUsage.ts
+var ISO_DATE_KEY_REGEX = /^\d{4}-\d{2}-\d{2}$/;
+function formatLocalDateKey(date) {
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${year}-${month}-${day}`;
+}
+function parseUsageDate(dateLike) {
+  if (ISO_DATE_KEY_REGEX.test(dateLike)) {
+    const [year, month, day] = dateLike.split("-").map(Number);
+    return new Date(year, month - 1, day);
+  }
+  return new Date(dateLike);
+}
+function normalizeUsageDateKey(dateLike) {
+  if (!dateLike) return void 0;
+  if (ISO_DATE_KEY_REGEX.test(dateLike)) return dateLike;
+  const parsed = parseUsageDate(dateLike);
+  if (Number.isNaN(parsed.getTime())) {
+    return dateLike.split("T")[0] || dateLike;
+  }
+  return formatLocalDateKey(parsed);
+}
+function getCurrentWeekToDateUsageRange(today = /* @__PURE__ */ new Date()) {
+  const normalizedToday = new Date(today);
+  normalizedToday.setHours(0, 0, 0, 0);
+  const dayOfWeek = normalizedToday.getDay();
+  const daysSinceMonday = dayOfWeek === 0 ? 6 : dayOfWeek - 1;
+  const monday = new Date(normalizedToday);
+  monday.setDate(normalizedToday.getDate() - daysSinceMonday);
+  return {
+    startDate: formatLocalDateKey(monday),
+    endDate: formatLocalDateKey(normalizedToday),
+    daysElapsed: daysSinceMonday + 1
+  };
+}
+function calculateAverageDailyDuration(durationMs, dayCount) {
+  if (!Number.isFinite(durationMs) || dayCount <= 0) {
+    return 0;
+  }
+  return Math.round(durationMs / dayCount);
+}
 var UserUsageDetailModal = ({
   userId,
   userName,
@@ -58821,7 +58865,7 @@ var UserUsageDetailModal = ({
   endDate
 }) => {
   const [currentWeekStart, setCurrentWeekStart] = React143.useState(() => {
-    if (startDate) return new Date(startDate);
+    if (startDate) return parseUsageDate(startDate);
     const { start } = getCurrentWeekRange();
     return start;
   });
@@ -58831,8 +58875,8 @@ var UserUsageDetailModal = ({
     return end;
   }, [currentWeekStart]);
   const { data, isLoading, error } = useUserUsage(userId, {
-    startDate: currentWeekStart.toISOString().slice(0, 10),
-    endDate: currentWeekEnd.toISOString().slice(0, 10)
+    startDate: formatLocalDateKey(currentWeekStart),
+    endDate: formatLocalDateKey(currentWeekEnd)
   });
   const handlePrevWeek = () => {
     setCurrentWeekStart((prev) => {
@@ -58925,8 +58969,8 @@ function UsageContent({
   } else {
     daysToCount = 7;
   }
-  const weekTotalMs = weekData.reduce((sum, d) => sum + d.total_duration_ms, 0);
-  const weekAvgMs = daysToCount > 0 ? weekTotalMs / daysToCount : 0;
+  const weekActiveMs = weekData.reduce((sum, d) => sum + d.active_duration_ms, 0);
+  const weekAvgMs = calculateAverageDailyDuration(weekActiveMs, daysToCount);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 bg-gray-50 rounded-lg p-1 border border-gray-100", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -58938,7 +58982,7 @@ function UsageContent({
           children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "w-4 h-4" })
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-gray-700 min-w-[140px] text-center", children: formatDateRange(currentWeekStart.toISOString().slice(0, 10), currentWeekEnd.toISOString().slice(0, 10)) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-gray-700 min-w-[140px] text-center", children: formatDateRange(formatLocalDateKey(currentWeekStart), formatLocalDateKey(currentWeekEnd)) }),
       /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
@@ -58970,7 +59014,7 @@ function DailyBarChart({
   const weekData = React143.useMemo(() => buildWeekData(dailyData, getDateStringsInRange(weekStart, weekEnd)), [dailyData, weekStart, weekEnd]);
   const chartData = React143.useMemo(() => {
     return weekData.map((day, index) => {
-      const date = new Date(day.date);
+      const date = parseUsageDate(day.date);
       return {
         ...day,
         index,
@@ -58980,7 +59024,7 @@ function DailyBarChart({
         // green-500
         passiveColor: "#fbbf24",
         // amber-400
-        isToday: day.date === (/* @__PURE__ */ new Date()).toISOString().slice(0, 10)
+        isToday: day.date === formatLocalDateKey(/* @__PURE__ */ new Date())
       };
     });
   }, [weekData]);
@@ -59000,7 +59044,7 @@ function DailyBarChart({
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full bg-gray-300" }),
         /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-medium text-gray-600", children: [
-          "Average Daily usage: ",
+          "Average Daily active usage: ",
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-900 font-semibold", children: avgDailyMs > 0 ? formatDuration2(avgDailyMs) : "0m" })
         ] })
       ] }),
@@ -59165,17 +59209,14 @@ function getCurrentWeekRange() {
 function getDateStringsInRange(start, end) {
   const result = [];
   for (let d = new Date(start); d <= end; d.setDate(d.getDate() + 1)) {
-    const year = d.getFullYear();
-    const month = String(d.getMonth() + 1).padStart(2, "0");
-    const day = String(d.getDate()).padStart(2, "0");
-    result.push(`${year}-${month}-${day}`);
+    result.push(formatLocalDateKey(d));
   }
   return result;
 }
 function buildWeekData(dailyData, weekDates) {
   const dataMap = new Map(
     (dailyData || []).map((d) => {
-      const key = normalizeDateKey(d.date);
+      const key = normalizeUsageDateKey(d.date);
       return [key, { ...d, date: key }];
     })
   );
@@ -59190,22 +59231,10 @@ function buildWeekData(dailyData, weekDates) {
     };
   });
 }
-function normalizeDateKey(dateLike) {
-  if (!dateLike) return void 0;
-  try {
-    const date = new Date(dateLike);
-    const year = date.getFullYear();
-    const month = String(date.getMonth() + 1).padStart(2, "0");
-    const day = String(date.getDate()).padStart(2, "0");
-    return `${year}-${month}-${day}`;
-  } catch {
-    return dateLike.split("T")[0] || dateLike;
-  }
-}
 function formatDateRange(startDate, endDate) {
   try {
-    const start = new Date(startDate);
-    const end = new Date(endDate);
+    const start = parseUsageDate(startDate);
+    const end = parseUsageDate(endDate);
     const opts = { month: "short", day: "numeric" };
     const yearOpts = { year: "numeric" };
     return `${start.toLocaleDateString("en-US", opts)} - ${end.toLocaleDateString("en-US", opts)}, ${end.toLocaleDateString("en-US", yearOpts)}`;
@@ -59216,7 +59245,7 @@ function formatDateRange(startDate, endDate) {
 function formatDate(dateStr) {
   if (!dateStr) return "";
   try {
-    const date = new Date(dateStr);
+    const date = parseUsageDate(dateStr);
     return date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
   } catch {
     return dateStr;
@@ -59494,7 +59523,7 @@ var UserManagementTable = ({
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Assignments" }),
-          showUsageStats && /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Average Daily usage" }),
+          showUsageStats && /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Average Daily Active Usage" }),
           /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Actions" })
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "bg-white divide-y divide-gray-200", children: filteredAndSortedUsers.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: showUsageStats ? 5 : 4, className: "px-6 py-12", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center text-gray-400 gap-2", children: [
@@ -73791,39 +73820,8 @@ var TeamManagementView = ({
   const [users, setUsers] = React143.useState([]);
   const [availableLines, setAvailableLines] = React143.useState([]);
   const [availableFactories, setAvailableFactories] = React143.useState([]);
-  const [stats, setStats] = React143.useState({
-    totalUsers: 0,
-    owners: 0,
-    it: 0,
-    plantHeads: 0,
-    industrialEngineers: 0,
-    supervisors: 0,
-    optifye: 0
-  });
+  const [usageSummaryByUser, setUsageSummaryByUser] = React143.useState({});
   const [isAddUserDialogOpen, setIsAddUserDialogOpen] = React143.useState(false);
-  const normalizeIds = React143.useCallback((value) => {
-    if (Array.isArray(value)) {
-      return value.filter((id3) => typeof id3 === "string" && id3.length > 0);
-    }
-    if (typeof value === "string" && value.length > 0) {
-      return [value];
-    }
-    return [];
-  }, []);
-  const factoryScopedRoleFactoryIds = React143.useMemo(() => {
-    if (!isFactoryScopedRole(user?.role_level)) return [];
-    const scopedFactoryIds = normalizeIds(user?.access_scope?.factory_ids);
-    if (scopedFactoryIds.length > 0) {
-      return Array.from(new Set(scopedFactoryIds));
-    }
-    const propertyFactoryIds = normalizeIds(
-      user?.properties?.factory_ids ?? user?.properties?.factory_id
-    );
-    if (propertyFactoryIds.length > 0) {
-      return Array.from(new Set(propertyFactoryIds));
-    }
-    return entityConfig?.factoryId ? [entityConfig.factoryId] : [];
-  }, [user, entityConfig?.factoryId, normalizeIds]);
   const notifyScopeRefresh = React143.useCallback(() => {
     if (typeof window !== "undefined") {
       window.dispatchEvent(new Event("rbac:refresh-scope"));
@@ -73832,37 +73830,17 @@ var TeamManagementView = ({
   const canAddUsers = canRoleManageUsers(user?.role_level);
   const canViewUsageStats = canRoleViewUsageStats(user?.role_level);
   const pageCompanyId = entityConfig?.companyId || user?.properties?.company_id;
-  const companyIdForUsage = pageCompanyId;
-  const usageDateRange = React143.useMemo(() => {
-    const today = /* @__PURE__ */ new Date();
-    const dayOfWeek = today.getDay();
-    const daysSinceMonday = dayOfWeek === 0 ? 6 : dayOfWeek - 1;
-    const monday = new Date(today);
-    monday.setDate(today.getDate() - daysSinceMonday);
-    return {
-      startDate: monday.toISOString().slice(0, 10),
-      endDate: today.toISOString().slice(0, 10),
-      daysElapsed: daysSinceMonday + 1
-      // Include today
-    };
-  }, []);
-  const {
-    data: usageData,
-    isLoading: isUsageLoading
-  } = useCompanyUsersUsage(canViewUsageStats ? companyIdForUsage : void 0, {
-    startDate: usageDateRange.startDate,
-    endDate: usageDateRange.endDate
-  });
+  const usageDateRange = React143.useMemo(() => getCurrentWeekToDateUsageRange(), []);
   const avgDailyUsageMap = React143.useMemo(() => {
-    if (!usageData?.users) {
+    if (!canViewUsageStats) {
       return {};
     }
     const daysElapsed = usageDateRange.daysElapsed;
-    return usageData.users.reduce((acc, user2) => {
-      acc[user2.user_id] = Math.round(user2.total_duration_ms / daysElapsed);
+    return Object.entries(usageSummaryByUser).reduce((acc, [userId, usage]) => {
+      acc[userId] = calculateAverageDailyDuration(usage.active_duration_ms, daysElapsed);
       return acc;
     }, {});
-  }, [usageData, usageDateRange.daysElapsed]);
+  }, [canViewUsageStats, usageSummaryByUser, usageDateRange.daysElapsed]);
   const pageTitle = "Team Management";
   const pageDescription = canViewUsageStats ? "Manage team members and view their daily usage" : "Manage supervisors in your factory";
   const hasAccess = user ? user.role_level === void 0 || canRoleAccessTeamManagement(user.role_level) : false;
@@ -73886,7 +73864,6 @@ var TeamManagementView = ({
     setIsLoading(true);
     setError(void 0);
     try {
-      const userManagementService = createUserManagementService(supabase);
       const { data: { session } } = await supabase.auth.getSession();
       if (!session?.access_token) {
         throw new Error("No authentication token available");
@@ -73896,116 +73873,31 @@ var TeamManagementView = ({
       if (!backendUrl) {
         throw new Error("Backend URL is not configured. Please set NEXT_PUBLIC_BACKEND_URL in your environment.");
       }
-      if ((user?.role_level === "optifye" || user?.role_level === "owner" || user?.role_level === "it") && companyId) {
-        const { data: factories } = await supabase.from("factories").select("id, factory_name, company_id").eq("company_id", companyId).order("factory_name");
-        const linesResponse = await fetch(`${backendUrl}/api/lines?company_id=${companyId}`, {
+      const params = new URLSearchParams({
+        start_date: usageDateRange.startDate,
+        end_date: usageDateRange.endDate
+      });
+      const bootstrapResponse = await fetch(
+        `${backendUrl}/api/users/company/${companyId}/bootstrap?${params.toString()}`,
+        {
           headers: {
             "Authorization": `Bearer ${token}`,
             "Content-Type": "application/json"
           }
-        });
-        if (!linesResponse.ok) {
-          throw new Error(`Failed to fetch lines: ${linesResponse.statusText}`);
-        }
-        const linesData = await linesResponse.json();
-        const lines = linesData.lines || [];
-        setAvailableFactories(factories || []);
-        setAvailableLines(lines);
-        console.log("[TeamManagementView] Company-scoped team view - Company:", companyId, "Loaded factories:", factories?.length, "lines:", lines?.length);
-      } else if (isFactoryScopedRole(user?.role_level)) {
-        if (factoryScopedRoleFactoryIds.length > 0) {
-          if (companyId) {
-            const linesResponse = await fetch(`${backendUrl}/api/lines?company_id=${companyId}`, {
-              headers: {
-                "Authorization": `Bearer ${token}`,
-                "Content-Type": "application/json"
-              }
-            });
-            if (!linesResponse.ok) {
-              throw new Error(`Failed to fetch lines: ${linesResponse.statusText}`);
-            }
-            const linesData = await linesResponse.json();
-            const allLines = linesData.lines || [];
-            const lines = allLines.filter((line) => factoryScopedRoleFactoryIds.includes(line.factory_id));
-            setAvailableLines(lines);
-            console.log("[TeamManagementView] Factory-scoped team view - Factories:", factoryScopedRoleFactoryIds, "Loaded lines:", lines?.length);
-          }
-        } else if (entityConfig?.factoryId) {
-          const linesResponse = await fetch(`${backendUrl}/api/lines?factory_id=${entityConfig.factoryId}`, {
-            headers: {
-              "Authorization": `Bearer ${token}`,
-              "Content-Type": "application/json"
-            }
-          });
-          if (!linesResponse.ok) {
-            throw new Error(`Failed to fetch lines: ${linesResponse.statusText}`);
-          }
-          const linesData = await linesResponse.json();
-          const lines = linesData.lines || [];
-          setAvailableLines(lines);
-          console.log("[TeamManagementView] Plant Head - Using entityConfig factory:", entityConfig.factoryId, "Loaded lines:", lines?.length);
-        } else {
-          setAvailableLines([]);
-          console.warn("[TeamManagementView] Plant Head has no factory assignments");
         }
-        setAvailableFactories([]);
-      } else if (companyId) {
-        const linesResponse = await fetch(`${backendUrl}/api/lines?company_id=${companyId}`, {
-          headers: {
-            "Authorization": `Bearer ${token}`,
-            "Content-Type": "application/json"
-          }
-        });
-        if (!linesResponse.ok) {
-          throw new Error(`Failed to fetch lines: ${linesResponse.statusText}`);
-        }
-        const linesData = await linesResponse.json();
-        const lines = linesData.lines || [];
-        setAvailableLines(lines);
-        setAvailableFactories([]);
-        console.log("[TeamManagementView] Fallback - Company:", companyId, "Loaded lines:", lines?.length);
-      }
-      const usersPromise = isFactoryScopedRole(user?.role_level) ? (async () => {
-        if (factoryScopedRoleFactoryIds.length === 0) {
-          return [];
-        }
-        const results = await Promise.allSettled(
-          factoryScopedRoleFactoryIds.map((factoryId) => userManagementService.getFactoryUsers(factoryId))
-        );
-        const successful = results.filter(
-          (result) => result.status === "fulfilled"
-        ).flatMap((result) => result.value || []);
-        if (successful.length > 0) {
-          const byUserId = /* @__PURE__ */ new Map();
-          successful.forEach((u) => {
-            if (u?.user_id) {
-              byUserId.set(u.user_id, u);
-            }
-          });
-          return Array.from(byUserId.values());
-        }
-        const firstRejected = results.find(
-          (result) => result.status === "rejected"
-        );
-        if (firstRejected) {
-          throw firstRejected.reason;
-        }
-        return [];
-      })() : userManagementService.getCompanyUsers(companyId);
-      const [usersData, userStats] = await Promise.all([
-        usersPromise,
-        userManagementService.getUserStats(companyId)
-      ]);
-      setUsers(usersData);
-      setStats({
-        totalUsers: userStats.total,
-        owners: userStats.owners,
-        it: userStats.it,
-        plantHeads: userStats.plant_heads,
-        industrialEngineers: userStats.industrial_engineers,
-        supervisors: userStats.supervisors,
-        optifye: 0
-      });
+      );
+      if (!bootstrapResponse.ok) {
+        const errorData = await bootstrapResponse.json().catch(() => ({}));
+        throw new Error(errorData.detail || `Failed to fetch team bootstrap: ${bootstrapResponse.statusText}`);
+      }
+      const bootstrapData = await bootstrapResponse.json();
+      setAvailableFactories((bootstrapData.factories || []).map((factory) => ({
+        id: factory.id,
+        factory_name: factory.factory_name
+      })));
+      setAvailableLines(bootstrapData.lines || []);
+      setUsers(bootstrapData.users || []);
+      setUsageSummaryByUser(bootstrapData.usage_summary_by_user || {});
     } catch (err) {
       console.error("Error loading team management data:", err);
       setError(err instanceof Error ? err.message : "Failed to load data");
@@ -74013,7 +73905,7 @@ var TeamManagementView = ({
     } finally {
       setIsLoading(false);
     }
-  }, [supabase, user, pageCompanyId, entityConfig?.factoryId, factoryScopedRoleFactoryIds]);
+  }, [supabase, user, pageCompanyId, usageDateRange.endDate, usageDateRange.startDate]);
   React143.useEffect(() => {
     const companyId = pageCompanyId;
     const canLoad = hasAccess && user && !!companyId;
@@ -74194,7 +74086,7 @@ var TeamManagementView = ({
         availableLines,
         availableFactories,
         avgDailyUsage: avgDailyUsageMap,
-        isUsageLoading,
+        isUsageLoading: false,
         showUsageStats: canViewUsageStats
       }
     ) }),
@@ -79017,6 +78909,12 @@ var buildDeltaBadge = (delta, options) => {
     text: `${options.formatter(delta)} vs ${options.comparisonLabel}`
   };
 };
+var parseSpecificShiftId = (shiftMode) => {
+  const rawMode = String(shiftMode || "").trim().toLowerCase();
+  if (!rawMode.startsWith("shift:")) return null;
+  const parsed = Number(rawMode.split(":", 2)[1]);
+  return Number.isFinite(parsed) ? parsed : null;
+};
 var normalizeShiftLabel = (shiftName, shiftMode) => {
   if (shiftMode === "all") {
     return "All Shifts";
@@ -79028,6 +78926,10 @@ var normalizeShiftLabel = (shiftName, shiftMode) => {
     if (normalizedName === "night") return "Night Shift";
     return /shift/i.test(trimmedName) ? trimmedName : `${trimmedName} Shift`;
   }
+  const specificShiftId = parseSpecificShiftId(shiftMode);
+  if (specificShiftId !== null) {
+    return `Shift ${specificShiftId}`;
+  }
   if (shiftMode === "night") return "Night Shift";
   return "Day Shift";
 };
@@ -79100,6 +79002,7 @@ var OperationsOverviewHeader = React143__namespace.default.memo(({
   dateRange,
   displayDateRange,
   trendMode,
+  shiftFilterOptions,
   isLiveScope,
   liveShiftName,
   lineOptions,
@@ -79353,7 +79256,7 @@ var OperationsOverviewHeader = React143__namespace.default.memo(({
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
           /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-xs font-medium text-gray-500 uppercase tracking-wide ml-1", children: "Shift" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsxs(
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsx(
             "select",
             {
               value: trendMode,
@@ -79365,11 +79268,7 @@ var OperationsOverviewHeader = React143__namespace.default.memo(({
                 backgroundRepeat: "no-repeat",
                 backgroundSize: "1.2em 1.2em"
               },
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "all", children: "All Shifts" }),
-                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "day", children: "Day Shift" }),
-                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "night", children: "Night Shift" })
-              ]
+              children: shiftFilterOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: option.value, children: option.label }, option.value))
             }
           ) })
         ] }),
@@ -80439,6 +80338,24 @@ var normalizeShiftId = (value) => {
   }
   return null;
 };
+var buildSpecificShiftMode = (value) => {
+  const normalizedShiftId = normalizeShiftId(value);
+  return normalizedShiftId === null ? null : `shift:${normalizedShiftId}`;
+};
+var parseSpecificShiftMode = (value) => {
+  const rawValue = String(value || "").trim().toLowerCase();
+  if (!rawValue.startsWith("shift:")) return null;
+  const parsed = Number(rawValue.split(":", 2)[1]);
+  return Number.isFinite(parsed) ? parsed : null;
+};
+var formatShiftOptionLabel = (shiftName, shiftId) => {
+  const trimmedName = shiftName?.trim();
+  if (trimmedName) {
+    return /shift/i.test(trimmedName) ? trimmedName : `${trimmedName} Shift`;
+  }
+  const normalizedShiftId = normalizeShiftId(shiftId);
+  return normalizedShiftId === null ? "Unknown Shift" : `Shift ${normalizedShiftId}`;
+};
 var classifyShiftBucket = ({
   shiftName,
   shiftId,
@@ -80525,6 +80442,26 @@ var normalizeShiftWindowMinutes = (startTime, endTime) => {
   }
   return { startMinutes, endMinutes };
 };
+var getOperationalSortStartMinutes = (startTime, endTime) => {
+  const normalizedWindow = normalizeShiftWindowMinutes(startTime, endTime);
+  if (!normalizedWindow) return null;
+  return normalizedWindow.startMinutes < 6 * 60 ? normalizedWindow.startMinutes + 24 * 60 : normalizedWindow.startMinutes;
+};
+var doesShiftMatchTrendMode = ({
+  trendMode,
+  shiftName,
+  shiftId,
+  startTime,
+  endTime
+}) => {
+  if (trendMode === "all") return true;
+  const specificShiftId = parseSpecificShiftMode(trendMode);
+  if (specificShiftId !== null) {
+    return normalizeShiftId(shiftId) === specificShiftId;
+  }
+  const bucket = classifyShiftBucket({ shiftName, shiftId, startTime, endTime });
+  return bucket === trendMode;
+};
 var PlantHeadView = () => {
   const supabase = useSupabase();
   const entityConfig = useEntityConfig();
@@ -80655,6 +80592,45 @@ var PlantHeadView = () => {
     shiftConfigMap,
     isLoading: isShiftConfigLoading
   } = useMultiLineShiftConfigs(scopedLineIds, staticShiftConfig);
+  const shiftFilterOptions = React143__namespace.default.useMemo(() => {
+    const optionsById = /* @__PURE__ */ new Map();
+    scopedLineIds.forEach((lineId) => {
+      const shiftConfig = shiftConfigMap.get(lineId) || staticShiftConfig;
+      getShiftWindowsForConfig(shiftConfig).forEach((shift) => {
+        const shiftId = normalizeShiftId(shift.shiftId);
+        if (shiftId === null) return;
+        const sortKey = getOperationalSortStartMinutes(shift.startTime, shift.endTime) ?? 24 * 60 + shiftId;
+        const existing = optionsById.get(shiftId);
+        const label = formatShiftOptionLabel(shift.shiftName, shiftId);
+        if (!existing) {
+          optionsById.set(shiftId, {
+            value: buildSpecificShiftMode(shiftId),
+            label,
+            shiftId,
+            shiftName: shift.shiftName || null,
+            startTime: shift.startTime || null,
+            endTime: shift.endTime || null,
+            sortKey
+          });
+          return;
+        }
+        if ((!existing.shiftName || existing.shiftName === `Shift ${shiftId}`) && shift.shiftName) {
+          existing.shiftName = shift.shiftName;
+          existing.label = label;
+        }
+        if (sortKey < existing.sortKey) {
+          existing.sortKey = sortKey;
+          existing.startTime = shift.startTime || null;
+          existing.endTime = shift.endTime || null;
+        }
+      });
+    });
+    const dynamicOptions = Array.from(optionsById.values()).sort((a, b) => a.sortKey - b.sortKey || (a.shiftId || 0) - (b.shiftId || 0)).map(({ sortKey, ...option }) => option);
+    return [
+      { value: "all", label: "All Shifts" },
+      ...dynamicOptions
+    ];
+  }, [appTimezone, scopedLineIds, shiftConfigMap, staticShiftConfig]);
   React143__namespace.default.useEffect(() => {
     if (scopedLineIds.length === 0 || isShiftConfigLoading) {
       return;
@@ -80717,18 +80693,20 @@ var PlantHeadView = () => {
       if (!activeShift) {
         return [];
       }
-      const trendBucket = classifyShiftBucket({
+      const bucketTrendMode = classifyShiftBucket({
         shiftName: activeShift.shiftName,
         shiftId: activeShift.shiftId,
         startTime: activeShift.startTime,
         endTime: activeShift.endTime
       });
-      if (!trendBucket || trendBucket === "all") {
+      const exactTrendMode = buildSpecificShiftMode(activeShift.shiftId);
+      if (!bucketTrendMode && !exactTrendMode) {
         return [];
       }
       return [{
         lineId,
-        trendMode: trendBucket,
+        exactTrendMode,
+        bucketTrendMode,
         shiftId: activeShift.shiftId,
         shiftName: activeShift.shiftName || null,
         startTime: activeShift.startTime || null,
@@ -80737,14 +80715,12 @@ var PlantHeadView = () => {
       }];
     });
   }, [appTimezone, scopedLineIds, shiftConfigMap, shiftResolutionNow, staticShiftConfig]);
-  const hasActiveDayShiftLine = React143__namespace.default.useMemo(
-    () => activeLineShiftStates.some((shift) => shift.trendMode === "day" && shift.date === resolvedOperationalToday),
-    [activeLineShiftStates, resolvedOperationalToday]
-  );
-  const hasActiveNightShiftLine = React143__namespace.default.useMemo(
-    () => activeLineShiftStates.some((shift) => shift.trendMode === "night" && shift.date === resolvedOperationalToday),
-    [activeLineShiftStates, resolvedOperationalToday]
-  );
+  const uniformActiveTrendMode = React143__namespace.default.useMemo(() => {
+    const activeModes = Array.from(new Set(
+      activeLineShiftStates.filter((shift) => shift.date === resolvedOperationalToday).map((shift) => shift.exactTrendMode).filter((mode) => !!mode)
+    ));
+    return activeModes.length === 1 ? activeModes[0] : null;
+  }, [activeLineShiftStates, resolvedOperationalToday]);
   const resolvedTrendMode = isInitialScopeReady ? trendMode : "all";
   const hourlyWindowStartTime = React143__namespace.default.useMemo(() => {
     if (scopedLineIds.length === 0) {
@@ -80755,13 +80731,19 @@ var PlantHeadView = () => {
     scopedLineIds.forEach((lineId) => {
       const shiftConfig = shiftConfigMap.get(lineId) || staticShiftConfig;
       getShiftWindowsForConfig(shiftConfig).forEach((shift) => {
-        const bucket = classifyShiftBucket({
+        classifyShiftBucket({
           shiftName: shift.shiftName,
           shiftId: shift.shiftId,
           startTime: shift.startTime,
           endTime: shift.endTime
         });
-        if (resolvedTrendMode !== "all" && bucket !== resolvedTrendMode) {
+        if (!doesShiftMatchTrendMode({
+          trendMode: resolvedTrendMode,
+          shiftName: shift.shiftName,
+          shiftId: shift.shiftId,
+          startTime: shift.startTime,
+          endTime: shift.endTime
+        })) {
           return;
         }
         const normalizedWindow = normalizeShiftWindowMinutes(shift.startTime, shift.endTime);
@@ -80835,11 +80817,11 @@ var PlantHeadView = () => {
         endKey: nextStartKey
       };
     });
-    setTrendMode("all");
+    setTrendMode(uniformActiveTrendMode || "all");
     setUsesThisWeekComparison(false);
     hasAutoInitializedScopeRef.current = true;
     setIsInitialScopeReady(true);
-  }, [fallbackOperationalDate, isShiftScopeResolved, resolvedOperationalToday, scopedLineIds.length]);
+  }, [fallbackOperationalDate, isShiftScopeResolved, resolvedOperationalToday, scopedLineIds.length, uniformActiveTrendMode]);
   const handleDateRangeChange = React143__namespace.default.useCallback((range, meta) => {
     hasUserAdjustedScopeRef.current = true;
     setIsInitialScopeReady(true);
@@ -80926,6 +80908,33 @@ var PlantHeadView = () => {
     () => resolvedTrendMode,
     [resolvedTrendMode]
   );
+  const hasActiveSelectedShiftLine = React143__namespace.default.useMemo(
+    () => activeLineShiftStates.some((shift) => {
+      if (shift.date !== resolvedOperationalToday) return false;
+      if (effectiveTrendMode === "all") return true;
+      const specificShiftId = parseSpecificShiftMode(effectiveTrendMode);
+      if (specificShiftId !== null) {
+        return shift.exactTrendMode === effectiveTrendMode;
+      }
+      return shift.bucketTrendMode === effectiveTrendMode;
+    }),
+    [activeLineShiftStates, effectiveTrendMode, resolvedOperationalToday]
+  );
+  const activeLiveShiftName = React143__namespace.default.useMemo(
+    () => {
+      if (effectiveTrendMode === "all") return null;
+      const matchingShift = activeLineShiftStates.find((shift) => {
+        if (shift.date !== resolvedOperationalToday) return false;
+        const specificShiftId = parseSpecificShiftMode(effectiveTrendMode);
+        if (specificShiftId !== null) {
+          return shift.exactTrendMode === effectiveTrendMode;
+        }
+        return shift.bucketTrendMode === effectiveTrendMode;
+      });
+      return matchingShift?.shiftName || null;
+    },
+    [activeLineShiftStates, effectiveTrendMode, resolvedOperationalToday]
+  );
   const hourlyLabelStartTime = React143__namespace.default.useMemo(() => {
     if (scopedLineIds.length === 0) {
       return null;
@@ -80937,12 +80946,11 @@ var PlantHeadView = () => {
     [effectiveDateRange.endKey, effectiveDateRange.startKey]
   );
   const isLiveScope = React143__namespace.default.useMemo(
-    () => isSingleDayScope && effectiveDateRange.startKey === resolvedOperationalToday && (effectiveTrendMode === "all" || effectiveTrendMode === "day" && hasActiveDayShiftLine || effectiveTrendMode === "night" && hasActiveNightShiftLine),
+    () => isSingleDayScope && effectiveDateRange.startKey === resolvedOperationalToday && hasActiveSelectedShiftLine,
     [
       effectiveDateRange.startKey,
       effectiveTrendMode,
-      hasActiveDayShiftLine,
-      hasActiveNightShiftLine,
+      hasActiveSelectedShiftLine,
       isSingleDayScope,
       resolvedOperationalToday
     ]
@@ -80979,8 +80987,9 @@ var PlantHeadView = () => {
         dateRange,
         displayDateRange: headerDateRange,
         trendMode,
+        shiftFilterOptions,
         isLiveScope,
-        liveShiftName: isLiveScope && trendMode !== "all" ? trendMode : null,
+        liveShiftName: isLiveScope && trendMode !== "all" ? activeLiveShiftName : null,
         lineOptions,
         supervisorOptions,
         selectedSupervisorId,