@optifye/dashboard-core 6.12.29 → 6.12.31

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import { format, addDays, subMonths, endOfMonth, startOfMonth, endOfDay, eachDayOfInterval, getDay, isSameDay, isWithinInterval, startOfDay, parseISO, subDays, differenceInMinutes, addMinutes, addMonths, isValid, formatDistanceToNow, isToday, isFuture, isBefore } from 'date-fns';
 import { formatInTimeZone, fromZonedTime, toZonedTime } from 'date-fns-tz';
 import * as React144 from 'react';
-import React144__default, { createContext, useRef, useCallback, useState, useMemo, useEffect, forwardRef, useImperativeHandle, useLayoutEffect, memo as memo$1, useContext, useSyncExternalStore, useId, Children, isValidElement, useInsertionEffect, startTransition, Fragment as Fragment$1, createElement, Component } from 'react';
+import React144__default, { createContext, useRef, useId, useCallback, useState, useMemo, useEffect, forwardRef, useImperativeHandle, useLayoutEffect, memo as memo$1, useContext, useSyncExternalStore, Children, isValidElement, useInsertionEffect, startTransition, Fragment as Fragment$1, createElement, Component } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useRouter } from 'next/router';
 import { toast } from 'sonner';
@@ -10,7 +10,7 @@ import { EventEmitter } from 'events';
 import { createClient, REALTIME_SUBSCRIBE_STATES } from '@supabase/supabase-js';
 import Hls, { Events, ErrorTypes } from 'hls.js';
 import useSWR from 'swr';
-import { Camera, AlertTriangle, ChevronDown, ChevronUp, Check, ShieldCheck, Star, Award, Filter, X, Coffee, Plus, ArrowUp, ArrowDown, ArrowRight, CheckCircle2, ArrowLeft, Clock, Calendar, Save, AlertCircle, Loader2, Minus, ChevronLeft, ChevronRight, TrendingUp, Sparkles, Pause, Play, XCircle, HelpCircle, Activity, Wrench, UserX, Package, RefreshCw, Palette, TrendingDown, FolderOpen, Folder, ArrowDownWideNarrow, Tag, Sliders, Layers, Search, Edit2, CheckCircle, User, Users, Shield, Building2, Mail, Lock, Info, Share2, Trophy, Target, Download, Video, Copy, Sun, Moon, MousePointer, UserPlus, UserCog, Trash2, Eye, MoreVertical, BarChart3, Pencil, UserCheck, LogOut, Film, MessageSquare, Menu, Send, Settings, LifeBuoy, EyeOff, Zap, Flame, Crown, Medal } from 'lucide-react';
+import { Camera, AlertTriangle, ChevronDown, ChevronUp, Check, ShieldCheck, Star, Award, Filter, X, Coffee, Plus, ArrowUp, ArrowDown, ArrowRight, HelpCircle, ClipboardX, Activity, Wrench, UserX, Clock, Package, RefreshCw, CheckCircle2, ArrowLeft, Calendar, Save, AlertCircle, Loader2, Minus, ChevronLeft, ChevronRight, TrendingUp, Sparkles, Pause, Play, XCircle, Palette, TrendingDown, FolderOpen, Folder, ArrowDownWideNarrow, Tag, Sliders, Layers, Search, Edit2, CheckCircle, User, Users, Shield, Building2, Mail, Lock, Info, Share2, Trophy, Target, Download, Video, Copy, Sun, Moon, MousePointer, UserPlus, UserCog, Trash2, Eye, MoreVertical, BarChart3, Pencil, UserCheck, LogOut, Film, MessageSquare, Menu, Send, Settings, LifeBuoy, EyeOff, Zap, Flame, Crown, Medal } from 'lucide-react';
 import { memo, noop, warning, invariant, progress, secondsToMilliseconds, millisecondsToSeconds } from 'motion-utils';
 import { BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, ReferenceLine, Tooltip, Legend, Bar, LabelList, ResponsiveContainer, LineChart as LineChart$1, Line, Customized, Cell, PieChart, Pie, ComposedChart, Area, ScatterChart, Scatter } from 'recharts';
 import { Slot } from '@radix-ui/react-slot';
@@ -4636,7 +4636,10 @@ var combineLineMetricsRows = (rows, dummySkuId) => {
   };
   const avgEfficiency = weighted("avg_efficiency");
   const avgCycleTime = weighted("avg_cycle_time");
-  const thresholdPph = weighted("threshold_pph");
+  const thresholdPph = rowsForAggregation.reduce(
+    (acc, row) => acc + (coerceOptionalNumber(row.threshold_pph) ?? 0),
+    0
+  );
   const underperformingWorkspaces = activeRealRows.length > 0 ? roundHalfUpInt(
     activeRealRows.reduce(
       (acc, row) => acc + safeInt(row.underperforming_workspaces),
@@ -14687,6 +14690,7 @@ var transformMonitorWorkspaceMetrics = ({
       monitoring_mode: item.monitoring_mode ?? void 0,
       idle_time: idleTimeSeconds,
       idle_time_hourly: item.idle_time_hourly ?? null,
+      idle_reason_hourly: item.idle_reason_hourly ?? null,
       shift_start: item.shift_start ?? void 0,
       shift_end: item.shift_end ?? void 0,
       assembly_enabled: item.assembly_enabled ?? false,
@@ -14718,10 +14722,12 @@ var transformMonitorWorkspaceMetrics = ({
       video_grid_green_streak_minutes: item.video_grid_green_streak_minutes ?? null,
       video_grid_green_streak_anchor_at: item.video_grid_green_streak_anchor_at ?? null,
       video_grid_green_streak_started_at: item.video_grid_green_streak_started_at ?? null,
+      video_grid_green_streak_observed_at: item.video_grid_green_streak_observed_at ?? null,
       scheduled_break_active: item.scheduled_break_active ?? false,
       incoming_wip_current: item.incoming_wip_current ?? null,
       incoming_wip_effective_at: item.incoming_wip_effective_at ?? null,
       incoming_wip_buffer_name: item.incoming_wip_buffer_name ?? null,
+      video_grid_badges: Array.isArray(item.video_grid_badges) ? item.video_grid_badges : [],
       show_exclamation: item.show_exclamation ?? void 0
     };
     workspaceMetricsStore.setOverview(metric);
@@ -21240,6 +21246,7 @@ var ICON_CONFIG = {
   "user-x": UserX,
   wrench: Wrench,
   activity: Activity,
+  "clipboard-x": ClipboardX,
   "help-circle": HelpCircle
 };
 var humanizeIdleReasonLabel = (value) => {
@@ -37988,17 +37995,22 @@ var getAllVideoGridGreenStreakDisplay = (workspaces, legend = DEFAULT_EFFICIENCY
   const activeStreaks = visibleWorkspaces.map((workspace) => {
     const startedAt = workspace.video_grid_green_streak_started_at;
     const anchorAt = workspace.video_grid_green_streak_anchor_at;
+    const observedAt = workspace.video_grid_green_streak_observed_at;
     const streakMinutes = workspace.video_grid_green_streak_minutes;
     const startedAtMs = parseTimestampMs(startedAt);
     const anchorAtMs = parseTimestampMs(anchorAt);
+    const observedAtMs = parseTimestampMs(observedAt);
     const isFresh = isAllGreenStreakFresh(workspace, anchorAtMs, nowMs2);
-    const tickOriginAtMs = anchorAtMs + CONFIRMED_MINUTE_DURATION_MS;
+    const tickOriginAtMs = Number.isFinite(observedAtMs) ? observedAtMs : anchorAtMs + CONFIRMED_MINUTE_DURATION_MS;
+    const confirmedSeconds2 = Math.max(0, Math.floor((streakMinutes || 0) * 60));
+    const visibleSeconds = confirmedSeconds2 + Math.max(0, Math.floor((nowMs2 - tickOriginAtMs) / 1e3));
     if (workspace.video_grid_green_streak_active === true && isFiniteNumber3(streakMinutes) && streakMinutes > 0 && startedAt && anchorAt && Number.isFinite(startedAtMs) && isFresh) {
       return {
         startedAt,
         startedAtMs,
         anchorAt,
         streakMinutes,
+        visibleSeconds,
         tickOriginAtMs
       };
     }
@@ -38007,7 +38019,7 @@ var getAllVideoGridGreenStreakDisplay = (workspaces, legend = DEFAULT_EFFICIENCY
   if (activeStreaks.some((streak) => streak === null)) {
     return null;
   }
-  const strictestStartedAt = activeStreaks.reduce((latest, current) => current.streakMinutes < latest.streakMinutes || current.streakMinutes === latest.streakMinutes && current.startedAtMs > latest.startedAtMs ? current : latest);
+  const strictestStartedAt = activeStreaks.reduce((latest, current) => current.visibleSeconds < latest.visibleSeconds || current.visibleSeconds === latest.visibleSeconds && current.startedAtMs > latest.startedAtMs ? current : latest);
   const confirmedSeconds = Math.max(0, Math.floor(strictestStartedAt.streakMinutes * 60));
   return {
     label: "All green",
@@ -38026,6 +38038,52 @@ var getVideoGridLegendLabel = (workspaces) => {
   }
   return visibleWorkspaces.some(isVideoGridRecentFlowEnabled) ? VIDEO_GRID_LEGEND_LABEL : MAP_GRID_LEGEND_LABEL;
 };
+var getStatusBadgeSignature = (workspace) => {
+  const badges = workspace.video_grid_badges || [];
+  return badges.map((badge) => [
+    badge.kind,
+    badge.label,
+    badge.display_name,
+    badge.palette_token,
+    badge.icon_token,
+    badge.anchor_minute,
+    badge.reason_minute,
+    badge.shift_elapsed_fraction,
+    badge.title
+  ].join(":")).join("|");
+};
+var VALID_STATUS_BADGE_ICON_TOKENS = /* @__PURE__ */ new Set([
+  "alert-triangle",
+  "refresh-cw",
+  "package",
+  "clock",
+  "user-x",
+  "wrench",
+  "activity",
+  "clipboard-x"
+]);
+var normalizeStatusBadgeToken = (value) => String(value || "").trim().toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_+|_+$/g, "");
+var resolveVideoGridStatusBadgeIconToken = (badge) => {
+  if (badge.kind === "no_plan") {
+    return "clipboard-x";
+  }
+  const reasonTokens = /* @__PURE__ */ new Set([
+    normalizeStatusBadgeToken(badge.label),
+    normalizeStatusBadgeToken(badge.display_name),
+    normalizeStatusBadgeToken(badge.title)
+  ]);
+  if (reasonTokens.has("no_material")) {
+    return "package";
+  }
+  if (reasonTokens.has("machine_maintenance") || reasonTokens.has("machine_downtime")) {
+    return "wrench";
+  }
+  const iconToken = normalizeStatusBadgeToken(badge.icon_token);
+  if (VALID_STATUS_BADGE_ICON_TOKENS.has(iconToken)) {
+    return iconToken;
+  }
+  return "activity";
+};
 function getTrendArrowAndColor(trend) {
   if (trend > 0) {
     return { arrow: "\u2191", color: "text-green-400" };
@@ -38057,6 +38115,7 @@ var VideoCard = React144__default.memo(({
 }) => {
   const videoRef = useRef(null);
   const canvasRef = useRef(null);
+  const statusBadgeIdPrefix = useId();
   const effectiveLegend = legend || DEFAULT_EFFICIENCY_LEGEND;
   const { isStale: isStreamStale } = useHlsStreamWithCropping(videoRef, canvasRef, {
     src: hlsUrl,
@@ -38083,6 +38142,7 @@ var VideoCard = React144__default.memo(({
   const shouldRenderMetricBadge = hasDisplayMetric;
   const badgeTitle = isHighEfficiencyOverride ? `Efficiency ${Math.round(videoGridDisplayValue ?? 0)}%` : hasVideoGridRecentFlow(workspace) ? `Flow ${Math.round(videoGridDisplayValue ?? 0)}%` : isRecentFlowCard ? "Flow unavailable" : `Efficiency ${Math.round(videoGridDisplayValue ?? 0)}%`;
   const badgeLabel = `${Math.round(videoGridDisplayValue ?? 0)}%`;
+  const statusBadges = workspace.video_grid_badges || [];
   const efficiencyOverlayClass = videoGridColorState === "green" ? "bg-[#00D654]/25" : videoGridColorState === "blue" ? "bg-[#0EA5E9]/30" : videoGridColorState === "yellow" ? "bg-[#FFD700]/30" : videoGridColorState === "red" ? "bg-[#FF2D0A]/30" : "bg-transparent";
   const efficiencyBarClass = videoGridColorState === "green" ? "bg-[#00AB45]" : videoGridColorState === "blue" ? "bg-[#0EA5E9]" : videoGridColorState === "yellow" ? "bg-[#FFB020]" : videoGridColorState === "red" ? "bg-[#E34329]" : "bg-gray-500/70";
   const efficiencyStatus = videoGridColorState === "green" ? "High" : videoGridColorState === "blue" ? "Best" : videoGridColorState === "yellow" ? "Medium" : videoGridColorState === "red" ? "Low" : "Neutral";
@@ -38161,6 +38221,61 @@ var VideoCard = React144__default.memo(({
               children: /* @__PURE__ */ jsx("span", { className: `${compact ? "text-[10px]" : "text-xs"} font-semibold`, children: badgeLabel })
             }
           ) }),
+          statusBadges.length > 0 && /* @__PURE__ */ jsx(
+            "div",
+            {
+              "data-testid": "video-card-status-badges",
+              className: `absolute ${compact ? "top-1.5 left-1.5 gap-1" : "top-2 left-2 gap-1.5"} z-30 flex items-center`,
+              children: statusBadges.map((badge, index) => {
+                const presentation = getIdleReasonPresentation({
+                  label: badge.label,
+                  displayName: badge.display_name,
+                  paletteToken: badge.palette_token,
+                  iconToken: resolveVideoGridStatusBadgeIconToken(badge),
+                  isKnown: badge.is_known
+                });
+                const Icon2 = presentation.Icon;
+                const tooltipText = presentation.displayName;
+                const tooltipId = `video-card-status-tooltip-${statusBadgeIdPrefix}-${badge.kind}-${index}`;
+                return /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    "data-testid": `video-card-status-badge-${badge.kind}`,
+                    "aria-label": tooltipText,
+                    "aria-describedby": tooltipId,
+                    className: `group relative inline-flex shrink-0 items-center justify-center rounded-full bg-slate-950/70 border-2 shadow-[0_3px_10px_rgba(0,0,0,0.34),inset_0_0_0_1px_rgba(255,255,255,0.18)] ${compact ? "h-10 w-10" : "h-11 w-11"}`,
+                    style: {
+                      borderColor: presentation.hex
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        Icon2,
+                        {
+                          "aria-hidden": "true",
+                          className: `${compact ? "h-5 w-5" : "h-6 w-6"} text-white`,
+                          strokeWidth: 2.4
+                        }
+                      ),
+                      /* @__PURE__ */ jsxs(
+                        "span",
+                        {
+                          id: tooltipId,
+                          role: "tooltip",
+                          "data-testid": `video-card-status-tooltip-${badge.kind}`,
+                          className: "pointer-events-none absolute left-0 top-full mt-2 whitespace-nowrap rounded-md border border-white/10 bg-slate-950/95 px-2 py-1 text-[11px] font-semibold leading-none text-white opacity-0 shadow-[0_6px_18px_rgba(0,0,0,0.34)] transition-opacity duration-150 group-hover:opacity-100",
+                          children: [
+                            /* @__PURE__ */ jsx("span", { className: "absolute -top-1 left-3 h-2 w-2 rotate-45 border-l border-t border-white/10 bg-slate-950/95" }),
+                            tooltipText
+                          ]
+                        }
+                      )
+                    ]
+                  },
+                  `${badge.kind}-${badge.label || index}-${badge.reason_minute ?? index}`
+                );
+              })
+            }
+          ),
           /* @__PURE__ */ jsx("div", { className: `absolute bottom-0 left-0 right-0 ${compact ? "h-0.5" : "h-1"} bg-black/50 z-30`, children: /* @__PURE__ */ jsx(
             "div",
             {
@@ -38197,7 +38312,7 @@ var VideoCard = React144__default.memo(({
     }
   );
 }, (prevProps, nextProps) => {
-  if (prevProps.workspace.efficiency !== nextProps.workspace.efficiency || prevProps.workspace.assembly_enabled !== nextProps.workspace.assembly_enabled || prevProps.workspace.video_grid_metric_mode !== nextProps.workspace.video_grid_metric_mode || prevProps.workspace.recent_flow_percent !== nextProps.workspace.recent_flow_percent || prevProps.workspace.recent_flow_effective_end_at !== nextProps.workspace.recent_flow_effective_end_at || prevProps.workspace.recent_flow_forced_zero_after_shift !== nextProps.workspace.recent_flow_forced_zero_after_shift || prevProps.workspace.scheduled_break_active !== nextProps.workspace.scheduled_break_active || prevProps.workspace.incoming_wip_current !== nextProps.workspace.incoming_wip_current || prevProps.workspace.incoming_wip_buffer_name !== nextProps.workspace.incoming_wip_buffer_name || prevProps.workspace.trend !== nextProps.workspace.trend || prevProps.workspace.performance_score !== nextProps.workspace.performance_score || prevProps.workspace.pph !== nextProps.workspace.pph) {
+  if (prevProps.workspace.efficiency !== nextProps.workspace.efficiency || prevProps.workspace.assembly_enabled !== nextProps.workspace.assembly_enabled || prevProps.workspace.video_grid_metric_mode !== nextProps.workspace.video_grid_metric_mode || prevProps.workspace.recent_flow_percent !== nextProps.workspace.recent_flow_percent || prevProps.workspace.recent_flow_effective_end_at !== nextProps.workspace.recent_flow_effective_end_at || prevProps.workspace.recent_flow_forced_zero_after_shift !== nextProps.workspace.recent_flow_forced_zero_after_shift || prevProps.workspace.scheduled_break_active !== nextProps.workspace.scheduled_break_active || prevProps.workspace.incoming_wip_current !== nextProps.workspace.incoming_wip_current || prevProps.workspace.incoming_wip_buffer_name !== nextProps.workspace.incoming_wip_buffer_name || getStatusBadgeSignature(prevProps.workspace) !== getStatusBadgeSignature(nextProps.workspace) || prevProps.workspace.trend !== nextProps.workspace.trend || prevProps.workspace.performance_score !== nextProps.workspace.performance_score || prevProps.workspace.pph !== nextProps.workspace.pph) {
     return false;
   }
   if (prevProps.workspace.workspace_uuid !== nextProps.workspace.workspace_uuid || prevProps.workspace.workspace_name !== nextProps.workspace.workspace_name || prevProps.workspace.line_id !== nextProps.workspace.line_id) {
@@ -64823,6 +64938,8 @@ var EMPTY_LINE_IDS = [];
 var EMPTY_WORKSPACES = [];
 var ALL_GREEN_CELEBRATION_DURATION_MS = 6e3;
 var ALL_GREEN_MILESTONE_DURATION_MS = 6e3;
+var ALL_GREEN_CELEBRATION_SEEN_PREFIX = "optifye:all-green-celebration:v1:";
+var ALL_GREEN_MILESTONE_SEEN_PREFIX = "optifye:all-green-milestone:v1:";
 var formatAllGreenCelebrationTimer = (elapsedSeconds) => {
   const safeElapsedSeconds = Math.max(1, Math.floor(elapsedSeconds));
   const minutes = Math.floor(safeElapsedSeconds / 60);
@@ -64833,6 +64950,29 @@ var getAllGreenBackendVisibleSeconds = (confirmedSeconds, tickOriginAtMs, nowMs2
   const localSecondOffset = Math.max(0, Math.floor((nowMs2 - tickOriginAtMs) / 1e3));
   return confirmedSeconds + localSecondOffset;
 };
+var getSessionSeenValue = (key) => {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  try {
+    const storage = window.sessionStorage;
+    return storage ? storage.getItem(key) : null;
+  } catch {
+    return null;
+  }
+};
+var setSessionSeenValue = (key) => {
+  if (typeof window === "undefined") {
+    return;
+  }
+  try {
+    const storage = window.sessionStorage;
+    storage?.setItem(key, "1");
+  } catch {
+  }
+};
+var buildAllGreenCelebrationSeenKey = (identity) => `${ALL_GREEN_CELEBRATION_SEEN_PREFIX}${identity}`;
+var buildAllGreenMilestoneSeenKey = (identity, milestoneSeconds) => `${ALL_GREEN_MILESTONE_SEEN_PREFIX}${identity}:${milestoneSeconds}`;
 var LoadingPageCmp = LoadingPage_default;
 var LoadingOverlayCmp = LoadingOverlay_default;
 function HomeView({
@@ -65393,6 +65533,12 @@ function HomeView({
     if (milestoneTracking.identity !== allGreenMilestoneIdentity) {
       milestoneTracking.identity = allGreenMilestoneIdentity;
       milestoneTracking.lastMilestoneSeconds = currentMilestoneSeconds;
+      if (currentMilestoneSeconds !== null) {
+        setSessionSeenValue(buildAllGreenMilestoneSeenKey(
+          allGreenMilestoneIdentity,
+          currentMilestoneSeconds
+        ));
+      }
       dismissGreenStreakMilestoneBanner();
       return;
     }
@@ -65402,6 +65548,15 @@ function HomeView({
     }
     if ((milestoneTracking.lastMilestoneSeconds ?? 0) < currentMilestone.milestoneSeconds) {
       milestoneTracking.lastMilestoneSeconds = currentMilestone.milestoneSeconds;
+      const milestoneSeenKey = buildAllGreenMilestoneSeenKey(
+        allGreenMilestoneIdentity,
+        currentMilestone.milestoneSeconds
+      );
+      if (getSessionSeenValue(milestoneSeenKey) === "1") {
+        dismissGreenStreakMilestoneBanner();
+        return;
+      }
+      setSessionSeenValue(milestoneSeenKey);
       triggerGreenStreakMilestoneBanner(currentMilestone);
     }
   }, [
@@ -65420,6 +65575,9 @@ function HomeView({
     if (transitionState.signature !== allGreenCelebrationSignature) {
       transitionState.signature = allGreenCelebrationSignature;
       transitionState.previousValidStreakIdentity = currentValidStreakIdentity;
+      if (currentValidStreakIdentity) {
+        setSessionSeenValue(buildAllGreenCelebrationSeenKey(currentValidStreakIdentity));
+      }
       dismissAllGreenCelebration();
       return;
     }
@@ -65430,11 +65588,18 @@ function HomeView({
     }
     if (transitionState.previousValidStreakIdentity === null) {
       transitionState.previousValidStreakIdentity = currentValidStreakIdentity;
+      const celebrationSeenKey = buildAllGreenCelebrationSeenKey(currentValidStreakIdentity);
+      if (getSessionSeenValue(celebrationSeenKey) === "1") {
+        dismissAllGreenCelebration();
+        return;
+      }
+      setSessionSeenValue(celebrationSeenKey);
       triggerAllGreenCelebration();
       return;
     }
     if (transitionState.previousValidStreakIdentity !== currentValidStreakIdentity) {
       transitionState.previousValidStreakIdentity = currentValidStreakIdentity;
+      setSessionSeenValue(buildAllGreenCelebrationSeenKey(currentValidStreakIdentity));
       dismissAllGreenCelebration();
     }
   }, [
@@ -83995,11 +84160,19 @@ var normalizeSummary = (value) => ({
   avg_idle_per_workstation: normalizeIdleMetric(value?.avg_idle_per_workstation)
 });
 var normalizeLineRow = (value) => ({
+  row_type: value?.row_type ?? null,
   line_id: value?.line_id,
   line_name: value?.line_name?.trim() || value?.line_id || "",
   avg_efficiency: normalizeNumber(value?.avg_efficiency),
   previous_avg_efficiency: normalizeNumber(value?.previous_avg_efficiency),
-  delta_pp: normalizeNumber(value?.delta_pp)
+  delta_pp: normalizeNumber(value?.delta_pp),
+  factory_id: value?.factory_id ?? null,
+  factory_area_id: value?.factory_area_id ?? null,
+  factory_area_key: value?.factory_area_key ?? null,
+  factory_area_name: value?.factory_area_name?.trim() || null,
+  factory_area_sort_order: normalizeNumber(value?.factory_area_sort_order),
+  factory_area_enabled: typeof value?.factory_area_enabled === "boolean" ? value.factory_area_enabled : null,
+  line_count: normalizeNumber(value?.line_count)
 });
 var normalizePoorestLines = (value) => ({
   output: (value?.output || []).map((item) => normalizeLineRow(item)),
@@ -84343,6 +84516,23 @@ var toNumber4 = (value) => {
   return null;
 };
 var roundOne = (value) => Math.round(value * 10) / 10;
+var isFiniteNumber4 = (value) => typeof value === "number" && Number.isFinite(value);
+var averageFinite = (values) => {
+  const finiteValues = values.filter(isFiniteNumber4);
+  if (finiteValues.length === 0) return null;
+  return finiteValues.reduce((sum, value) => sum + value, 0) / finiteValues.length;
+};
+var getEnabledAreaInfo2 = (row) => {
+  const areaId = row.factory_area_id?.trim();
+  const areaName = row.factory_area_name?.trim();
+  if (!areaId || !areaName) return null;
+  if (row.factory_area_enabled !== true) return null;
+  return {
+    areaId,
+    areaName,
+    factoryId: row.factory_id?.trim() || null
+  };
+};
 var formatIdleDuration = (seconds) => {
   if (seconds === null || seconds === void 0 || !Number.isFinite(seconds)) {
     return "--";
@@ -85077,11 +85267,49 @@ var PoorestPerformersCard = React144__default.memo(({
   const showSnapshotSkeleton = snapshot.loading && !snapshot.hasLoadedOnce;
   const mergedPoorestLines = React144__default.useMemo(() => {
     const rows = snapshot.data.poorest_lines?.[poorestLineMode] || [];
-    return rows.slice(0, 3).map((line) => {
+    const lineRows = [];
+    const areaGroups = /* @__PURE__ */ new Map();
+    rows.forEach((line) => {
+      if (line.row_type === "area") {
+        const efficiency = toNumber4(line.avg_efficiency);
+        if (efficiency === null) return;
+        const previousEfficiency = toNumber4(line.previous_avg_efficiency);
+        const lineCount = Math.max(1, Math.round(toNumber4(line.line_count) || 1));
+        lineRows.push({
+          rowType: "area",
+          id: line.line_id || `area:${line.factory_area_id || line.line_name || "unknown"}`,
+          name: line.factory_area_name?.trim() || line.line_name?.trim() || "Unknown Area",
+          efficiency: roundOne(efficiency),
+          previousEfficiency: previousEfficiency === null ? null : roundOne(previousEfficiency),
+          delta: toNumber4(line.delta_pp) ?? (previousEfficiency === null ? null : roundOne(efficiency - previousEfficiency)),
+          supervisor: `${lineCount} ${lineCount === 1 ? "line" : "lines"}`,
+          supervisorImage: null,
+          lineCount,
+          factoryId: line.factory_id ?? null,
+          factoryAreaId: line.factory_area_id ?? null
+        });
+        return;
+      }
+      const area = getEnabledAreaInfo2(line);
+      if (area) {
+        const group = areaGroups.get(area.areaId);
+        if (group) {
+          group.lines.push(line);
+        } else {
+          areaGroups.set(area.areaId, {
+            areaId: area.areaId,
+            areaName: area.areaName,
+            factoryId: area.factoryId,
+            lines: [line]
+          });
+        }
+        return;
+      }
       const lineId = line.line_id || "";
       const supervisors = supervisorsByLineId.get(lineId) || [];
       const supervisor = supervisors[0];
-      return {
+      lineRows.push({
+        rowType: "line",
         id: lineId,
         name: line.line_name?.trim() || "Unknown Line",
         efficiency: roundOne(toNumber4(line.avg_efficiency) || 0),
@@ -85089,8 +85317,31 @@ var PoorestPerformersCard = React144__default.memo(({
         delta: toNumber4(line.delta_pp),
         supervisor: supervisor?.displayName || "Unassigned",
         supervisorImage: supervisor?.profilePhotoUrl ?? null
-      };
+      });
+    });
+    areaGroups.forEach((group) => {
+      const efficiency = averageFinite(group.lines.map((line) => toNumber4(line.avg_efficiency)));
+      if (efficiency === null) return;
+      const previousEfficiency = averageFinite(group.lines.map((line) => toNumber4(line.previous_avg_efficiency)));
+      const lineCount = group.lines.length;
+      lineRows.push({
+        rowType: "area",
+        id: `area:${group.areaId}`,
+        name: group.areaName,
+        efficiency: roundOne(efficiency),
+        previousEfficiency: previousEfficiency === null ? null : roundOne(previousEfficiency),
+        delta: previousEfficiency === null ? null : roundOne(efficiency - previousEfficiency),
+        supervisor: `${lineCount} ${lineCount === 1 ? "line" : "lines"}`,
+        supervisorImage: null,
+        lineCount,
+        factoryId: group.factoryId,
+        factoryAreaId: group.areaId
+      });
     });
+    return lineRows.sort((left, right) => {
+      if (left.efficiency !== right.efficiency) return left.efficiency - right.efficiency;
+      return left.name.localeCompare(right.name, void 0, { sensitivity: "base", numeric: true });
+    }).slice(0, 3);
   }, [poorestLineMode, snapshot.data.poorest_lines, supervisorsByLineId]);
   const showPoorestModeToggle = !!availableLineModes?.has_output && !!availableLineModes?.has_uptime;
   const poorestMetricLabel = poorestLineMode === "uptime" ? "Uptime" : "Efficiency";
@@ -85136,7 +85387,7 @@ var PoorestPerformersCard = React144__default.memo(({
     ] }),
     /* @__PURE__ */ jsx("div", { className: "flex-1 flex flex-col p-0 overflow-auto", children: /* @__PURE__ */ jsxs("div", { className: "divide-y divide-slate-50 flex-1 px-5", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between py-2", children: [
-        /* @__PURE__ */ jsx("div", { className: "font-semibold text-slate-400 text-[10px] uppercase tracking-wider min-w-[120px]", children: "Line" }),
+        /* @__PURE__ */ jsx("div", { className: "font-semibold text-slate-400 text-[10px] uppercase tracking-wider min-w-[120px]", children: "Line / Area" }),
         /* @__PURE__ */ jsx("div", { className: "font-semibold text-slate-400 text-[10px] uppercase tracking-wider text-left shrink-0 w-[110px] flex items-center justify-between", children: poorestMetricLabel })
       ] }),
       showSnapshotSkeleton ? /* @__PURE__ */ jsx(OverviewListSkeleton, {}) : mergedPoorestLines.length > 0 ? mergedPoorestLines.map((line) => {
@@ -85144,7 +85395,7 @@ var PoorestPerformersCard = React144__default.memo(({
         return /* @__PURE__ */ jsx(
           "div",
           {
-            onClick: () => onLineClick(line.id, line.name),
+            onClick: () => onLineClick(line),
             className: "block py-3 hover:bg-slate-50/50 transition-colors cursor-pointer group relative",
             children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
               /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [
@@ -85155,7 +85406,7 @@ var PoorestPerformersCard = React144__default.memo(({
                     alt: line.supervisor,
                     className: "w-full h-full object-cover"
                   }
-                ) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-[10px] font-bold text-slate-500", children: line.supervisor.split(" ").map((part) => part[0]).join("").slice(0, 2) }) }),
+                ) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-[10px] font-bold text-slate-500", children: (line.rowType === "area" ? line.name : line.supervisor).split(" ").map((part) => part[0]).join("").slice(0, 2) }) }),
                 /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
                   /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx("div", { className: "font-bold text-slate-800 text-[13px] truncate group-hover:text-indigo-600 transition-colors", children: line.name }) }),
                   /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 mt-0.5 flex-wrap", children: /* @__PURE__ */ jsx("span", { className: "text-[10px] text-slate-400 font-medium", children: line.supervisor }) })
@@ -86445,18 +86696,33 @@ var PlantHeadView = () => {
       resolvedOperationalToday
     ]
   );
-  const handleOpenLineDetails = React144__default.useCallback((lineId, lineName) => {
+  const handleOpenLineDetails = React144__default.useCallback((line) => {
     trackCoreEvent("Operations Overview Line Clicked", {
-      line_id: lineId,
-      line_name: lineName,
+      line_id: line.rowType === "line" ? line.id : null,
+      line_name: line.name,
+      row_type: line.rowType,
+      factory_id: line.factoryId ?? null,
+      factory_area_id: line.factoryAreaId ?? null,
       range_start: dateRange.startKey,
       range_end: dateRange.endKey
     });
+    if (line.rowType === "area" && line.factoryId && line.factoryAreaId) {
+      const params = new URLSearchParams({
+        factory_id: line.factoryId,
+        factory_area_id: line.factoryAreaId
+      });
+      navigate(`/kpis?${params.toString()}`);
+      return;
+    }
+    if (line.rowType === "area") {
+      navigate("/kpis");
+      return;
+    }
     if (isLiveScope) {
-      navigate(`/kpis/${lineId}?returnTo=${encodeURIComponent("/")}`);
+      navigate(`/kpis/${line.id}?returnTo=${encodeURIComponent("/")}`);
       return;
     }
-    navigate(buildLineMonthlyHistoryUrl(lineId));
+    navigate(buildLineMonthlyHistoryUrl(line.id));
   }, [buildLineMonthlyHistoryUrl, dateRange.endKey, dateRange.startKey, isLiveScope, navigate]);
   useOperationsOverviewRefresh({
     store,

package/package.json

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