@optifye/dashboard-core 6.10.5 → 6.10.7

package/dist/index.mjs

@@ -13,11 +13,11 @@ import { noop, warning, invariant, progress, secondsToMilliseconds, milliseconds
 import { getValueTransition, hover, press, isPrimaryPointer, GroupPlaybackControls, setDragLock, supportsLinearEasing, attachTimeline, isGenerator, calcGeneratorDuration, isWaapiSupportedEasing, mapEasingToNativeEasing, maxGeneratorDuration, generateLinearEasing, isBezierDefinition } from 'motion-dom';
 import { Camera, ChevronDown, ChevronUp, Check, Map as Map$1, Video, ShieldCheck, Star, Award, ArrowLeft, X, Coffee, Plus, Clock, Calendar, Save, AlertCircle, Loader2, Minus, ArrowDown, ArrowUp, ChevronLeft, ChevronRight, Pause, Play, Wrench, XCircle, Package, UserX, Zap, HelpCircle, AlertTriangle, Tag, Sparkles, TrendingUp, Settings2, CheckCircle2, RefreshCw, TrendingDown, FolderOpen, Folder, Sliders, Activity, Layers, Filter, Search, Edit2, CheckCircle, User, Users, Shield, Building2, Mail, Lock, ArrowRight, Info, Share2, Trophy, Target, Download, Sun, Moon, MousePointer, UserPlus, UserCog, Trash2, Eye, MoreVertical, BarChart3, MessageSquare, Menu, Send, Copy, UserCheck, LogOut, Settings, LifeBuoy, EyeOff, UserCircle } from 'lucide-react';
 import { toast } from 'sonner';
-import { BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, Tooltip, Legend, Bar, LabelList, ResponsiveContainer, LineChart as LineChart$1, Line, PieChart, Pie, Cell, ReferenceLine, ComposedChart, Area, ScatterChart, Scatter } from 'recharts';
+import { BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, ReferenceLine, Tooltip, Legend, Bar, LabelList, ResponsiveContainer, LineChart as LineChart$1, Line, PieChart, Pie, Cell, ComposedChart, Area, ScatterChart, Scatter } from 'recharts';
 import { Slot } from '@radix-ui/react-slot';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { DayPicker, useNavigation as useNavigation$1 } from 'react-day-picker';
-import { XMarkIcon, ArrowRightIcon, HomeIcon, TrophyIcon, ChartBarIcon, AdjustmentsHorizontalIcon, ClockIcon, UsersIcon, TicketIcon, CubeIcon, SparklesIcon, QuestionMarkCircleIcon, HeartIcon, UserCircleIcon, ExclamationCircleIcon, EnvelopeIcon, DocumentTextIcon, ChevronUpIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, Bars3Icon, CheckCircleIcon, ChatBubbleLeftRightIcon, ArrowLeftIcon, LightBulbIcon, CalendarIcon, PlayCircleIcon, FunnelIcon, XCircleIcon, InformationCircleIcon } from '@heroicons/react/24/outline';
+import { XMarkIcon, ArrowRightIcon, HomeIcon, TrophyIcon, ChartBarIcon, LightBulbIcon, AdjustmentsHorizontalIcon, ClockIcon, UsersIcon, TicketIcon, CubeIcon, SparklesIcon, QuestionMarkCircleIcon, HeartIcon, UserCircleIcon, ExclamationCircleIcon, EnvelopeIcon, DocumentTextIcon, ChevronUpIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, Bars3Icon, CheckCircleIcon, ChatBubbleLeftRightIcon, ArrowLeftIcon, XCircleIcon, PlayCircleIcon, InformationCircleIcon } from '@heroicons/react/24/outline';
 import { CheckIcon } from '@heroicons/react/24/solid';
 import html2canvas from 'html2canvas';
 import jsPDF, { jsPDF as jsPDF$1 } from 'jspdf';
@@ -3728,18 +3728,17 @@ var initializeCoreMixpanel = (token, debugOrOptions, trackPageViewArg) => {
     track_pageview: trackPageView ?? true,
     persistence: "localStorage"
   };
-  if (sessionOpts.recordSessionsPercent !== void 0) {
-    initOptions.record_sessions_percent = sessionOpts.recordSessionsPercent;
-  } else {
-    initOptions.record_sessions_percent = 1;
-  }
-  if (sessionOpts.recordIdleTimeoutMs !== void 0) {
-    initOptions.record_idle_timeout_ms = sessionOpts.recordIdleTimeoutMs;
+  const recordSessionsPercent = sessionOpts.recordSessionsPercent ?? 0;
+  initOptions.record_sessions_percent = recordSessionsPercent;
+  const defaultIdleTimeoutMs = 10 * 60 * 1e3;
+  const recordIdleTimeoutMs = sessionOpts.recordIdleTimeoutMs ?? (recordSessionsPercent > 0 ? defaultIdleTimeoutMs : void 0);
+  if (recordIdleTimeoutMs !== void 0) {
+    initOptions.record_idle_timeout_ms = recordIdleTimeoutMs;
   }
   if (sessionOpts.recordHeatmapData !== void 0) {
     initOptions.record_heatmap_data = sessionOpts.recordHeatmapData;
   } else {
-    initOptions.record_heatmap_data = true;
+    initOptions.record_heatmap_data = false;
   }
   if (sessionOpts.recordCanvas !== void 0) {
     initOptions.record_canvas = sessionOpts.recordCanvas;
@@ -3757,7 +3756,9 @@ var initializeCoreMixpanel = (token, debugOrOptions, trackPageViewArg) => {
   });
   mixpanel.init(token, initOptions);
   isMixpanelInitialized = true;
-  console.log("Mixpanel initialized in dashboard-core with Session Replay support.");
+  if (initOptions.debug) {
+    console.log("Mixpanel initialized in dashboard-core.");
+  }
 };
 var trackCorePageView = (pageName, properties) => {
   if (!isMixpanelInitialized) return;
@@ -10301,6 +10302,41 @@ var useRealtimeLineMetrics = ({
     refreshMetrics: fetchData
   }), [metrics2, lineDetails, loading, error, fetchData]);
 };
+var useLines = () => {
+  const supabase = useSupabase();
+  const entityConfig = useEntityConfig();
+  const [lines, setLines] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const fetchLines = useCallback(async () => {
+    if (!supabase) {
+      setLoading(false);
+      return;
+    }
+    try {
+      setLoading(true);
+      let query = supabase.from("lines").select("*").eq("enable", true);
+      if (entityConfig.companyId) {
+        query = query.eq("company_id", entityConfig.companyId);
+      }
+      const { data, error: error2 } = await query;
+      if (error2) throw error2;
+      const sortedLines = (data || []).sort(
+        (a, b) => (a.line_name || "").localeCompare(b.line_name || "")
+      );
+      setLines(sortedLines);
+    } catch (err) {
+      console.error("Error fetching lines:", err);
+      setError(err);
+    } finally {
+      setLoading(false);
+    }
+  }, [supabase, entityConfig.companyId]);
+  useEffect(() => {
+    fetchLines();
+  }, [fetchLines]);
+  return { lines, loading, error, refetch: fetchLines };
+};
 var useTargets = (options) => {
   const { companyId } = useEntityConfig();
   const supabase = useSupabase();
@@ -12434,41 +12470,6 @@ function useClipTypesWithCounts(workspaceId, date, shiftId, totalOutput, options
     counts
   };
 }
-var useLines = () => {
-  const supabase = useSupabase();
-  const entityConfig = useEntityConfig();
-  const [lines, setLines] = useState([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState(null);
-  const fetchLines = useCallback(async () => {
-    if (!supabase) {
-      setLoading(false);
-      return;
-    }
-    try {
-      setLoading(true);
-      let query = supabase.from("lines").select("*").eq("enable", true);
-      if (entityConfig.companyId) {
-        query = query.eq("company_id", entityConfig.companyId);
-      }
-      const { data, error: error2 } = await query;
-      if (error2) throw error2;
-      const sortedLines = (data || []).sort(
-        (a, b) => (a.line_name || "").localeCompare(b.line_name || "")
-      );
-      setLines(sortedLines);
-    } catch (err) {
-      console.error("Error fetching lines:", err);
-      setError(err);
-    } finally {
-      setLoading(false);
-    }
-  }, [supabase, entityConfig.companyId]);
-  useEffect(() => {
-    fetchLines();
-  }, [fetchLines]);
-  return { lines, loading, error, refetch: fetchLines };
-};
 var MAX_RETRIES = 10;
 var RETRY_DELAY = 500;
 function useNavigation(customNavigate) {
@@ -25323,6 +25324,7 @@ var DEFAULT_BAR_RADIUS = [4, 4, 0, 0];
 var BarChartComponent = ({
   data,
   bars,
+  referenceLines,
   xAxisDataKey = "name",
   xAxisLabel,
   yAxisLabel,
@@ -25406,6 +25408,22 @@ var BarChartComponent = ({
         stroke: axisStrokeColor
       }
     ),
+    referenceLines?.map((line, idx) => /* @__PURE__ */ jsx(
+      ReferenceLine,
+      {
+        y: line.y,
+        stroke: line.stroke || axisStrokeColor,
+        strokeDasharray: line.strokeDasharray || "4 4",
+        strokeWidth: line.strokeWidth,
+        label: line.label ? {
+          value: line.label,
+          position: "insideTopRight",
+          fill: line.stroke || axisTickFillColor,
+          fontSize: 12
+        } : void 0
+      },
+      `ref-line-${idx}`
+    )),
     showTooltip && /* @__PURE__ */ jsx(Tooltip, { formatter: tooltipFormatter || defaultTooltipFormatter, cursor: { fill: "transparent" } }),
     showLegend && /* @__PURE__ */ jsx(Legend, { payload: legendPayload }),
     bars.map((barConfig, index) => /* @__PURE__ */ jsx(
@@ -25441,7 +25459,7 @@ var BarChartComponent = ({
   return /* @__PURE__ */ jsx("div", { className: clsx("w-full", className), children: chartContent });
 };
 var BarChart = React24__default.memo(BarChartComponent, (prevProps, nextProps) => {
-  if (prevProps.xAxisDataKey !== nextProps.xAxisDataKey || prevProps.xAxisLabel !== nextProps.xAxisLabel || prevProps.yAxisLabel !== nextProps.yAxisLabel || prevProps.yAxisUnit !== nextProps.yAxisUnit || prevProps.layout !== nextProps.layout || prevProps.className !== nextProps.className || prevProps.showGrid !== nextProps.showGrid || prevProps.showLegend !== nextProps.showLegend || prevProps.showTooltip !== nextProps.showTooltip || prevProps.responsive !== nextProps.responsive || prevProps.aspect !== nextProps.aspect) {
+  if (prevProps.xAxisDataKey !== nextProps.xAxisDataKey || prevProps.xAxisLabel !== nextProps.xAxisLabel || prevProps.yAxisLabel !== nextProps.yAxisLabel || prevProps.yAxisUnit !== nextProps.yAxisUnit || JSON.stringify(prevProps.referenceLines || []) !== JSON.stringify(nextProps.referenceLines || []) || prevProps.layout !== nextProps.layout || prevProps.className !== nextProps.className || prevProps.showGrid !== nextProps.showGrid || prevProps.showLegend !== nextProps.showLegend || prevProps.showTooltip !== nextProps.showTooltip || prevProps.responsive !== nextProps.responsive || prevProps.aspect !== nextProps.aspect) {
     return false;
   }
   if (prevProps.data.length !== nextProps.data.length) {
@@ -28969,6 +28987,33 @@ var VideoControls = ({
     }
   );
 };
+
+// src/lib/utils/r2Detection.ts
+function isR2WorkerUrl(url, r2WorkerDomain) {
+  if (!url || !r2WorkerDomain) return false;
+  try {
+    const workerDomain = new URL(r2WorkerDomain).hostname;
+    return url.includes(workerDomain);
+  } catch {
+    return url.includes(r2WorkerDomain.replace(/https?:\/\//, ""));
+  }
+}
+
+// src/lib/services/hlsAuthService.ts
+async function getAuthTokenForHls(supabase) {
+  try {
+    const { data: { session } } = await supabase.auth.getSession();
+    if (!session?.access_token) {
+      console.warn("[HLS Auth] No active session, R2 streaming may fail");
+      return null;
+    }
+    console.log("[HLS Auth] Retrieved token for HLS.js requests");
+    return session.access_token;
+  } catch (error) {
+    console.error("[HLS Auth] Error getting auth token:", error);
+    return null;
+  }
+}
 var ERROR_MAPPING = {
   "networkError": {
     code: 2,
@@ -28995,6 +29040,38 @@ var ERROR_MAPPING = {
     canRetry: false
   }
 };
+var CLIP_ID_COMMENT_REGEX = /#\s*Clip ID:\s*([a-f0-9-]+)/i;
+var PLAYLIST_PROXY_REGEX = /\/api\/clips\/playlist\/([a-f0-9-]+)/i;
+var R2_FALLBACK_DETAILS = /* @__PURE__ */ new Set([
+  "fragLoadError",
+  "fragLoadHTTPError",
+  "manifestLoadError",
+  "levelLoadError",
+  "keyLoadError"
+]);
+var extractClipIdFromSource = (source) => {
+  if (!source) return null;
+  const commentMatch = source.match(CLIP_ID_COMMENT_REGEX);
+  if (commentMatch) return commentMatch[1];
+  const urlMatch = source.match(PLAYLIST_PROXY_REGEX);
+  if (urlMatch) return urlMatch[1];
+  return null;
+};
+var ensureClipIdComment = (playlist, clipId) => {
+  if (!playlist || playlist.includes(`# Clip ID: ${clipId}`) || CLIP_ID_COMMENT_REGEX.test(playlist)) {
+    return playlist;
+  }
+  const lines = playlist.split("\n");
+  if (lines.length === 0) return playlist;
+  return [lines[0], `# Clip ID: ${clipId}`, ...lines.slice(1)].join("\n");
+};
+var getHlsErrorUrl = (data) => {
+  return data?.frag?.url || data?.response?.url || data?.context?.url || data?.networkDetails?.response?.url || data?.url;
+};
+var getHlsErrorStatus = (data) => {
+  const status = data?.response?.code ?? data?.response?.status ?? data?.networkDetails?.status ?? data?.networkDetails?.response?.status;
+  return typeof status === "number" ? status : void 0;
+};
 var hlsVideoPlayerStyles = `
   .hls-video-player-container {
     width: 100%;
@@ -29091,12 +29168,17 @@ var HlsVideoPlayer = forwardRef(({
   onSeeked,
   onClick
 }, ref) => {
+  const supabase = useSupabase();
   const videoContainerRef = useRef(null);
   const videoRef = useRef(null);
   const hlsRef = useRef(null);
   const blobUrlRef = useRef(null);
+  const clipIdRef = useRef(null);
+  const r2FallbackAttemptedRef = useRef(false);
   const [isReady, setIsReady] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
+  const [overrideSource, setOverrideSource] = useState(null);
+  const effectiveSrc = overrideSource && overrideSource.baseSrc === src ? overrideSource.value : src;
   const [showControls, setShowControls] = useState(true);
   const [controlsPinned, setControlsPinned] = useState(false);
   const [isPlaying, setIsPlaying] = useState(false);
@@ -29156,10 +29238,16 @@ var HlsVideoPlayer = forwardRef(({
     onSeeked,
     onLoadingChange
   ]);
+  useEffect(() => {
+    clipIdRef.current = extractClipIdFromSource(src);
+    r2FallbackAttemptedRef.current = false;
+    setOverrideSource(null);
+  }, [src]);
   const stableHlsConfigRef = useRef(hlsConfig);
   const stableOptionsRef = useRef(options);
   const configSignatureRef = useRef("");
   const [configVersion, setConfigVersion] = useState(0);
+  const r2WorkerDomain = process.env.NEXT_PUBLIC_R2_WORKER_DOMAIN || "https://r2-stream-proxy.optifye-r2.workers.dev";
   useEffect(() => {
     const serialized = JSON.stringify({
       hlsConfig: hlsConfig || null,
@@ -29178,6 +29266,50 @@ var HlsVideoPlayer = forwardRef(({
       setConfigVersion((prev) => prev + 1);
     }
   }, [hlsConfig, options]);
+  const attemptS3Fallback = useCallback(async (mode, reason, errorUrl) => {
+    if (r2FallbackAttemptedRef.current) return false;
+    const clipId = clipIdRef.current || extractClipIdFromSource(effectiveSrc);
+    if (!clipId) {
+      console.warn(`[HlsVideoPlayer] R2 fallback skipped - no clip ID (${reason})`);
+      return false;
+    }
+    r2FallbackAttemptedRef.current = true;
+    if (mode === "url") {
+      const fallbackUrl = `/api/clips/playlist/${clipId}?source=s3`;
+      console.warn(`[HlsVideoPlayer] Switching to S3 playlist URL (${reason})`, { errorUrl, clipId });
+      setOverrideSource({ baseSrc: src, value: fallbackUrl });
+      return true;
+    }
+    try {
+      console.warn(`[HlsVideoPlayer] Fetching S3 playlist (${reason})`, { errorUrl, clipId });
+      const response = await fetch(`/api/clips/playlist/${clipId}?source=s3`);
+      if (!response.ok) {
+        console.warn("[HlsVideoPlayer] S3 playlist fetch failed", { status: response.status, clipId });
+        return false;
+      }
+      let playlistText = await response.text();
+      playlistText = ensureClipIdComment(playlistText, clipId);
+      setOverrideSource({ baseSrc: src, value: playlistText });
+      return true;
+    } catch (error) {
+      console.error("[HlsVideoPlayer] S3 fallback failed", error);
+      return false;
+    }
+  }, [effectiveSrc, src]);
+  const maybeHandleR2Fallback = useCallback((data) => {
+    const errorUrl = getHlsErrorUrl(data);
+    if (!errorUrl || !isR2WorkerUrl(errorUrl, r2WorkerDomain)) {
+      return false;
+    }
+    const status = getHlsErrorStatus(data);
+    const details = data?.details;
+    const shouldFallback = R2_FALLBACK_DETAILS.has(details) || typeof status === "number" && status >= 400 && status < 500;
+    if (!shouldFallback) {
+      return false;
+    }
+    attemptS3Fallback("playlist", `HLS.js ${details || data?.type || "error"}`, errorUrl);
+    return true;
+  }, [attemptS3Fallback, r2WorkerDomain]);
   const cleanupBlobUrl = useCallback(() => {
     if (blobUrlRef.current) {
       URL.revokeObjectURL(blobUrlRef.current);
@@ -29218,36 +29350,56 @@ var HlsVideoPlayer = forwardRef(({
       dispose: () => dispose()
     };
   }, [dispose]);
-  const initializePlayer = useCallback(() => {
-    if (!videoRef.current || !src) return;
+  const initializePlayer = useCallback(async () => {
+    if (!videoRef.current || !effectiveSrc) return;
     const video = videoRef.current;
     const player = playerLikeObject();
+    let authToken = null;
+    try {
+      authToken = await getAuthTokenForHls(supabase);
+      if (!authToken) {
+        console.warn("[HLS Auth] No active session - R2 streaming may fail");
+      }
+    } catch (error) {
+      console.error("[HLS Auth] Error getting auth token:", error);
+    }
     const mergedHlsConfig = {
       ...BASE_HLS_CONFIG,
       ...stableHlsConfigRef.current || {},
-      ...stableOptionsRef.current || {}
+      ...stableOptionsRef.current || {},
+      // Modern HLS.js uses Fetch API - override fetch to add Authorization header for R2 Worker requests
+      fetchSetup: function(context, initParams) {
+        const url = context.url;
+        if (isR2WorkerUrl(url, r2WorkerDomain) && authToken) {
+          initParams.headers = {
+            ...initParams.headers,
+            "Authorization": `Bearer ${authToken}`
+          };
+        }
+        return new Request(url, initParams);
+      }
     };
     cleanupBlobUrl();
-    const isHLS = src.endsWith(".m3u8") || src.startsWith("#EXTM3U");
+    const isHLS = effectiveSrc.endsWith(".m3u8") || effectiveSrc.startsWith("#EXTM3U");
     if (isHLS) {
-      if (src.startsWith("#EXTM3U")) {
+      if (effectiveSrc.startsWith("#EXTM3U")) {
         const safariMode = isSafari();
         const browserName = getBrowserName();
         if (safariMode) {
-          const clipIdMatch = src.match(/# Clip ID: ([a-f0-9-]+)/i);
+          const clipIdMatch = effectiveSrc.match(/# Clip ID: ([a-f0-9-]+)/i);
           if (clipIdMatch) {
             const proxyUrl = `/api/clips/playlist/${clipIdMatch[1]}`;
             console.log(`[HlsVideoPlayer] Safari detected (${browserName}) - using playlist proxy URL:`, proxyUrl);
             video.src = proxyUrl;
           } else {
             console.warn("[HlsVideoPlayer] Safari detected but no clip ID found in playlist, trying blob URL fallback");
-            const blob = new Blob([src], { type: "application/vnd.apple.mpegurl" });
+            const blob = new Blob([effectiveSrc], { type: "application/vnd.apple.mpegurl" });
             const blobUrl = URL.createObjectURL(blob);
             blobUrlRef.current = blobUrl;
             video.src = blobUrl;
           }
         } else if (Hls3.isSupported()) {
-          const blob = new Blob([src], { type: "application/vnd.apple.mpegurl" });
+          const blob = new Blob([effectiveSrc], { type: "application/vnd.apple.mpegurl" });
           const blobUrl = URL.createObjectURL(blob);
           blobUrlRef.current = blobUrl;
           console.log(`[HlsVideoPlayer] Non-Safari browser (${browserName}) - using HLS.js with blob URL`);
@@ -29260,6 +29412,9 @@ var HlsVideoPlayer = forwardRef(({
           });
           hls.on(Events.ERROR, (event, data) => {
             console.error("[HlsVideoPlayer] HLS.js error:", data);
+            if (maybeHandleR2Fallback(data)) {
+              return;
+            }
             if (data.fatal) {
               let errorInfo;
               switch (data.type) {
@@ -29307,6 +29462,9 @@ var HlsVideoPlayer = forwardRef(({
           });
           hls.on(Events.ERROR, (event, data) => {
             console.error("[HlsVideoPlayer] HLS.js error:", data);
+            if (maybeHandleR2Fallback(data)) {
+              return;
+            }
             if (data.fatal) {
               let errorInfo;
               switch (data.type) {
@@ -29326,14 +29484,14 @@ var HlsVideoPlayer = forwardRef(({
               eventCallbacksRef.current.onError?.(player, errorInfo);
             }
           });
-          hls.loadSource(src);
+          hls.loadSource(effectiveSrc);
           hls.attachMedia(video);
         } else {
-          video.src = src;
+          video.src = effectiveSrc;
         }
       }
     } else {
-      video.src = src;
+      video.src = effectiveSrc;
     }
     const handleCanPlay = () => {
       if (!hlsRef.current) {
@@ -29409,6 +29567,11 @@ var HlsVideoPlayer = forwardRef(({
       eventCallbacksRef.current.onSeeked?.(player);
     };
     const handleError = () => {
+      const currentSrc = video.currentSrc || video.src;
+      if (isSafari() && currentSrc.includes("/api/clips/playlist/") && !currentSrc.includes("source=s3") && !r2FallbackAttemptedRef.current) {
+        attemptS3Fallback("url", "native playback error", currentSrc);
+        return;
+      }
       const error = video.error;
       if (error) {
         const errorInfo = {
@@ -29457,13 +29620,20 @@ var HlsVideoPlayer = forwardRef(({
       video.removeEventListener("ratechange", handlePlaybackRateChange2);
     };
   }, [
-    src,
+    effectiveSrc,
     cleanupBlobUrl,
     playerLikeObject,
-    configVersion
+    configVersion,
+    supabase,
+    attemptS3Fallback,
+    maybeHandleR2Fallback,
+    r2WorkerDomain
   ]);
   useEffect(() => {
-    const cleanup = initializePlayer();
+    let cleanup;
+    initializePlayer().then((cleanupFn) => {
+      cleanup = cleanupFn;
+    });
     return () => {
       cleanup?.();
       if (hlsRef.current) {
@@ -29473,7 +29643,7 @@ var HlsVideoPlayer = forwardRef(({
       cleanupBlobUrl();
       setIsReady(false);
     };
-  }, [src, initializePlayer, cleanupBlobUrl]);
+  }, [effectiveSrc, initializePlayer, cleanupBlobUrl]);
   useEffect(() => {
     if (videoRef.current) {
       if (autoplay) {
@@ -31670,6 +31840,30 @@ var FileManagerFilters = ({
     if (node.type === "category" || node.type === "percentile-category") {
       toggleExpanded(node.id);
       onFilterChange(node.id);
+      if (node.id === "fast-cycles") {
+        trackCoreEvent("Fast Clips Clicked", {
+          workspaceId,
+          date,
+          shift,
+          count: node.count || 0,
+          percentile: filterState.percentile
+        });
+      } else if (node.id === "slow-cycles") {
+        trackCoreEvent("Slow Clips Clicked", {
+          workspaceId,
+          date,
+          shift,
+          count: node.count || 0,
+          percentile: filterState.percentile
+        });
+      } else if (node.id === "cycle_completion") {
+        trackCoreEvent("Cycle Completions Clicked", {
+          workspaceId,
+          date,
+          shift,
+          count: node.count || 0
+        });
+      }
       if (node.id !== "idle_time" && idleLabelFilter) {
         setIdleLabelFilter(null);
       }
@@ -36279,7 +36473,16 @@ var STATIC_COLORS = {
   "Operator Idle": "#8b5cf6"
   // violet-500 - Low Priority/Behavioral
 };
+var PRODUCTIVE_COLOR = "#00AB45";
+var IDLE_COLOR = "#e5e7eb";
 var getColorForEntry = (name, index) => {
+  const normalized = name.trim().toLowerCase();
+  if (normalized === "productive" || normalized === "productive time") {
+    return PRODUCTIVE_COLOR;
+  }
+  if (normalized === "idle" || normalized === "idle time") {
+    return IDLE_COLOR;
+  }
   if (STATIC_COLORS[name]) {
     return STATIC_COLORS[name];
   }
@@ -36423,6 +36626,7 @@ var IdleTimeReasonChart = ({
     )
   ] });
 };
+var IdleTimeReasonChart_default = IdleTimeReasonChart;
 var DEFAULT_PERFORMANCE_DATA = {
   avg_efficiency: 0,
   underperforming_workspaces: 0,
@@ -37184,11 +37388,6 @@ var LinePdfGenerator = ({
       doc.setLineWidth(0.8);
       doc.line(20, 118, 190, 118);
       const hourlyOverviewStartY = 123;
-      doc.setFontSize(18);
-      doc.setFont("helvetica", "bold");
-      doc.setTextColor(40, 40, 40);
-      doc.text("Hourly Output Overview", 20, 133);
-      doc.setTextColor(0, 0, 0);
       const getHourlyTimeRanges = (startTimeStr, endTimeStr) => {
         const [hours, minutes] = startTimeStr.split(":");
         const startHour = parseInt(hours);
@@ -37379,23 +37578,43 @@ var LinePdfGenerator = ({
           return Math.round(lineInfo.metrics.current_output / shiftDuration);
         });
       }
-      const tableHeaderY = 143;
-      const tableStartY = 151;
+      const tableHeaderY = 146;
+      const tableStartY = 153;
       const rowSpacing = 8;
       const bottomPadding = 8;
       const hourlyTableHeight = hourlyTimeRanges.length * rowSpacing;
       const backgroundHeight = tableStartY - hourlyOverviewStartY + hourlyTableHeight + bottomPadding;
       doc.setFillColor(245, 245, 245);
       doc.roundedRect(15, hourlyOverviewStartY, 180, backgroundHeight, 3, 3, "F");
+      doc.setFontSize(18);
+      doc.setFont("helvetica", "bold");
+      doc.setTextColor(40, 40, 40);
+      doc.text("Hourly Performance", 20, 133);
+      doc.setTextColor(0, 0, 0);
+      const gridTopY = 139;
+      const headerBottomY = 148;
+      const colBoundaries = [20, 70, 100, 130, 155, 190];
+      const totalRows = hourlyTimeRanges.length;
+      const gridBottomY = headerBottomY + totalRows * rowSpacing;
+      const tableHeight = gridBottomY - gridTopY;
+      doc.setFillColor(255, 255, 255);
+      doc.roundedRect(20, gridTopY, 170, tableHeight, 2, 2, "F");
+      doc.setDrawColor(230, 230, 230);
+      doc.setLineWidth(0.2);
+      doc.roundedRect(20, gridTopY, 170, tableHeight, 2, 2, "S");
+      doc.setDrawColor(200, 200, 200);
+      doc.setLineWidth(0.3);
+      doc.line(20, headerBottomY, 190, headerBottomY);
+      colBoundaries.slice(1, -1).forEach((x) => {
+        doc.line(x, gridTopY, x, gridBottomY);
+      });
       doc.setFontSize(11);
       doc.setFont("helvetica", "bold");
       doc.text("Time Range", 25, tableHeaderY);
-      doc.text("Output", 80, tableHeaderY);
-      doc.text("Target", 125, tableHeaderY);
-      doc.text("Status", 170, tableHeaderY);
-      doc.setLineWidth(0.3);
-      doc.setDrawColor(200, 200, 200);
-      doc.line(20, 146, 190, 146);
+      doc.text("Output", 75, tableHeaderY);
+      doc.text("Target", 105, tableHeaderY);
+      doc.text("Status", 135, tableHeaderY);
+      doc.text("Remarks", 160, tableHeaderY);
       doc.setFont("helvetica", "normal");
       let yPos = tableStartY;
       const lineDateForTable = new Date(lineInfo.date);
@@ -37417,20 +37636,25 @@ var LinePdfGenerator = ({
         const dataCollected = !isTodayForTable || hourNumber < currentHour;
         const outputStr = dataCollected ? actualOutput.toString() : "TBD";
         const targetStr = targetOutputPerHour.toString();
+        if (index < totalRows - 1) {
+          const rowBottomY = headerBottomY + (index + 1) * rowSpacing;
+          doc.setDrawColor(200, 200, 200);
+          doc.line(20, rowBottomY, 190, rowBottomY);
+        }
         doc.text(timeRange, 25, yPos);
-        doc.text(outputStr, 80, yPos);
-        doc.text(targetStr, 125, yPos);
+        doc.text(outputStr, 75, yPos);
+        doc.text(targetStr, 105, yPos);
         if (!dataCollected) {
           doc.setTextColor(100, 100, 100);
-          doc.text("-", 170, yPos);
+          doc.text("-", 135, yPos);
         } else if (actualOutput >= targetOutputPerHour) {
           doc.setTextColor(0, 171, 69);
           doc.setFont("ZapfDingbats", "normal");
-          doc.text("4", 170, yPos);
+          doc.text("4", 135, yPos);
           doc.setFont("helvetica", "normal");
         } else {
           doc.setTextColor(227, 67, 41);
-          doc.text("\xD7", 170, yPos);
+          doc.text("\xD7", 135, yPos);
         }
         doc.setTextColor(0, 0, 0);
         yPos += rowSpacing;
@@ -37438,7 +37662,7 @@ var LinePdfGenerator = ({
       doc.addPage();
       yPos = addHeaderPage2();
       const workspaceSectionStartY = yPos;
-      const sortedWorkspaces = [...workspaceData].sort((a, b) => (a.efficiency || 0) - (b.efficiency || 0)).slice(0, 10);
+      const sortedWorkspaces = [...workspaceData].sort((a, b) => (a.efficiency || 0) - (b.efficiency || 0)).slice(0, 3);
       const wsRowCount = sortedWorkspaces.length > 0 ? sortedWorkspaces.length : 1;
       const wsTableHeight = 10 + 8 + 7 + wsRowCount * 8 + 8;
       doc.setFillColor(245, 245, 245);
@@ -37446,28 +37670,45 @@ var LinePdfGenerator = ({
       doc.setFontSize(18);
       doc.setFont("helvetica", "bold");
       doc.setTextColor(40, 40, 40);
-      doc.text("Poorest Performing Workspaces", 20, yPos);
+      doc.text("Poorest Performing Workspaces", 20, yPos + 10);
       doc.setTextColor(0, 0, 0);
-      yPos += 10;
+      yPos += 20;
+      const wsGridTopY = yPos - 5;
+      const wsHeaderBottomY = wsGridTopY + 8;
+      const wsColBoundaries = [20, 80, 140, 190];
+      const wsGridBottomY = wsHeaderBottomY + wsRowCount * 8;
+      const wsTableTotalHeight = wsGridBottomY - wsGridTopY;
+      doc.setFillColor(255, 255, 255);
+      doc.roundedRect(20, wsGridTopY, 170, wsTableTotalHeight, 2, 2, "F");
+      doc.setDrawColor(230, 230, 230);
+      doc.setLineWidth(0.2);
+      doc.roundedRect(20, wsGridTopY, 170, wsTableTotalHeight, 2, 2, "S");
+      doc.setDrawColor(200, 200, 200);
+      doc.setLineWidth(0.3);
+      doc.line(20, wsHeaderBottomY, 190, wsHeaderBottomY);
+      wsColBoundaries.slice(1, -1).forEach((x) => {
+        doc.line(x, wsGridTopY, x, wsGridBottomY);
+      });
       doc.setFontSize(11);
       doc.setFont("helvetica", "bold");
-      yPos += 5;
+      yPos = wsGridTopY + 5.5;
       doc.text("Workspace", 25, yPos);
       doc.text("Current/Target", 85, yPos);
       doc.text("Efficiency", 145, yPos);
-      yPos += 3;
-      doc.setLineWidth(0.3);
-      doc.setDrawColor(200, 200, 200);
-      doc.line(20, yPos, 190, yPos);
       doc.setFont("helvetica", "normal");
-      yPos += 7;
+      yPos = wsHeaderBottomY + 5.5;
       if (sortedWorkspaces.length === 0) {
         doc.text("No workspace data available", 25, yPos);
-        yPos += 10;
+        yPos += 8;
       } else {
         sortedWorkspaces.forEach((ws, index) => {
           const workspaceName = getWorkspaceDisplayName(ws.workspace_name, lineInfo.line_id);
           const truncatedName = workspaceName.length > 25 ? workspaceName.substring(0, 22) + "..." : workspaceName;
+          if (index < wsRowCount - 1) {
+            const rowBottomY = wsHeaderBottomY + (index + 1) * 8;
+            doc.setDrawColor(200, 200, 200);
+            doc.line(20, rowBottomY, 190, rowBottomY);
+          }
           doc.text(truncatedName, 25, yPos);
           doc.text(`${ws.action_count || 0} / ${ws.action_threshold || 0}`, 85, yPos);
           doc.text(`${(ws.efficiency || 0).toFixed(1)}%`, 145, yPos);
@@ -38810,18 +39051,27 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons }) => {
       const hourlyTitleY = hasIdleTimeReason ? 198 : 188;
       doc.text("Hourly Performance", 20, hourlyTitleY);
       doc.setTextColor(0, 0, 0);
-      doc.setFontSize(headerFontSize);
-      doc.setFont("helvetica", "bold");
       const baseHeaderY = hasIdleTimeReason ? 208 : 198;
       const headerY = titleFontSize === 16 ? hasIdleTimeReason ? 206 : 196 : baseHeaderY;
-      doc.text("Time Range", 25, headerY);
-      doc.text("Output", 95, headerY);
-      doc.text("Target", 135, headerY);
-      doc.text("Status", 170, headerY);
-      doc.setLineWidth(0.3);
+      const gridTopY = headerY - 5;
+      const headerBottomY = gridTopY + 8;
+      const colBoundaries = [20, 70, 100, 130, 155, 190];
+      const totalRows = hourlyData.length;
+      const gridBottomY = headerBottomY + totalRows * rowHeight;
       doc.setDrawColor(200, 200, 200);
-      const separatorY = headerY + 3;
-      doc.line(20, separatorY, 190, separatorY);
+      doc.setLineWidth(0.3);
+      doc.line(20, gridTopY, 190, gridTopY);
+      doc.line(20, headerBottomY, 190, headerBottomY);
+      colBoundaries.forEach((x) => {
+        doc.line(x, gridTopY, x, gridBottomY);
+      });
+      doc.setFontSize(headerFontSize);
+      doc.setFont("helvetica", "bold");
+      doc.text("Time Range", 25, headerY);
+      doc.text("Output", 75, headerY);
+      doc.text("Target", 105, headerY);
+      doc.text("Status", 135, headerY);
+      doc.text("Remarks", 160, headerY);
       doc.setFontSize(contentFontSize);
       doc.setFont("helvetica", "normal");
       let yPos = tableStartY;
@@ -38852,20 +39102,23 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons }) => {
         const dataCollected = !isToday2 || hourNumber < currentHour;
         const outputStr = dataCollected ? output.toString() : "TBD";
         const targetStr = hourlyTarget.toString();
+        const rowBottomY = headerBottomY + (index + 1) * rowHeight;
+        doc.setDrawColor(200, 200, 200);
+        doc.line(20, rowBottomY, 190, rowBottomY);
         doc.text(timeRange, 25, yPos);
-        doc.text(outputStr, 95, yPos);
-        doc.text(targetStr, 135, yPos);
+        doc.text(outputStr, 75, yPos);
+        doc.text(targetStr, 105, yPos);
         if (!dataCollected) {
           doc.setTextColor(100, 100, 100);
-          doc.text("-", 170, yPos);
+          doc.text("-", 135, yPos);
         } else if (output >= hourlyTarget) {
           doc.setTextColor(0, 171, 69);
           doc.setFont("ZapfDingbats", "normal");
-          doc.text("4", 170, yPos);
+          doc.text("4", 135, yPos);
           doc.setFont("helvetica", "normal");
         } else {
           doc.setTextColor(227, 67, 41);
-          doc.text("\xD7", 170, yPos);
+          doc.text("\xD7", 135, yPos);
         }
         doc.setTextColor(0, 0, 0);
         yPos += rowHeight;
@@ -39671,14 +39924,16 @@ var KPICard = ({
           "uppercase tracking-wide sm:tracking-wider"
         ), children: title }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-0.5 sm:gap-2 flex-wrap", children: [
-          /* @__PURE__ */ jsx("span", { className: clsx(
-            "font-bold text-gray-900 dark:text-gray-50",
-            "text-base sm:text-xl md:text-2xl"
-          ), children: isLoading ? "\u2014" : formattedValue }),
-          suffix && !isLoading && /* @__PURE__ */ jsx("span", { className: clsx(
-            "font-medium text-gray-600 dark:text-gray-300",
-            style.compact ? "text-base" : "text-lg"
-          ), children: suffix }),
+          isLoading ? /* @__PURE__ */ jsx("div", { className: "h-5 sm:h-6 md:h-7 w-12 sm:w-16 md:w-20 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: clsx(
+              "font-bold text-gray-900 dark:text-gray-50",
+              "text-base sm:text-xl md:text-2xl"
+            ), children: formattedValue }),
+            suffix && /* @__PURE__ */ jsx("span", { className: clsx(
+              "font-medium text-gray-600 dark:text-gray-300",
+              style.compact ? "text-base" : "text-lg"
+            ), children: suffix })
+          ] }),
           !isLoading && trendInfo.shouldShowTrend && trendInfo.trendValue !== "neutral" && title !== "Output" && /* @__PURE__ */ jsx("span", { className: trendInfo.colorClass, children: /* @__PURE__ */ jsx(
             trendInfo.Icon,
             {
@@ -39837,6 +40092,7 @@ var KPIHeader = ({
 };
 var KPISection = memo(({
   kpis,
+  isLoading = false,
   className,
   layout: layout2 = "row",
   gridColumns,
@@ -39845,7 +40101,8 @@ var KPISection = memo(({
   compactCards = false,
   useSrcLayout = false
 }) => {
-  const outputDifference = kpis.outputProgress.current - kpis.outputProgress.idealOutput;
+  const showSkeleton = isLoading || !kpis;
+  const outputDifference = kpis ? kpis.outputProgress.current - kpis.outputProgress.idealOutput : 0;
   const outputIsOnTarget = outputDifference >= 0;
   if (useSrcLayout) {
     return /* @__PURE__ */ jsxs(
@@ -39862,27 +40119,30 @@ var KPISection = memo(({
             KPICard,
             {
               title: "Underperforming",
-              value: "2/3",
-              change: 0
+              value: showSkeleton ? "" : "2/3",
+              change: 0,
+              isLoading: showSkeleton
             }
           ) }),
           /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: /* @__PURE__ */ jsx(
             KPICard,
             {
               title: "Efficiency",
-              value: kpis.efficiency.value,
-              change: kpis.efficiency.change,
-              suffix: "%"
+              value: showSkeleton ? "" : kpis.efficiency.value,
+              change: showSkeleton ? 0 : kpis.efficiency.change,
+              suffix: "%",
+              isLoading: showSkeleton
             }
           ) }),
           /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: /* @__PURE__ */ jsx(
             KPICard,
             {
               title: "Output Progress",
-              value: `${kpis.outputProgress.current}/${kpis.outputProgress.target}`,
-              change: kpis.outputProgress.change,
+              value: showSkeleton ? "" : `${kpis.outputProgress.current}/${kpis.outputProgress.target}`,
+              change: showSkeleton ? 0 : kpis.outputProgress.change,
               outputDifference,
-              showOutputDetails: true
+              showOutputDetails: !showSkeleton,
+              isLoading: showSkeleton
             }
           ) })
         ]
@@ -39893,34 +40153,30 @@ var KPISection = memo(({
     {
       key: "underperforming",
       title: "Underperforming",
-      value: `${kpis.underperformingWorkers.current}/${kpis.underperformingWorkers.total}`,
-      change: kpis.underperformingWorkers.change
+      value: showSkeleton ? "" : `${kpis.underperformingWorkers.current}/${kpis.underperformingWorkers.total}`,
+      change: showSkeleton ? 0 : kpis.underperformingWorkers.change,
+      suffix: void 0,
+      status: void 0
     },
     {
       key: "efficiency",
       title: "Efficiency",
-      value: kpis.efficiency.value,
-      change: kpis.efficiency.change,
-      suffix: "%"
+      value: showSkeleton ? "" : kpis.efficiency.value,
+      change: showSkeleton ? 0 : kpis.efficiency.change,
+      suffix: "%",
+      status: void 0
     },
     {
       key: "outputProgress",
       title: "Output Progress",
-      value: `${kpis.outputProgress.current}/${kpis.outputProgress.target}`,
-      change: kpis.outputProgress.change,
-      status: {
+      value: showSkeleton ? "" : `${kpis.outputProgress.current}/${kpis.outputProgress.target}`,
+      change: showSkeleton ? 0 : kpis.outputProgress.change,
+      suffix: void 0,
+      status: showSkeleton ? void 0 : {
         tooltipText: outputIsOnTarget ? "On Target" : "Off Target",
         positive: outputIsOnTarget
       }
     }
-    // Only include these additional KPIs if not using the src layout
-    // ...(kpis.qualityCompliance ? [{
-    //   key: 'qualityCompliance',
-    //   title: 'Quality Compliance',
-    //   value: kpis.qualityCompliance.value,
-    //   change: kpis.qualityCompliance.change,
-    //   suffix: '%',
-    // }] : []),
   ];
   return /* @__PURE__ */ jsx(
     KPIGrid,
@@ -39937,7 +40193,8 @@ var KPISection = memo(({
           change: kpi.change,
           suffix: kpi.suffix,
           status: kpi.status,
-          style: { variant: cardVariant, compact: compactCards }
+          style: { variant: cardVariant, compact: compactCards },
+          isLoading: showSkeleton
         },
         kpi.key
       ))
@@ -39946,6 +40203,9 @@ var KPISection = memo(({
 }, (prevProps, nextProps) => {
   const prevKpis = prevProps.kpis;
   const nextKpis = nextProps.kpis;
+  if (prevProps.isLoading !== nextProps.isLoading) return false;
+  if (!prevKpis && !nextKpis) return true;
+  if (!prevKpis || !nextKpis) return false;
   if (prevKpis === nextKpis) return true;
   if (Math.abs(prevKpis.efficiency.value - nextKpis.efficiency.value) >= 0.5) return false;
   if (prevKpis.underperformingWorkers.current !== nextKpis.underperformingWorkers.current || prevKpis.underperformingWorkers.total !== nextKpis.underperformingWorkers.total) return false;
@@ -41284,6 +41544,17 @@ var SideNavBar = memo(({
     });
     onMobileMenuClose?.();
   }, [navigate, onMobileMenuClose]);
+  const handleImprovementClick = useCallback(() => {
+    navigate("/improvement-center", {
+      trackingEvent: {
+        name: "Improvement Center Clicked",
+        properties: {
+          source: "side_nav"
+        }
+      }
+    });
+    onMobileMenuClose?.();
+  }, [navigate, onMobileMenuClose]);
   const handleTargetsClick = useCallback(() => {
     navigate("/targets", {
       trackingEvent: {
@@ -41401,6 +41672,7 @@ var SideNavBar = memo(({
   const homeButtonClasses = useMemo(() => getButtonClasses("/"), [getButtonClasses, pathname]);
   const leaderboardButtonClasses = useMemo(() => getButtonClasses("/leaderboard"), [getButtonClasses, pathname]);
   const kpisButtonClasses = useMemo(() => getButtonClasses("/kpis"), [getButtonClasses, pathname]);
+  const improvementButtonClasses = useMemo(() => getButtonClasses("/improvement-center"), [getButtonClasses, pathname]);
   const targetsButtonClasses = useMemo(() => getButtonClasses("/targets"), [getButtonClasses, pathname]);
   const shiftsButtonClasses = useMemo(() => getButtonClasses("/shifts"), [getButtonClasses, pathname]);
   const teamManagementButtonClasses = useMemo(() => getButtonClasses("/team-management"), [getButtonClasses, pathname]);
@@ -41468,6 +41740,22 @@ var SideNavBar = memo(({
             ]
           }
         ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: handleImprovementClick,
+            className: improvementButtonClasses,
+            "aria-label": "Improvement Center",
+            tabIndex: 0,
+            role: "tab",
+            "aria-selected": pathname === "/improvement-center" || pathname.startsWith("/improvement-center/"),
+            children: [
+              /* @__PURE__ */ jsx(LightBulbIcon, { className: "w-5 h-5 mb-1" }),
+              /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-[10px] font-medium leading-tight text-center", children: "Improvement" }),
+              /* @__PURE__ */ jsx("span", { className: "text-[8px] font-semibold text-orange-500 uppercase tracking-wide bg-orange-50 px-1.5 py-0.5 rounded", children: "Beta" })
+            ]
+          }
+        ),
         /* @__PURE__ */ jsxs(
           "button",
           {
@@ -41668,6 +41956,19 @@ var SideNavBar = memo(({
             ]
           }
         ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: handleMobileNavClick(handleImprovementClick),
+            className: getMobileButtonClass("/improvement-center"),
+            "aria-label": "Improvement Center",
+            children: [
+              /* @__PURE__ */ jsx(LightBulbIcon, { className: getIconClass("/improvement-center") }),
+              /* @__PURE__ */ jsx("span", { className: "text-base font-medium", children: "Improvement" }),
+              /* @__PURE__ */ jsx("span", { className: "ml-2 text-[10px] font-semibold text-orange-500 uppercase tracking-wide bg-orange-50 px-1.5 py-0.5 rounded", children: "Beta" })
+            ]
+          }
+        ),
         /* @__PURE__ */ jsxs(
           "button",
           {
@@ -45698,7 +45999,8 @@ var TeamUsagePdfGenerator = ({
   usageData,
   daysInRange = 1,
   title = "Team Usage Report",
-  className
+  className,
+  iconOnly = false
 }) => {
   const [isGenerating, setIsGenerating] = useState(false);
   const generatePDF = async () => {
@@ -45878,10 +46180,11 @@ var TeamUsagePdfGenerator = ({
     {
       onClick: generatePDF,
       disabled: isGenerating || !usageData,
-      className: `inline-flex items-center gap-2 rounded-lg bg-gray-100 px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-200 disabled:opacity-50 disabled:cursor-not-allowed ${className || ""}`,
+      className: `inline-flex items-center gap-2 rounded-lg bg-gray-100 ${iconOnly ? "p-2" : "px-4 py-2"} text-sm font-medium text-gray-700 hover:bg-gray-200 active:bg-gray-300 transition-colors disabled:opacity-50 disabled:cursor-not-allowed ${className || ""}`,
+      "aria-label": iconOnly ? isGenerating ? "Generating PDF..." : "Export PDF" : void 0,
       children: [
-        /* @__PURE__ */ jsx(Download, { className: "h-4 w-4" }),
-        isGenerating ? "Generating..." : "Export PDF"
+        /* @__PURE__ */ jsx(Download, { className: iconOnly ? "h-5 w-5" : "h-4 w-4" }),
+        !iconOnly && (isGenerating ? "Generating..." : "Export PDF")
       ]
     }
   );
@@ -48650,10 +48953,19 @@ function HomeView({
   const [errorMessage, setErrorMessage] = useState(null);
   const [displayNamesInitialized, setDisplayNamesInitialized] = useState(false);
   const [hasInitialDataLoaded, setHasInitialDataLoaded] = useState(false);
+  const KPI_CACHE_KEY = "optifye_kpi_cache";
   const dashboardConfig = useDashboardConfig();
   const entityConfig = useEntityConfig();
   const supabaseClient = useSupabaseClient();
   const { user } = useAuth();
+  const { lines: dbLines } = useLines();
+  const mergedLineNames = useMemo(() => {
+    const merged = { ...lineNames };
+    dbLines.forEach((line) => {
+      merged[line.id] = line.line_name;
+    });
+    return merged;
+  }, [lineNames, dbLines]);
   const isSupervisor = user?.role_level === "supervisor";
   const hasMultipleLines = allLineIds.length > 1;
   const availableLineIds = useMemo(() => {
@@ -48760,6 +49072,42 @@ function HomeView({
     }
     return buildKPIsFromLineMetricsRow(row);
   }, [selectedLineId, factoryViewId, lineMetrics, metricsLoading]);
+  const [cachedKpis, setCachedKpis] = useState(() => {
+    if (typeof window === "undefined") return null;
+    try {
+      const cached = localStorage.getItem(KPI_CACHE_KEY);
+      if (cached) {
+        const parsed = JSON.parse(cached);
+        return parsed[selectedLineId] || parsed[factoryViewId] || null;
+      }
+    } catch (e) {
+    }
+    return null;
+  });
+  useEffect(() => {
+    if (kpis && typeof window !== "undefined") {
+      try {
+        const existing = localStorage.getItem(KPI_CACHE_KEY);
+        const cache = existing ? JSON.parse(existing) : {};
+        cache[selectedLineId] = kpis;
+        localStorage.setItem(KPI_CACHE_KEY, JSON.stringify(cache));
+        setCachedKpis(kpis);
+      } catch (e) {
+      }
+    }
+  }, [kpis, selectedLineId, KPI_CACHE_KEY]);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    try {
+      const cached = localStorage.getItem(KPI_CACHE_KEY);
+      if (cached) {
+        const parsed = JSON.parse(cached);
+        setCachedKpis(parsed[selectedLineId] || null);
+      }
+    } catch (e) {
+    }
+  }, [selectedLineId, KPI_CACHE_KEY]);
+  const displayKpis = kpis || cachedKpis;
   const {
     activeBreaks: allActiveBreaks,
     isLoading: breaksLoading,
@@ -49061,16 +49409,16 @@ function HomeView({
     // Use stable string representation instead of spreading array
     JSON.stringify(workspaceMetrics.map((w) => `${w.workspace_uuid}-${Math.round(w.efficiency)}-${w.trend}`))
   ]);
-  const memoizedKPIs = useMemo(() => kpis, [
+  const memoizedKPIs = useMemo(() => displayKpis, [
     // Only update reference when values change by at least 1%
-    kpis?.efficiency?.value ? Math.round(kpis.efficiency.value) : null,
-    kpis?.underperformingWorkers?.current,
-    kpis?.underperformingWorkers?.total,
-    kpis?.outputProgress?.current,
-    kpis?.outputProgress?.target,
-    kpis?.avgCycleTime?.value ? Math.round(kpis.avgCycleTime.value * 10) / 10 : null,
+    displayKpis?.efficiency?.value ? Math.round(displayKpis.efficiency.value) : null,
+    displayKpis?.underperformingWorkers?.current,
+    displayKpis?.underperformingWorkers?.total,
+    displayKpis?.outputProgress?.current,
+    displayKpis?.outputProgress?.target,
+    displayKpis?.avgCycleTime?.value ? Math.round(displayKpis.avgCycleTime.value * 10) / 10 : null,
     // Round to 1 decimal
-    kpis?.qualityCompliance?.value ? Math.round(kpis.qualityCompliance.value) : null
+    displayKpis?.qualityCompliance?.value ? Math.round(displayKpis.qualityCompliance.value) : null
   ]);
   useEffect(() => {
     setIsHydrated(true);
@@ -49088,7 +49436,7 @@ function HomeView({
     trackCoreEvent("Home Line Filter Changed", {
       previous_line_id: selectedLineId,
       new_line_id: value,
-      line_name: lineNames[value] || (value === factoryViewId ? "All Lines" : `Line ${value.substring(0, 4)}`)
+      line_name: mergedLineNames[value] || (value === factoryViewId ? "All Lines" : `Line ${value.substring(0, 4)}`)
     });
     try {
       sessionStorage.setItem(LINE_FILTER_STORAGE_KEY, value);
@@ -49122,9 +49470,9 @@ function HomeView({
     }
     return /* @__PURE__ */ jsxs(Select, { onValueChange: handleLineChange, defaultValue: selectedLineId, children: [
       /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full sm:w-[200px] bg-white border border-gray-200 shadow-sm rounded-md h-9 sm:h-9 text-xs sm:text-sm px-2 sm:px-3", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select a line" }) }),
-      /* @__PURE__ */ jsx(SelectContent, { className: "z-50 bg-white shadow-lg border border-gray-200 rounded-md text-xs sm:text-sm", children: availableLineIds.map((id3) => /* @__PURE__ */ jsx(SelectItem, { value: id3, children: lineNames[id3] || (id3 === factoryViewId ? "All Lines" : `Line ${id3.substring(0, 4)}`) }, id3)) })
+      /* @__PURE__ */ jsx(SelectContent, { className: "z-50 bg-white shadow-lg border border-gray-200 rounded-md text-xs sm:text-sm", children: availableLineIds.map((id3) => /* @__PURE__ */ jsx(SelectItem, { value: id3, children: mergedLineNames[id3] || (id3 === factoryViewId ? "All Lines" : `Line ${id3.substring(0, 4)}`) }, id3)) })
     ] });
-  }, [availableLineIds, handleLineChange, selectedLineId, lineNames, factoryViewId, allLineIds.length]);
+  }, [availableLineIds, handleLineChange, selectedLineId, mergedLineNames, factoryViewId, allLineIds.length]);
   const isInitialLoading = !isHydrated || displayNamesLoading || !displayNamesInitialized;
   const isDataLoading = metricsLoading;
   if (isInitialLoading) {
@@ -49153,7 +49501,7 @@ function HomeView({
               lineTitle,
               lineId: selectedLineId === factoryViewId ? allLineIds[0] : selectedLineId,
               className: "w-full",
-              headerControls: memoizedKPIs ? /* @__PURE__ */ jsx(KPISection2, { kpis: memoizedKPIs, className: "w-full sm:w-auto" }) : null
+              headerControls: /* @__PURE__ */ jsx(KPISection2, { kpis: memoizedKPIs, isLoading: !memoizedKPIs, className: "w-full sm:w-auto" })
             }
           ) }) }),
           /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto sm:overflow-hidden relative", children: [
@@ -56442,35 +56790,62 @@ var TeamManagementView = ({
     ) }) });
   }
   return /* @__PURE__ */ jsxs("div", { className: cn("min-h-screen bg-slate-50", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-white border-b border-gray-200 shadow-sm", children: /* @__PURE__ */ jsx("div", { className: "px-4 sm:px-6 lg:px-8 py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-4", children: /* @__PURE__ */ jsx(BackButtonMinimal, { onClick: handleBack, text: "Back" }) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col items-center", children: [
-        /* @__PURE__ */ jsx("h1", { className: "text-2xl lg:text-3xl font-semibold text-gray-900 text-center", children: pageTitle }),
-        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 mt-1 text-center px-4", children: pageDescription })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-        canViewUsageStats && /* @__PURE__ */ jsx(
-          TeamUsagePdfGenerator,
-          {
-            users,
-            usageData,
-            daysInRange: usageDateRange.daysElapsed,
-            title: "Team Usage Report"
-          }
-        ),
-        canAddUsers && /* @__PURE__ */ jsxs(
-          "button",
-          {
-            onClick: () => setIsAddUserDialogOpen(true),
-            className: "inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-lg hover:bg-blue-700 shadow-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500",
-            children: [
-              /* @__PURE__ */ jsx(UserPlus, { className: "w-4 h-4" }),
-              /* @__PURE__ */ jsx("span", { children: "Add User" })
-            ]
-          }
-        )
+    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-white border-b border-gray-200 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 lg:px-8 py-3 sm:py-4", children: [
+      /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx(BackButtonMinimal, { onClick: handleBack, text: "Back" }),
+        /* @__PURE__ */ jsx("div", { className: "flex-1 flex justify-center", children: /* @__PURE__ */ jsx("h1", { className: "text-base font-semibold text-gray-900 truncate px-2", children: pageTitle }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          canViewUsageStats && /* @__PURE__ */ jsx(
+            TeamUsagePdfGenerator,
+            {
+              users,
+              usageData,
+              daysInRange: usageDateRange.daysElapsed,
+              title: "Team Usage Report",
+              iconOnly: true
+            }
+          ),
+          canAddUsers && /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: () => setIsAddUserDialogOpen(true),
+              className: "p-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 active:bg-blue-800 transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500",
+              "aria-label": "Add User",
+              children: /* @__PURE__ */ jsx(UserPlus, { className: "w-5 h-5" })
+            }
+          )
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs("div", { className: "hidden sm:flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx("div", { className: "flex items-center gap-4", children: /* @__PURE__ */ jsx(BackButtonMinimal, { onClick: handleBack, text: "Back" }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col items-center", children: [
+          /* @__PURE__ */ jsx("h1", { className: "text-2xl lg:text-3xl font-semibold text-gray-900 text-center", children: pageTitle }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 mt-1 text-center px-4", children: pageDescription })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          canViewUsageStats && /* @__PURE__ */ jsx(
+            TeamUsagePdfGenerator,
+            {
+              users,
+              usageData,
+              daysInRange: usageDateRange.daysElapsed,
+              title: "Team Usage Report"
+            }
+          ),
+          canAddUsers && /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setIsAddUserDialogOpen(true),
+              className: "inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-lg hover:bg-blue-700 shadow-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500",
+              children: [
+                /* @__PURE__ */ jsx(UserPlus, { className: "w-4 h-4" }),
+                /* @__PURE__ */ jsx("span", { children: "Add User" })
+              ]
+            }
+          )
+        ] })
       ] })
-    ] }) }) }),
+    ] }) }),
     /* @__PURE__ */ jsx("main", { className: "px-4 sm:px-6 lg:px-8 py-6", children: /* @__PURE__ */ jsx(
       UserManagementTable,
       {
@@ -57408,135 +57783,258 @@ Please ensure:
 }
 var AuthenticatedTicketsView = withAuth(React24__default.memo(TicketsView));
 var TicketsView_default = TicketsView;
-var MOCK_RECOMMENDATIONS = [
-  {
-    id: "rec-1",
-    type: "cycle_time",
-    title: "Cycle Time Deviation Detected",
-    location: "Unit 1: Station 7",
-    line: "Line 1",
-    description: "Cycle time observed was 90s but the standard set was 180s. This indicates a potential process deviation or standard mismatch.",
-    evidence: {
-      type: "video",
-      label: "Operator Cycle Recording",
-      videoUrls: [
-        "/faa70d7a-d687-40c7-b01f-e04a3bb5a425_cam1_cycle_completion_20250708_091413_a54ee206.mp4",
-        "/faa70d7a-d687-40c7-b01f-e04a3bb5a425_cam1_cycle_completion_20250708_091413_a54ee206.mp4",
-        // Mock duplicate for demo
-        "/faa70d7a-d687-40c7-b01f-e04a3bb5a425_cam1_cycle_completion_20250708_091413_a54ee206.mp4"
-        // Mock duplicate for demo
-      ]
-    },
-    impact: "Potential 50% efficiency gain or standard adjustment needed.",
-    date: "Today",
-    timestamp: (/* @__PURE__ */ new Date()).toISOString()
-  },
-  {
-    id: "rec-2",
-    type: "efficiency",
-    title: "Consistent Low Efficiency Period",
-    location: "Line 2",
-    line: "Line 2",
-    description: "Efficiency from 7pm - 8pm is consistently lower than standard. This pattern has been observed for the last 3 days.",
-    evidence: {
-      type: "chart",
-      label: "7pm - 8pm Efficiency Trend",
-      chartData: [
-        { label: "7:00", value: 45, standard: 85 },
-        { label: "7:15", value: 42, standard: 85 },
-        { label: "7:30", value: 40, standard: 85 },
-        { label: "7:45", value: 48, standard: 85 },
-        { label: "8:00", value: 50, standard: 85 }
-      ]
-    },
-    impact: "Loss of approx. 40 units per hour during shift changeover.",
-    date: "Today",
-    timestamp: (/* @__PURE__ */ new Date()).toISOString()
-  },
-  {
-    id: "rec-3",
-    type: "downtime",
-    title: "Recurring Micro-stoppages",
-    location: "Unit 3: Conveyor",
-    line: "Line 1",
-    description: "Frequent micro-stoppages detected every 15 minutes. This suggests a potential jam or sensor issue.",
-    evidence: {
-      type: "chart",
-      label: "Downtime Events",
-      chartData: [
-        { label: "9:00", value: 2, standard: 0 },
-        { label: "9:15", value: 3, standard: 0 },
-        { label: "9:30", value: 1, standard: 0 },
-        { label: "9:45", value: 4, standard: 0 },
-        { label: "10:00", value: 2, standard: 0 }
-      ]
-    },
-    impact: "Cumulative downtime of 45 mins per shift.",
-    date: "Yesterday",
-    timestamp: new Date(Date.now() - 864e5).toISOString()
-  },
-  {
-    id: "rec-4",
-    type: "efficiency",
-    title: "High Idle Time Detected",
-    location: "Packaging Station",
-    line: "Line 2",
-    description: "Operator idle time exceeds 20% of shift duration. Consider rebalancing workload.",
-    evidence: {
-      type: "video",
-      label: "Idle Time Observation",
-      videoUrls: [
-        "/faa70d7a-d687-40c7-b01f-e04a3bb5a425_cam1_cycle_completion_20250708_091413_a54ee206.mp4"
-      ]
-    },
-    impact: "Potential to reassign 1 FTE to other tasks.",
-    date: "Yesterday",
-    timestamp: new Date(Date.now() - 864e5).toISOString()
-  },
-  {
-    id: "rec-5",
-    type: "cycle_time",
-    title: "Slow Setup Time",
-    location: "Machine 5",
-    line: "Line 1",
-    description: "Setup time for product changeover took 45 mins, standard is 20 mins.",
-    evidence: {
-      type: "chart",
-      label: "Changeover Duration",
-      chartData: [
-        { label: "Prev 1", value: 25, standard: 20 },
-        { label: "Prev 2", value: 22, standard: 20 },
-        { label: "Current", value: 45, standard: 20 },
-        { label: "Avg", value: 30, standard: 20 },
-        { label: "Target", value: 20, standard: 20 }
-      ]
-    },
-    impact: "25 mins of lost production time.",
-    date: "2 Days Ago",
-    timestamp: new Date(Date.now() - 1728e5).toISOString()
+
+// src/lib/api/s3-clips-parser.ts
+function parseS3Uri(s3Uri, sopCategories) {
+  const path = new URL(s3Uri).pathname;
+  const parts = path.split("/").filter((p) => p);
+  if (s3Uri.includes("missed_qchecks")) {
+    console.warn(`Skipping missed_qchecks URI in parseS3Uri: ${s3Uri}`);
+    return null;
   }
+  if (parts.length < 8) {
+    console.warn(`Invalid S3 path structure: ${s3Uri} - Too few parts: ${parts.length}, expected at least 8`);
+    return null;
+  }
+  try {
+    const datePart = parts[2];
+    const shiftPart = parts[3];
+    const violationType = parts[4];
+    let folderName = "";
+    let timestamp = "";
+    for (let i = 5; i < parts.length; i++) {
+      const part = parts[i];
+      if (part && part.includes("_") && /\d{8}_\d{6}/.test(part)) {
+        folderName = part;
+        const timeMatch = folderName.match(/_(\d{8})_(\d{6})_/);
+        if (timeMatch) {
+          timestamp = `${timeMatch[2].substring(0, 2)}:${timeMatch[2].substring(2, 4)}:${timeMatch[2].substring(4, 6)}`;
+          break;
+        }
+      }
+    }
+    if (!timestamp) {
+      console.warn(`Couldn't extract timestamp from any part: ${parts.join("/")}`);
+      timestamp = "00:00:00";
+    }
+    let severity = "low";
+    let type = "bottleneck";
+    let description = "Analysis Clip";
+    const normalizedViolationType = violationType.toLowerCase().trim();
+    if (sopCategories && sopCategories.length > 0) {
+      const matchedCategory = sopCategories.find((category) => {
+        const categoryId = category.id.toLowerCase();
+        const s3FolderName = (category.s3FolderName || category.id).toLowerCase();
+        return categoryId === normalizedViolationType || s3FolderName === normalizedViolationType || // Also check for partial matches for flexibility
+        normalizedViolationType.includes(categoryId) || normalizedViolationType.includes(s3FolderName);
+      });
+      if (matchedCategory) {
+        type = matchedCategory.id;
+        description = matchedCategory.description || matchedCategory.label;
+        if (matchedCategory.color.includes("red")) {
+          severity = "high";
+        } else if (matchedCategory.color.includes("yellow") || matchedCategory.color.includes("orange")) {
+          severity = "medium";
+        } else {
+          severity = "low";
+        }
+        console.log(`Matched SOP category: ${matchedCategory.id} for violation type: ${violationType}`);
+        return { timestamp, severity, description, type, originalUri: s3Uri };
+      }
+    }
+    switch (normalizedViolationType) {
+      case "idle_time":
+      case "idle":
+      case "low_value":
+      case "low value":
+      case "low_value_moment":
+      case "low_value_moments":
+      case "low value moment":
+      case "low value moments":
+        type = "low_value";
+        severity = "low";
+        description = "Idle Time Detected";
+        break;
+      case "sop_deviation":
+        type = "missing_quality_check";
+        severity = "high";
+        description = "SOP Deviations";
+        break;
+      case "long_cycle_time":
+        severity = "high";
+        type = "long_cycle_time";
+        description = "Long Cycle Time Detected";
+        break;
+      case "best_cycle_time":
+        type = "best_cycle_time";
+        severity = "low";
+        description = "Best Cycle Time Performance";
+        break;
+      case "worst_cycle_time":
+        type = "worst_cycle_time";
+        severity = "high";
+        description = "Worst Cycle Time Performance";
+        break;
+      case "cycle_completion":
+      case "completed_cycles":
+      case "completed_cycle":
+        type = "cycle_completion";
+        severity = "low";
+        description = "Cycle Completion";
+        break;
+      case "running_cycle":
+      case "active_cycle":
+      case "production_cycle":
+        type = "running_cycle";
+        severity = "low";
+        description = "Active Production Cycle";
+        break;
+      case "setup_state":
+      case "machine_setup":
+      case "line_setup":
+        type = "setup_state";
+        severity = "medium";
+        description = "Machine Setup Activity";
+        break;
+      case "medium_bottleneck":
+        severity = "medium";
+        description = "Medium Bottleneck Identified";
+        break;
+      case "minor_bottleneck":
+      case "mild_bottleneck":
+        severity = "low";
+        description = "Minor Bottleneck Identified";
+        break;
+      default:
+        if (normalizedViolationType.includes("sop") && normalizedViolationType.includes("deviation")) {
+          type = "missing_quality_check";
+          severity = "high";
+          description = "SOP Deviations";
+        } else if (normalizedViolationType.includes("worst") && normalizedViolationType.includes("cycle")) {
+          type = "worst_cycle_time";
+          severity = "high";
+          description = "Worst Cycle Time Performance";
+        } else if (normalizedViolationType.includes("best") && normalizedViolationType.includes("cycle")) {
+          type = "best_cycle_time";
+          severity = "low";
+          description = "Best Cycle Time Performance";
+        } else if (normalizedViolationType.includes("long") && normalizedViolationType.includes("cycle")) {
+          type = "long_cycle_time";
+          severity = "high";
+          description = "Long Cycle Time Detected";
+        } else if (normalizedViolationType.includes("cycle") && (normalizedViolationType.includes("completion") || normalizedViolationType.includes("complete"))) {
+          type = "cycle_completion";
+          severity = "low";
+          description = "Cycle Completion";
+        } else if (normalizedViolationType.includes("running") && normalizedViolationType.includes("cycle")) {
+          type = "running_cycle";
+          severity = "low";
+          description = "Active Production Cycle";
+        } else if (normalizedViolationType.includes("setup") || normalizedViolationType.includes("machine") && normalizedViolationType.includes("setup")) {
+          type = "setup_state";
+          severity = "medium";
+          description = "Machine Setup Activity";
+        } else {
+          description = `Clip type: ${violationType.replace(/_/g, " ")}`;
+          console.log(`Detected unknown violation type: ${violationType} in URI: ${s3Uri}`);
+        }
+        break;
+    }
+    return { timestamp, severity, description, type, originalUri: s3Uri };
+  } catch (error) {
+    console.error(`Error parsing S3 URI: ${s3Uri}`, error);
+    return null;
+  }
+}
+function shuffleArray(array) {
+  const shuffled = [...array];
+  for (let i = shuffled.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];
+  }
+  return shuffled;
+}
+var CATEGORY_OPTIONS = [
+  { id: "all", label: "All" },
+  { id: "cycle_time", label: "Cycle Time" },
+  { id: "efficiency", label: "Efficiency" },
+  { id: "downtime", label: "Downtime" }
 ];
-var VideoCarousel = ({ urls }) => {
+var ClipVideoCarousel = ({ clips, clipsService }) => {
   const [currentIndex, setCurrentIndex] = useState(0);
+  const [videos, setVideos] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    let cancelled = false;
+    const load = async () => {
+      if (!clipsService) {
+        setError("Clips are not configured for this dashboard");
+        return;
+      }
+      if (!clips || clips.length === 0) return;
+      setLoading(true);
+      setError(null);
+      setVideos([]);
+      try {
+        const resolved = await Promise.all(
+          clips.map(async (c) => {
+            const video = await clipsService.getClipById(c.clip_id);
+            if (!video) return null;
+            const cycleTime = typeof c.cycle_time_seconds === "number" ? c.cycle_time_seconds : typeof c.cycle_sec === "number" ? c.cycle_sec : void 0;
+            return {
+              ...video,
+              cycle_time_seconds: cycleTime ?? video.cycle_time_seconds
+            };
+          })
+        );
+        if (cancelled) return;
+        setVideos(resolved.filter(Boolean) || []);
+      } catch (err) {
+        if (cancelled) return;
+        setError(err?.message || "Failed to load clips");
+        setVideos([]);
+      } finally {
+        if (!cancelled) setLoading(false);
+      }
+    };
+    load();
+    return () => {
+      cancelled = true;
+    };
+  }, [clipsService, clips]);
+  useEffect(() => {
+    if (videos.length > 0 && currentIndex >= videos.length) {
+      setCurrentIndex(0);
+    }
+  }, [videos.length, currentIndex]);
   const nextVideo = () => {
-    setCurrentIndex((prev) => (prev + 1) % urls.length);
+    setCurrentIndex((prev) => (prev + 1) % Math.max(videos.length, 1));
   };
   const prevVideo = () => {
-    setCurrentIndex((prev) => (prev - 1 + urls.length) % urls.length);
+    setCurrentIndex((prev) => (prev - 1 + Math.max(videos.length, 1)) % Math.max(videos.length, 1));
   };
-  if (!urls || urls.length === 0) return null;
+  if (!clips || clips.length === 0) return null;
+  const currentVideo = videos[currentIndex];
   return /* @__PURE__ */ jsxs("div", { className: "relative group bg-gray-900 rounded-lg overflow-hidden aspect-video", children: [
-    /* @__PURE__ */ jsx(
-      "video",
+    loading && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center text-sm text-white/80", children: "Loading clips\u2026" }),
+    !loading && error && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center text-sm text-white/80", children: error }),
+    !loading && !error && currentVideo?.src && /* @__PURE__ */ jsx(
+      VideoPlayer,
       {
-        src: urls[currentIndex],
-        className: "w-full h-full object-cover opacity-80 group-hover:opacity-100 transition-opacity",
-        controls: true
+        src: currentVideo.src,
+        className: "w-full h-full object-cover opacity-90 group-hover:opacity-100 transition-opacity",
+        controls: true,
+        playsInline: true
       },
-      urls[currentIndex]
+      currentVideo.src
     ),
-    /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none group-hover:opacity-0 transition-opacity", children: /* @__PURE__ */ jsx(PlayCircleIcon, { className: "w-16 h-16 text-white opacity-80" }) }),
-    urls.length > 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
+    !loading && !error && typeof currentVideo?.cycle_time_seconds === "number" && /* @__PURE__ */ jsxs("div", { className: "absolute top-3 left-3 bg-black/60 text-white text-xs px-2 py-1 rounded-full font-medium pointer-events-none", children: [
+      currentVideo.cycle_time_seconds.toFixed(1),
+      "s"
+    ] }),
+    !loading && !error && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none group-hover:opacity-0 transition-opacity", children: /* @__PURE__ */ jsx(PlayCircleIcon, { className: "w-16 h-16 text-white opacity-80" }) }),
+    videos.length > 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
         "button",
         {
@@ -57564,70 +58062,273 @@ var VideoCarousel = ({ urls }) => {
       /* @__PURE__ */ jsxs("div", { className: "absolute top-3 right-3 bg-black/60 text-white text-xs px-2 py-1 rounded-full font-medium pointer-events-none", children: [
         currentIndex + 1,
         " / ",
-        urls.length
+        videos.length
       ] })
     ] })
   ] });
 };
-var EvidenceChart = ({ data }) => {
-  const chartData = data.map((point) => ({
-    name: point.label,
-    value: point.value,
-    standard: point.standard
-  }));
+var BarChartEvidence = ({ x, y, unit, data, series, referenceLines }) => {
+  const scale2 = unit === "fraction" ? 100 : 1;
+  const yAxisUnit = unit === "fraction" ? "%" : "";
+  const targetLineIndex = referenceLines?.findIndex(
+    (line) => (line.label || "").toLowerCase().includes("target")
+  ) ?? -1;
+  const resolvedTargetLineIndex = targetLineIndex >= 0 ? targetLineIndex : referenceLines?.length === 1 ? 0 : -1;
+  const unitLabel = unit === "fraction" ? "%" : unit === "pieces" ? "PPH" : unit === "ratio" ? "" : unit || "";
+  const formatTargetValue = (value) => {
+    if (unit === "fraction") return value.toFixed(0);
+    if (Number.isInteger(value)) return value.toString();
+    return value.toFixed(1);
+  };
+  const formatTargetLabel = (label, value) => {
+    const base = label || "Target";
+    const suffix = unitLabel ? unitLabel === "%" ? "%" : ` ${unitLabel}` : "";
+    return `${base}: ${formatTargetValue(value)}${suffix}`;
+  };
+  const isMultiSeries = Array.isArray(series) && series.length > 0 && Array.isArray(data);
+  const chartData = isMultiSeries ? (data || []).map((row) => {
+    const scaled = { ...row };
+    series?.forEach((s) => {
+      const raw = row[s.dataKey];
+      if (typeof raw === "number") {
+        scaled[s.dataKey] = raw * scale2;
+      }
+    });
+    return scaled;
+  }) : (x || []).map((xv, idx) => {
+    const yv = y?.[idx];
+    if (yv === null || yv === void 0) return null;
+    const label = typeof xv === "number" ? `${xv.toString().padStart(2, "0")}:00` : String(xv);
+    return { name: label, value: yv * scale2 };
+  }).filter(Boolean);
+  const referenceLineConfigs = (referenceLines || []).map((line, idx) => {
+    const scaledValue = line.y * scale2;
+    const isTarget = idx === resolvedTargetLineIndex;
+    return {
+      ...line,
+      y: scaledValue,
+      label: isTarget ? formatTargetLabel(line.label, scaledValue) : line.label,
+      stroke: isTarget ? "#E34329" : line.stroke,
+      strokeDasharray: isTarget ? "5 5" : line.strokeDasharray,
+      strokeWidth: isTarget ? 2 : line.strokeWidth
+    };
+  });
+  const targetLine = resolvedTargetLineIndex >= 0 ? (referenceLines || [])[resolvedTargetLineIndex] : void 0;
+  const targetValue = targetLine ? targetLine.y * scale2 : null;
+  const targetLabel = targetLine && targetValue !== null ? formatTargetLabel(targetLine.label, targetValue) : null;
+  return /* @__PURE__ */ jsxs("div", { className: "h-48 w-full bg-white border border-gray-100 rounded-lg p-2 relative", children: [
+    targetLabel && /* @__PURE__ */ jsx("div", { className: "absolute top-2 right-2 z-10 pointer-events-none", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-md border border-gray-200 bg-white/90 px-2 py-1 text-[11px] text-gray-700 shadow-sm", children: [
+      /* @__PURE__ */ jsx("span", { className: "block w-6 border-t-2 border-dashed", style: { borderColor: "#E34329" } }),
+      /* @__PURE__ */ jsx("span", { className: "font-semibold", children: targetLabel })
+    ] }) }),
+    /* @__PURE__ */ jsx(
+      BarChart,
+      {
+        data: chartData,
+        bars: isMultiSeries ? (series || []).map((s) => ({
+          dataKey: s.dataKey,
+          name: s.name,
+          fill: s.fill,
+          stackId: s.stackId,
+          labelList: false
+        })) : [
+          {
+            dataKey: "value",
+            name: "Value",
+            fill: "#f87171",
+            // red-400
+            labelList: false
+          }
+        ],
+        xAxisDataKey: "name",
+        showLegend: isMultiSeries && (series || []).length > 1,
+        showGrid: true,
+        aspect: 2.5,
+        yAxisUnit,
+        referenceLines: referenceLineConfigs,
+        className: "h-full"
+      }
+    )
+  ] });
+};
+var PieChartEvidence = ({ data }) => {
+  return /* @__PURE__ */ jsx("div", { className: "h-48 w-full bg-white border border-gray-100 rounded-lg p-2", children: /* @__PURE__ */ jsx(IdleTimeReasonChart_default, { data }) });
+};
+var LineChartEvidence = ({ x, y, unit }) => {
+  const scale2 = unit === "fraction" ? 100 : 1;
+  const yAxisUnit = unit === "fraction" ? "%" : "";
+  const chartData = x.map((xv, idx) => {
+    const yv = y[idx];
+    if (yv === null || yv === void 0) return null;
+    return { name: String(xv), value: yv * scale2 };
+  }).filter(Boolean);
   return /* @__PURE__ */ jsx("div", { className: "h-48 w-full bg-white border border-gray-100 rounded-lg p-2", children: /* @__PURE__ */ jsx(
-    BarChart,
+    LineChart,
     {
       data: chartData,
-      bars: [
+      lines: [
         {
           dataKey: "value",
-          name: "Actual",
-          fill: "#f87171",
-          // red-400
-          labelList: true
+          name: "Value",
+          stroke: "#f87171",
+          strokeWidth: 2,
+          dot: true
         }
       ],
       xAxisDataKey: "name",
       showLegend: false,
       showGrid: true,
       aspect: 2.5,
+      yAxisUnit,
       className: "h-full"
     }
   ) });
 };
+var TableEvidence = ({ columns, rows }) => {
+  const formatValue = (value) => {
+    if (typeof value === "number") {
+      if (Number.isInteger(value)) return value.toString();
+      return value.toFixed(3);
+    }
+    if (value === null || value === void 0) return "-";
+    return String(value);
+  };
+  return /* @__PURE__ */ jsx("div", { className: "w-full bg-white border border-gray-100 rounded-lg overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full text-xs", children: [
+    /* @__PURE__ */ jsx("thead", { className: "bg-gray-50 border-b border-gray-100", children: /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsx(
+      "th",
+      {
+        className: "px-3 py-2 text-left font-semibold text-gray-600 uppercase tracking-wide",
+        children: col.replace(/_/g, " ")
+      },
+      col
+    )) }) }),
+    /* @__PURE__ */ jsx("tbody", { children: rows.map((row, idx) => /* @__PURE__ */ jsx("tr", { className: "border-b border-gray-100 last:border-b-0", children: columns.map((col) => /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-gray-700 whitespace-nowrap", children: formatValue(row[col]) }, col)) }, idx)) })
+  ] }) }) });
+};
 var ImprovementCenterView = () => {
   const { navigate } = useNavigation();
-  const [selectedDate, setSelectedDate] = useState("");
-  const [selectedLine, setSelectedLine] = useState("");
-  const dateInputRef = useRef(null);
-  const uniqueLines = useMemo(() => {
-    const lines = new Set(MOCK_RECOMMENDATIONS.map((r2) => r2.line));
-    return Array.from(lines);
-  }, []);
-  const filteredRecommendations = useMemo(() => {
-    return MOCK_RECOMMENDATIONS.filter((rec) => {
-      if (selectedDate) {
-        const recDate = new Date(rec.timestamp).toISOString().split("T")[0];
-        if (recDate !== selectedDate) return false;
-      }
-      if (selectedLine && rec.line !== selectedLine) {
-        return false;
+  const supabase = useSupabase();
+  const { user } = useAuth();
+  const dashboardConfig = useDashboardConfig();
+  const entityConfig = useEntityConfig();
+  const [currentDate, setCurrentDate] = useState(/* @__PURE__ */ new Date());
+  const [selectedCategory, setSelectedCategory] = useState("all");
+  const [selectedLineId, setSelectedLineId] = useState("all");
+  const [selectedStatus, setSelectedStatus] = useState("all");
+  const [recommendations, setRecommendations] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [loadError, setLoadError] = useState(null);
+  const computeWeeksOpen = (firstSeenAt) => {
+    if (!firstSeenAt) return void 0;
+    const firstSeen = new Date(firstSeenAt);
+    if (Number.isNaN(firstSeen.getTime())) return void 0;
+    const now2 = /* @__PURE__ */ new Date();
+    const diffDays = Math.max(0, Math.floor((now2.getTime() - firstSeen.getTime()) / (1e3 * 60 * 60 * 24)));
+    return Math.max(1, Math.ceil(diffDays / 7));
+  };
+  const configuredLines = useMemo(() => {
+    return entityConfig.lines || entityConfig.lineNames || {};
+  }, [entityConfig.lines, entityConfig.lineNames]);
+  const configuredLineIds = useMemo(() => Object.keys(configuredLines), [configuredLines]);
+  const { accessibleLineIds } = useUserLineAccess(configuredLineIds);
+  const scopeLineIds = useMemo(() => {
+    return accessibleLineIds.length > 0 ? accessibleLineIds : configuredLineIds;
+  }, [accessibleLineIds, configuredLineIds]);
+  const scopeLineIdsKey = useMemo(() => scopeLineIds.join(","), [scopeLineIds]);
+  const companyId = user?.company_id || entityConfig.companyId;
+  const clipsService = useMemo(() => {
+    try {
+      return new S3ClipsSupabaseService(dashboardConfig);
+    } catch (err) {
+      return null;
+    }
+  }, [dashboardConfig]);
+  const nextMonth = () => {
+    setCurrentDate(new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 1));
+  };
+  const prevMonth = () => {
+    setCurrentDate(new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1));
+  };
+  const formatMonth = (date) => {
+    return date.toLocaleDateString("en-US", { month: "long", year: "numeric" });
+  };
+  useEffect(() => {
+    let cancelled = false;
+    const fetchRecommendations = async () => {
+      if (!supabase || !companyId) return;
+      setIsLoading(true);
+      setLoadError(null);
+      try {
+        if (scopeLineIds.length === 0) {
+          setRecommendations([]);
+          return;
+        }
+        const params = new URLSearchParams({
+          company_id: companyId,
+          status: "all",
+          limit: "500"
+        });
+        params.set("month", `${currentDate.getFullYear()}-${String(currentDate.getMonth() + 1).padStart(2, "0")}`);
+        if (scopeLineIds.length > 0) {
+          params.set("line_ids", scopeLineIds.join(","));
+        }
+        const res = await fetchBackendJson(supabase, `/api/improvement-center/recommendations?${params.toString()}`);
+        if (cancelled) return;
+        let recs = res.recommendations || [];
+        recs = recs.map((r2) => ({
+          ...r2,
+          ticket_status: r2.issue_status === "resolved" ? "solved" : "active",
+          weeks_open: typeof r2.weeks_open === "number" ? r2.weeks_open : computeWeeksOpen(r2.first_seen_at) ?? 1
+        }));
+        const allowed = new Set(scopeLineIds);
+        setRecommendations(recs.filter((r2) => !r2.line_id || allowed.has(r2.line_id)));
+      } catch (err) {
+        if (cancelled) return;
+        setLoadError(err?.message || "Failed to load recommendations");
+        setRecommendations([]);
+      } finally {
+        if (!cancelled) setIsLoading(false);
       }
+    };
+    fetchRecommendations();
+    return () => {
+      cancelled = true;
+    };
+  }, [supabase, companyId, scopeLineIdsKey, currentDate]);
+  const filteredRecommendations = useMemo(() => {
+    return recommendations.filter((rec) => {
+      if (selectedCategory !== "all" && rec.type !== selectedCategory) return false;
+      if (selectedLineId !== "all" && rec.line_id !== selectedLineId) return false;
+      if (selectedStatus === "resolved" && rec.ticket_status !== "solved") return false;
+      if (selectedStatus === "unresolved" && rec.ticket_status === "solved") return false;
       return true;
-    });
-  }, [selectedDate, selectedLine]);
-  const handleDateClick = () => {
-    dateInputRef.current?.showPicker?.();
-  };
+    }).sort((a, b) => (b.weeks_open || 0) - (a.weeks_open || 0));
+  }, [recommendations, selectedCategory, selectedLineId, selectedStatus]);
+  const stats = useMemo(() => {
+    const total = recommendations.length;
+    const resolved = recommendations.filter((r2) => r2.ticket_status === "solved").length;
+    return {
+      all: total,
+      resolved,
+      unresolved: total - resolved
+    };
+  }, [recommendations]);
   const clearFilters = () => {
-    setSelectedDate("");
-    setSelectedLine("");
-  };
-  const hasActiveFilters = selectedDate || selectedLine;
+    setSelectedCategory("all");
+    setSelectedLineId("all");
+    setSelectedStatus("all");
+  };
+  const lineOptions = useMemo(() => {
+    const options = [{ id: "all", label: "All Lines" }];
+    scopeLineIds.forEach((lineId) => {
+      const lineName = configuredLines[lineId] || lineId;
+      options.push({ id: lineId, label: lineName });
+    });
+    return options;
+  }, [scopeLineIds, configuredLines]);
   return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-gray-50 flex flex-col", children: [
     /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b border-gray-200 flex-shrink-0", children: /* @__PURE__ */ jsx("div", { className: "px-4 sm:px-6 lg:px-8 py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-4", children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-4 min-w-[120px]", children: /* @__PURE__ */ jsx(
         BackButtonMinimal,
         {
           onClick: () => navigate("/"),
@@ -57635,121 +58336,190 @@ var ImprovementCenterView = () => {
         }
       ) }),
       /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col items-center", children: [
-        /* @__PURE__ */ jsxs("h1", { className: "text-2xl lg:text-3xl font-semibold text-gray-900 text-center flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx(LightBulbIcon, { className: "w-7 h-7 text-amber-500" }),
-          "Improvement Center"
-        ] }),
-        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 mt-1 text-center px-4", children: "Daily AI-driven recommendations to optimize your line performance" })
+        /* @__PURE__ */ jsx("h1", { className: "text-2xl lg:text-3xl font-semibold text-gray-900 text-center", children: "Improvement Center" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 mt-1 text-center px-4 hidden sm:block", children: "Track and resolve persistent issues across your production lines" })
       ] }),
-      /* @__PURE__ */ jsx("div", { className: "w-20" })
+      /* @__PURE__ */ jsx("div", { className: "min-w-[120px]" })
     ] }) }) }),
-    /* @__PURE__ */ jsx("div", { className: "bg-gray-50 px-4 sm:px-6 lg:px-8 py-4", children: /* @__PURE__ */ jsx("div", { className: "max-w-7xl mx-auto flex items-center justify-end gap-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs("main", { className: "flex-1 p-4 sm:p-6 max-w-7xl mx-auto w-full", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 bg-white rounded-full px-4 py-2 border border-gray-200 shadow-sm", children: [
         /* @__PURE__ */ jsx(
-          "input",
-          {
-            ref: dateInputRef,
-            type: "date",
-            value: selectedDate,
-            onChange: (e) => setSelectedDate(e.target.value),
-            className: "sr-only"
-          }
-        ),
-        /* @__PURE__ */ jsxs(
           "button",
           {
-            onClick: handleDateClick,
-            className: `flex items-center gap-2 px-3 py-1.5 text-sm border rounded-lg transition-colors whitespace-nowrap ${selectedDate ? "bg-blue-50 border-blue-200 text-blue-700" : "bg-white border-gray-300 text-gray-700 hover:bg-gray-50"}`,
-            children: [
-              /* @__PURE__ */ jsx(CalendarIcon, { className: "w-4 h-4" }),
-              /* @__PURE__ */ jsx("span", { children: selectedDate || "All Dates" })
-            ]
+            onClick: prevMonth,
+            className: "p-1 rounded-full hover:bg-gray-100 text-gray-500 transition-colors",
+            children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "w-5 h-5" })
           }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs(
-        "select",
-        {
-          value: selectedLine,
-          onChange: (e) => setSelectedLine(e.target.value),
-          className: `px-3 py-1.5 text-sm border rounded-lg bg-white focus:outline-none focus:ring-2 focus:ring-blue-500 cursor-pointer ${selectedLine ? "bg-blue-50 border-blue-200 text-blue-700" : "border-gray-300 text-gray-700"}`,
-          children: [
-            /* @__PURE__ */ jsx("option", { value: "", children: "All Lines" }),
-            uniqueLines.map((line) => /* @__PURE__ */ jsx("option", { value: line, children: line }, line))
-          ]
-        }
-      ),
-      hasActiveFilters && /* @__PURE__ */ jsx(
-        "button",
-        {
-          onClick: clearFilters,
-          className: "p-1.5 text-gray-400 hover:text-gray-600 rounded-full hover:bg-gray-100 transition-colors",
-          title: "Clear filters",
-          children: /* @__PURE__ */ jsx(XMarkIcon, { className: "w-5 h-5" })
-        }
-      )
-    ] }) }) }),
-    /* @__PURE__ */ jsx("main", { className: "flex-1 p-4 sm:p-6 max-w-7xl mx-auto w-full", children: /* @__PURE__ */ jsxs("div", { className: "grid gap-6", children: [
-      filteredRecommendations.length > 0 ? filteredRecommendations.map((rec, index) => /* @__PURE__ */ jsx(
-        motion.div,
-        {
-          initial: { opacity: 0, y: 20 },
-          animate: { opacity: 1, y: 0 },
-          transition: { delay: index * 0.1 },
-          className: "bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden",
-          children: /* @__PURE__ */ jsx("div", { className: "p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row gap-6", children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
-              /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between", children: /* @__PURE__ */ jsxs("div", { children: [
-                /* @__PURE__ */ jsx("span", { className: `inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${rec.type === "cycle_time" ? "bg-blue-100 text-blue-800" : rec.type === "efficiency" ? "bg-orange-100 text-orange-800" : "bg-gray-100 text-gray-800"}`, children: rec.type.replace("_", " ").toUpperCase() }),
-                /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-900 mt-2", children: rec.title }),
-                /* @__PURE__ */ jsxs("p", { className: "text-sm font-medium text-gray-500", children: [
-                  rec.location,
-                  " \u2022 ",
-                  rec.line,
-                  " \u2022 ",
-                  rec.date
-                ] })
-              ] }) }),
-              /* @__PURE__ */ jsx("div", { className: "prose prose-sm text-gray-600", children: /* @__PURE__ */ jsx("p", { children: rec.description }) }),
-              /* @__PURE__ */ jsx("div", { className: "bg-amber-50 border border-amber-100 rounded-lg p-3", children: /* @__PURE__ */ jsxs("p", { className: "text-sm text-amber-800 font-medium flex items-start gap-2", children: [
-                /* @__PURE__ */ jsx(ChartBarIcon, { className: "w-5 h-5 flex-shrink-0" }),
-                "Impact: ",
-                rec.impact
-              ] }) })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "w-full md:w-1/2 lg:w-5/12 bg-gray-50 rounded-lg p-4 border border-gray-100", children: [
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
-                /* @__PURE__ */ jsxs("h4", { className: "text-xs font-semibold text-gray-500 uppercase tracking-wider flex items-center gap-2", children: [
-                  rec.evidence.type === "video" ? /* @__PURE__ */ jsx(PlayCircleIcon, { className: "w-4 h-4" }) : /* @__PURE__ */ jsx(ChartBarIcon, { className: "w-4 h-4" }),
-                  "Evidence: ",
-                  rec.evidence.label
-                ] }),
-                rec.evidence.type === "video" && rec.evidence.videoUrls && rec.evidence.videoUrls.length > 1 && /* @__PURE__ */ jsxs("span", { className: "text-[10px] font-medium text-gray-500 bg-gray-100 px-1.5 py-0.5 rounded", children: [
-                  rec.evidence.videoUrls.length,
-                  " clips"
-                ] })
-              ] }),
-              rec.evidence.type === "video" && rec.evidence.videoUrls && /* @__PURE__ */ jsx(VideoCarousel, { urls: rec.evidence.videoUrls }),
-              rec.evidence.type === "chart" && rec.evidence.chartData && /* @__PURE__ */ jsx(EvidenceChart, { data: rec.evidence.chartData })
-            ] })
-          ] }) })
-        },
-        rec.id
-      )) : /* @__PURE__ */ jsxs("div", { className: "text-center py-16 bg-white rounded-xl border border-dashed border-gray-300", children: [
-        /* @__PURE__ */ jsx("div", { className: "mx-auto flex items-center justify-center w-12 h-12 rounded-full bg-gray-100 mb-3", children: /* @__PURE__ */ jsx(FunnelIcon, { className: "w-6 h-6 text-gray-400" }) }),
-        /* @__PURE__ */ jsx("h3", { className: "text-sm font-medium text-gray-900", children: "No recommendations found" }),
-        /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: "Try adjusting your filters to see more results." }),
+        ),
+        /* @__PURE__ */ jsx("span", { className: "text-base font-semibold text-gray-900 min-w-[160px] text-center", children: formatMonth(currentDate) }),
         /* @__PURE__ */ jsx(
           "button",
           {
-            onClick: clearFilters,
-            className: "mt-4 text-sm text-blue-600 hover:text-blue-800 font-medium",
-            children: "Clear all filters"
+            onClick: nextMonth,
+            className: "p-1 rounded-full hover:bg-gray-100 text-gray-500 transition-colors",
+            children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "w-5 h-5" })
           }
         )
+      ] }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row items-center justify-between gap-4 mb-6", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setSelectedStatus("all"),
+              className: `px-4 py-2 rounded-lg text-sm font-medium transition-all cursor-pointer ${selectedStatus === "all" ? "bg-white text-gray-900 shadow-sm ring-1 ring-black/5" : "text-gray-500 hover:text-gray-700 hover:bg-gray-100"}`,
+              children: [
+                "All ",
+                /* @__PURE__ */ jsx("span", { className: "ml-1.5 bg-gray-100 px-2 py-0.5 rounded-full text-xs text-gray-600", children: stats.all })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-px bg-gray-300 mx-1" }),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setSelectedStatus("resolved"),
+              className: `flex items-center gap-1.5 px-3 py-2 rounded-lg text-sm transition-all cursor-pointer ${selectedStatus === "resolved" ? "bg-green-50 text-green-700 ring-1 ring-green-200" : "text-gray-600 hover:bg-gray-100"}`,
+              children: [
+                /* @__PURE__ */ jsx(CheckCircleIcon, { className: "w-4 h-4 text-green-500" }),
+                "Resolved ",
+                stats.resolved
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setSelectedStatus("unresolved"),
+              className: `flex items-center gap-1.5 px-3 py-2 rounded-lg text-sm transition-all cursor-pointer ${selectedStatus === "unresolved" ? "bg-red-50 text-red-700 ring-1 ring-red-200" : "text-gray-600 hover:bg-gray-100"}`,
+              children: [
+                /* @__PURE__ */ jsx(XCircleIcon, { className: "w-4 h-4 text-red-500" }),
+                "Unresolved ",
+                stats.unresolved
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 w-full md:w-auto", children: [
+          /* @__PURE__ */ jsx(
+            "select",
+            {
+              value: selectedCategory,
+              onChange: (e) => setSelectedCategory(e.target.value),
+              className: "w-full md:w-auto appearance-none pl-3 pr-8 py-1.5 text-sm border border-gray-300 rounded-lg bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 cursor-pointer text-gray-700 shadow-sm",
+              style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.5rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.5em 1.5em` },
+              children: CATEGORY_OPTIONS.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.id, children: opt.label }, opt.id))
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "select",
+            {
+              value: selectedLineId,
+              onChange: (e) => setSelectedLineId(e.target.value),
+              className: "w-full md:w-auto appearance-none pl-3 pr-8 py-1.5 text-sm border border-gray-300 rounded-lg bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 cursor-pointer text-gray-700 shadow-sm",
+              style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.5rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.5em 1.5em` },
+              children: lineOptions.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.id, children: opt.label }, opt.id))
+            }
+          )
+        ] })
       ] }),
-      filteredRecommendations.length > 0 && /* @__PURE__ */ jsx("div", { className: "text-center py-10", children: /* @__PURE__ */ jsx("p", { className: "text-gray-400 text-sm", children: "More recommendations will appear here as we analyze more data." }) })
-    ] }) })
+      /* @__PURE__ */ jsxs("div", { className: "grid gap-6", children: [
+        filteredRecommendations.length > 0 ? filteredRecommendations.map((rec, index) => /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            initial: { opacity: 0, y: 20 },
+            animate: { opacity: 1, y: 0 },
+            transition: { delay: index * 0.1 },
+            className: `bg-white rounded-xl shadow-sm border overflow-hidden ${rec.ticket_status === "solved" ? "border-green-200" : "border-gray-200"}`,
+            children: /* @__PURE__ */ jsx("div", { className: "p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row gap-6", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
+                /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between", children: /* @__PURE__ */ jsxs("div", { className: "space-y-3 w-full", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+                    /* @__PURE__ */ jsx("span", { className: `inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${rec.type === "cycle_time" ? "bg-blue-100 text-blue-800" : rec.type === "efficiency" ? "bg-orange-100 text-orange-800" : "bg-gray-100 text-gray-800"}`, children: rec.type.replace("_", " ").toUpperCase() }),
+                    (rec.shift_label || rec.shift_id !== void 0) && /* @__PURE__ */ jsx("span", { className: "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-700", children: rec.shift_label || `Shift ${rec.shift_id}` }),
+                    rec.ticket_status === "solved" ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5 px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800", children: [
+                      /* @__PURE__ */ jsx(CheckCircleIcon, { className: "w-3.5 h-3.5" }),
+                      "Resolved"
+                    ] }) : /* @__PURE__ */ jsxs("span", { className: `inline-flex items-center gap-1.5 px-2.5 py-0.5 rounded-full text-xs font-medium border ${(rec.weeks_open || 0) > 2 ? "bg-red-50 text-red-700 border-red-200" : "bg-amber-50 text-amber-700 border-amber-200"}`, children: [
+                      /* @__PURE__ */ jsx(ClockIcon, { className: "w-3.5 h-3.5" }),
+                      "Open for ",
+                      rec.weeks_open || 1,
+                      " week",
+                      (rec.weeks_open || 1) !== 1 ? "s" : ""
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { children: [
+                    /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-900", children: rec.title }),
+                    /* @__PURE__ */ jsxs("p", { className: "text-sm font-medium text-gray-500 mt-1", children: [
+                      rec.location,
+                      " \u2022 ",
+                      rec.line
+                    ] })
+                  ] })
+                ] }) }),
+                /* @__PURE__ */ jsx("div", { className: "prose prose-sm text-gray-600", children: /* @__PURE__ */ jsx("p", { children: rec.description }) }),
+                /* @__PURE__ */ jsx("div", { className: "bg-amber-50 border border-amber-100 rounded-lg p-3", children: /* @__PURE__ */ jsxs("p", { className: "text-sm text-amber-800 font-medium flex items-start gap-2", children: [
+                  /* @__PURE__ */ jsx(ChartBarIcon, { className: "w-5 h-5 flex-shrink-0" }),
+                  "Impact: ",
+                  rec.impact
+                ] }) })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "w-full md:w-1/2 lg:w-5/12 bg-gray-50 rounded-lg p-4 border border-gray-100", children: Array.isArray(rec.evidence) && rec.evidence.length > 0 ? /* @__PURE__ */ jsx("div", { className: "space-y-4", children: rec.evidence.map((ev, idx) => {
+                const isVideo = ev.type === "video_gallery";
+                const isChart = ev.type === "bar_chart" || ev.type === "timeseries" || ev.type === "pie_chart";
+                const title = ev.title || "Evidence";
+                const clips = Array.isArray(ev.clips) ? ev.clips : [];
+                const clipCount = clips.length;
+                return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                    /* @__PURE__ */ jsxs("h4", { className: "text-xs font-semibold text-gray-500 uppercase tracking-wider flex items-center gap-2", children: [
+                      isVideo ? /* @__PURE__ */ jsx(PlayCircleIcon, { className: "w-4 h-4" }) : isChart ? /* @__PURE__ */ jsx(ChartBarIcon, { className: "w-4 h-4" }) : /* @__PURE__ */ jsx(ChartBarIcon, { className: "w-4 h-4" }),
+                      title
+                    ] }),
+                    isVideo && clipCount > 1 && /* @__PURE__ */ jsxs("span", { className: "text-[10px] font-medium text-gray-500 bg-gray-100 px-1.5 py-0.5 rounded", children: [
+                      clipCount,
+                      " clips"
+                    ] })
+                  ] }),
+                  ev.type === "video_gallery" && /* @__PURE__ */ jsx(ClipVideoCarousel, { clips, clipsService }),
+                  ev.type === "bar_chart" && (Array.isArray(ev.x) && Array.isArray(ev.y) || Array.isArray(ev.data) && Array.isArray(ev.series)) && /* @__PURE__ */ jsx(
+                    BarChartEvidence,
+                    {
+                      x: ev.x,
+                      y: ev.y,
+                      data: ev.data,
+                      series: ev.series,
+                      unit: ev.unit,
+                      referenceLines: Array.isArray(ev.reference_lines) ? ev.reference_lines : void 0
+                    }
+                  ),
+                  ev.type === "pie_chart" && Array.isArray(ev.data) && /* @__PURE__ */ jsx(PieChartEvidence, { data: ev.data }),
+                  ev.type === "timeseries" && Array.isArray(ev.x) && Array.isArray(ev.y) && /* @__PURE__ */ jsx(LineChartEvidence, { x: ev.x, y: ev.y, unit: ev.unit }),
+                  ev.type === "table" && Array.isArray(ev.columns) && Array.isArray(ev.rows) && /* @__PURE__ */ jsx(TableEvidence, { columns: ev.columns, rows: ev.rows })
+                ] }, `${rec.id}-ev-${idx}`);
+              }) }) : /* @__PURE__ */ jsx("div", { className: "text-xs text-gray-500", children: isLoading ? "Loading evidence\u2026" : loadError ? loadError : "No evidence available" }) })
+            ] }) })
+          },
+          rec.id
+        )) : (
+          // Success State (Zero Tickets)
+          /* @__PURE__ */ jsxs("div", { className: "text-center py-16 bg-white rounded-xl border border-gray-200 shadow-sm", children: [
+            /* @__PURE__ */ jsx("div", { className: "mx-auto flex items-center justify-center w-16 h-16 rounded-full bg-green-50 mb-4", children: /* @__PURE__ */ jsx(CheckCircleIcon, { className: "w-8 h-8 text-green-500" }) }),
+            /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-900", children: "No tickets found" }),
+            /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-gray-500 max-w-md mx-auto", children: selectedCategory !== "all" || selectedLineId !== "all" || selectedStatus !== "all" ? "Try adjusting your filters to see more results." : "All monitored long-term patterns were evaluated and remained within limits. This is a success state!" }),
+            (selectedCategory !== "all" || selectedLineId !== "all" || selectedStatus !== "all") && /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: clearFilters,
+                className: "mt-6 text-sm text-blue-600 hover:text-blue-800 font-medium bg-blue-50 px-4 py-2 rounded-lg hover:bg-blue-100 transition-colors",
+                children: "Clear filters"
+              }
+            )
+          ] })
+        ),
+        filteredRecommendations.length > 0 && /* @__PURE__ */ jsx("div", { className: "text-center py-10", children: /* @__PURE__ */ jsx("p", { className: "text-gray-400 text-sm", children: "More recommendations will appear here as we analyze more data." }) })
+      ] })
+    ] })
   ] });
 };
 var ImprovementCenterView_default = ImprovementCenterView;
@@ -58208,175 +58978,4 @@ var streamProxyConfig = {
   }
 };
 
-// src/lib/api/s3-clips-parser.ts
-function parseS3Uri(s3Uri, sopCategories) {
-  const path = new URL(s3Uri).pathname;
-  const parts = path.split("/").filter((p) => p);
-  if (s3Uri.includes("missed_qchecks")) {
-    console.warn(`Skipping missed_qchecks URI in parseS3Uri: ${s3Uri}`);
-    return null;
-  }
-  if (parts.length < 8) {
-    console.warn(`Invalid S3 path structure: ${s3Uri} - Too few parts: ${parts.length}, expected at least 8`);
-    return null;
-  }
-  try {
-    const datePart = parts[2];
-    const shiftPart = parts[3];
-    const violationType = parts[4];
-    let folderName = "";
-    let timestamp = "";
-    for (let i = 5; i < parts.length; i++) {
-      const part = parts[i];
-      if (part && part.includes("_") && /\d{8}_\d{6}/.test(part)) {
-        folderName = part;
-        const timeMatch = folderName.match(/_(\d{8})_(\d{6})_/);
-        if (timeMatch) {
-          timestamp = `${timeMatch[2].substring(0, 2)}:${timeMatch[2].substring(2, 4)}:${timeMatch[2].substring(4, 6)}`;
-          break;
-        }
-      }
-    }
-    if (!timestamp) {
-      console.warn(`Couldn't extract timestamp from any part: ${parts.join("/")}`);
-      timestamp = "00:00:00";
-    }
-    let severity = "low";
-    let type = "bottleneck";
-    let description = "Analysis Clip";
-    const normalizedViolationType = violationType.toLowerCase().trim();
-    if (sopCategories && sopCategories.length > 0) {
-      const matchedCategory = sopCategories.find((category) => {
-        const categoryId = category.id.toLowerCase();
-        const s3FolderName = (category.s3FolderName || category.id).toLowerCase();
-        return categoryId === normalizedViolationType || s3FolderName === normalizedViolationType || // Also check for partial matches for flexibility
-        normalizedViolationType.includes(categoryId) || normalizedViolationType.includes(s3FolderName);
-      });
-      if (matchedCategory) {
-        type = matchedCategory.id;
-        description = matchedCategory.description || matchedCategory.label;
-        if (matchedCategory.color.includes("red")) {
-          severity = "high";
-        } else if (matchedCategory.color.includes("yellow") || matchedCategory.color.includes("orange")) {
-          severity = "medium";
-        } else {
-          severity = "low";
-        }
-        console.log(`Matched SOP category: ${matchedCategory.id} for violation type: ${violationType}`);
-        return { timestamp, severity, description, type, originalUri: s3Uri };
-      }
-    }
-    switch (normalizedViolationType) {
-      case "idle_time":
-      case "idle":
-      case "low_value":
-      case "low value":
-      case "low_value_moment":
-      case "low_value_moments":
-      case "low value moment":
-      case "low value moments":
-        type = "low_value";
-        severity = "low";
-        description = "Idle Time Detected";
-        break;
-      case "sop_deviation":
-        type = "missing_quality_check";
-        severity = "high";
-        description = "SOP Deviations";
-        break;
-      case "long_cycle_time":
-        severity = "high";
-        type = "long_cycle_time";
-        description = "Long Cycle Time Detected";
-        break;
-      case "best_cycle_time":
-        type = "best_cycle_time";
-        severity = "low";
-        description = "Best Cycle Time Performance";
-        break;
-      case "worst_cycle_time":
-        type = "worst_cycle_time";
-        severity = "high";
-        description = "Worst Cycle Time Performance";
-        break;
-      case "cycle_completion":
-      case "completed_cycles":
-      case "completed_cycle":
-        type = "cycle_completion";
-        severity = "low";
-        description = "Cycle Completion";
-        break;
-      case "running_cycle":
-      case "active_cycle":
-      case "production_cycle":
-        type = "running_cycle";
-        severity = "low";
-        description = "Active Production Cycle";
-        break;
-      case "setup_state":
-      case "machine_setup":
-      case "line_setup":
-        type = "setup_state";
-        severity = "medium";
-        description = "Machine Setup Activity";
-        break;
-      case "medium_bottleneck":
-        severity = "medium";
-        description = "Medium Bottleneck Identified";
-        break;
-      case "minor_bottleneck":
-      case "mild_bottleneck":
-        severity = "low";
-        description = "Minor Bottleneck Identified";
-        break;
-      default:
-        if (normalizedViolationType.includes("sop") && normalizedViolationType.includes("deviation")) {
-          type = "missing_quality_check";
-          severity = "high";
-          description = "SOP Deviations";
-        } else if (normalizedViolationType.includes("worst") && normalizedViolationType.includes("cycle")) {
-          type = "worst_cycle_time";
-          severity = "high";
-          description = "Worst Cycle Time Performance";
-        } else if (normalizedViolationType.includes("best") && normalizedViolationType.includes("cycle")) {
-          type = "best_cycle_time";
-          severity = "low";
-          description = "Best Cycle Time Performance";
-        } else if (normalizedViolationType.includes("long") && normalizedViolationType.includes("cycle")) {
-          type = "long_cycle_time";
-          severity = "high";
-          description = "Long Cycle Time Detected";
-        } else if (normalizedViolationType.includes("cycle") && (normalizedViolationType.includes("completion") || normalizedViolationType.includes("complete"))) {
-          type = "cycle_completion";
-          severity = "low";
-          description = "Cycle Completion";
-        } else if (normalizedViolationType.includes("running") && normalizedViolationType.includes("cycle")) {
-          type = "running_cycle";
-          severity = "low";
-          description = "Active Production Cycle";
-        } else if (normalizedViolationType.includes("setup") || normalizedViolationType.includes("machine") && normalizedViolationType.includes("setup")) {
-          type = "setup_state";
-          severity = "medium";
-          description = "Machine Setup Activity";
-        } else {
-          description = `Clip type: ${violationType.replace(/_/g, " ")}`;
-          console.log(`Detected unknown violation type: ${violationType} in URI: ${s3Uri}`);
-        }
-        break;
-    }
-    return { timestamp, severity, description, type, originalUri: s3Uri };
-  } catch (error) {
-    console.error(`Error parsing S3 URI: ${s3Uri}`, error);
-    return null;
-  }
-}
-function shuffleArray(array) {
-  const shuffled = [...array];
-  for (let i = shuffled.length - 1; i > 0; i--) {
-    const j = Math.floor(Math.random() * (i + 1));
-    [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];
-  }
-  return shuffled;
-}
-
 export { ACTION_NAMES, AIAgentView_default as AIAgentView, AcceptInvite, AcceptInviteView_default as AcceptInviteView, AdvancedFilterDialog, AdvancedFilterPanel, AudioService, AuthCallback, AuthCallbackView_default as AuthCallbackView, AuthProvider, AuthService, AuthenticatedBottleneckClipsView, AuthenticatedFactoryView, AuthenticatedHelpView, AuthenticatedHomeView, AuthenticatedShiftsView, AuthenticatedTargetsView, AuthenticatedTicketsView, AuthenticatedWorkspaceHealthView, AxelNotificationPopup, AxelOrb, BackButton, BackButtonMinimal, BarChart, BaseHistoryCalendar, BottleneckClipsModal, BottleneckClipsView_default as BottleneckClipsView, BottlenecksContent, BreakNotificationPopup, CachePrefetchStatus, Card2 as Card, CardContent2 as CardContent, CardDescription2 as CardDescription, CardFooter2 as CardFooter, CardHeader2 as CardHeader, CardTitle2 as CardTitle, ChangeRoleDialog, ClipFilterProvider, CompactWorkspaceHealthCard, ConfirmRemoveUserDialog, CongratulationsOverlay, CroppedHlsVideoPlayer, CroppedVideoPlayer, CycleTimeChart, CycleTimeOverTimeChart, DEFAULT_ANALYTICS_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CONFIG, DEFAULT_DATABASE_CONFIG, DEFAULT_DATE_TIME_CONFIG, DEFAULT_ENDPOINTS_CONFIG, DEFAULT_ENTITY_CONFIG, DEFAULT_MAP_VIEW_CONFIG, DEFAULT_SHIFT_CONFIG, DEFAULT_SHIFT_DATA, DEFAULT_THEME_CONFIG, DEFAULT_VIDEO_CONFIG, DEFAULT_WORKSPACE_CONFIG, DEFAULT_WORKSPACE_POSITIONS, DashboardHeader, DashboardLayout, DashboardOverridesProvider, DashboardProvider, DateDisplay_default as DateDisplay, DateTimeDisplay, DebugAuth, DebugAuthView_default as DebugAuthView, DetailedHealthStatus, DiagnosisVideoModal, EmptyStateMessage, EncouragementOverlay, FactoryAssignmentDropdown, FactoryView_default as FactoryView, FileManagerFilters, FilterDialogTrigger, FirstTimeLoginDebug, FirstTimeLoginHandler, GaugeChart, GridComponentsPlaceholder, HamburgerButton, Header, HealthDateShiftSelector, HealthStatusGrid, HealthStatusIndicator, HelpView_default as HelpView, HlsVideoPlayer, HomeView_default as HomeView, HourlyOutputChart2 as HourlyOutputChart, ISTTimer_default as ISTTimer, ImprovementCenterView_default as ImprovementCenterView, InlineEditableText, InteractiveOnboardingTour, InvitationService, InvitationsTable, InviteUserDialog, KPICard, KPIDetailView_default as KPIDetailView, KPIGrid, KPIHeader, KPISection, KPIsOverviewView_default as KPIsOverviewView, LINE_1_UUID, LINE_2_UUID, LargeOutputProgressChart, LeaderboardDetailView_default as LeaderboardDetailView, Legend6 as Legend, LineAssignmentDropdown, LineChart, LineHistoryCalendar, LineMonthlyHistory, LineMonthlyPdfGenerator, LinePdfExportButton, LinePdfGenerator, LineWhatsAppShareButton, LinesService, LiveTimer, LoadingInline, LoadingOverlay_default as LoadingOverlay, LoadingPage_default as LoadingPage, LoadingSkeleton, LoadingState, LoginPage, LoginView_default as LoginView, Logo, MainLayout, MapGridView, MetricCard_default as MetricCard, MinimalOnboardingPopup, NewClipsNotification, NoWorkspaceData, OnboardingDemo, OnboardingTour, OptifyeAgentClient, OptifyeLogoLoader_default as OptifyeLogoLoader, OutputProgressChart, PageHeader, PieChart4 as PieChart, PlayPauseIndicator, PrefetchConfigurationError, PrefetchError, PrefetchEvents, PrefetchStatus, PrefetchTimeoutError, ProfileView_default as ProfileView, RegistryProvider, RoleBadge, S3ClipsSupabaseService as S3ClipsService, S3Service, SKUManagementView, SOPComplianceChart, SSEChatClient, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SessionTracker, SessionTrackingContext, SessionTrackingProvider, ShiftDisplay_default as ShiftDisplay, ShiftsView_default as ShiftsView, SideNavBar, SignupWithInvitation, SilentErrorBoundary, SimpleOnboardingPopup, SingleVideoStream_default as SingleVideoStream, Skeleton, SubscriptionManager, SubscriptionManagerProvider, SupabaseProvider, SupervisorDropdown_default as SupervisorDropdown, SupervisorManagementView_default as SupervisorManagementView, SupervisorService, TargetWorkspaceGrid, TargetsView_default as TargetsView, TeamManagementView_default as TeamManagementView, TeamUsagePdfGenerator, ThreadSidebar, TicketHistory_default as TicketHistory, TicketHistoryService, TicketsView_default as TicketsView, TimeDisplay_default as TimeDisplay, TimePickerDropdown, Timer_default as Timer, TimezoneProvider, TimezoneService, UserManagementService, UserManagementTable, UserService, UserUsageDetailModal, UserUsageStats, VideoCard, VideoGridView, VideoPlayer, VideoPreloader, WORKSPACE_POSITIONS, WhatsAppShareButton, WorkspaceCard, WorkspaceDetailView_default as WorkspaceDetailView, WorkspaceDisplayNameExample, WorkspaceGrid, WorkspaceGridItem, WorkspaceHealthCard, WorkspaceHealthView_default as WorkspaceHealthView, WorkspaceHistoryCalendar, WorkspaceMetricCards, WorkspaceMetricCardsImpl, WorkspaceMonthlyDataFetcher, WorkspaceMonthlyHistory, WorkspaceMonthlyPdfGenerator, WorkspacePdfExportButton, WorkspacePdfGenerator, WorkspaceWhatsAppShareButton, actionService, aggregateKPIsFromLineMetricsRows, apiUtils, areAllLinesOnSameShift, authCoreService, authOTPService, authRateLimitService, buildKPIsFromLineMetricsRow, checkRateLimit2 as checkRateLimit, clearAllRateLimits2 as clearAllRateLimits, clearRateLimit2 as clearRateLimit, clearS3VideoCache, clearS3VideoFromCache, clearWorkspaceDisplayNamesCache, cn, createDefaultKPIs, createInvitationService, createLinesService, createSessionTracker, createStreamProxyHandler, createSupabaseClient, createSupervisorService, createThrottledReload, createUserManagementService, createUserService, dashboardService, deleteThread, fetchIdleTimeReasons, forceRefreshWorkspaceDisplayNames, formatDateInZone, formatDateTimeInZone, formatDuration, formatISTDate, formatIdleTime, formatReasonLabel, formatRelativeTime, formatTimeInZone, fromUrlFriendlyName, getAllLineDisplayNames, getAllThreadMessages, getAllWorkspaceDisplayNamesAsync, getAllWorkspaceDisplayNamesSnapshot, getAnonClient, getAvailableShiftIds, getBrowserName, getCameraNumber, getCompanyMetricsTableName, getConfigurableShortWorkspaceDisplayName, getConfigurableWorkspaceDisplayName, getConfiguredLineIds, getCoreSessionRecordingProperties, getCoreSessionReplayUrl, getCurrentShift, getCurrentShiftForLine, getCurrentTimeInZone, getDashboardHeaderTimeInZone, getDaysDifferenceInZone, getDefaultCameraStreamUrl, getDefaultLineId, getDefaultTabForWorkspace, getLineDisplayName, getManufacturingInsights, getMetricsTablePrefix, getNextUpdateInterval, getOperationalDate, getReasonColor, getS3SignedUrl, getS3VideoSrc, getShiftData, getShiftNameById, getShortShiftName, getShortWorkspaceDisplayName, getShortWorkspaceDisplayNameAsync, getStoredWorkspaceMappings, getSubscriptionManager, getThreadMessages, getUniformShiftGroup, getUserThreads, getUserThreadsPaginated, getWorkspaceDisplayName, getWorkspaceDisplayNameAsync, getWorkspaceDisplayNamesMap, getWorkspaceFromUrl, getWorkspaceNavigationParams, groupLinesByShift, hasAnyShiftData, identifyCoreUser, initializeCoreMixpanel, isLegacyConfiguration, isPrefetchError, isSafari, isTransitionPeriod, isUrlPermanentlyFailed, isValidFactoryViewConfiguration, isValidLineInfoPayload, isValidPrefetchParams, isValidPrefetchStatus, isValidWorkspaceDetailedMetricsPayload, isValidWorkspaceMetricsPayload, isWorkspaceDisplayNamesLoaded, isWorkspaceDisplayNamesLoading, linesService, mergeWithDefaultConfig, migrateLegacyConfiguration, optifyeAgentClient, parseS3Uri, preInitializeWorkspaceDisplayNames, preloadS3Video, preloadS3VideoUrl, preloadS3VideosUrl, preloadVideoUrl, preloadVideosUrl, qualityService, realtimeService, refreshWorkspaceDisplayNames, resetCoreMixpanel, resetFailedUrl, resetSubscriptionManager, s3VideoPreloader, shuffleArray, simulateApiDelay, skuService, startCoreSessionRecording, stopCoreSessionRecording, storeWorkspaceMapping, streamProxyConfig, subscribeWorkspaceDisplayNames, throttledReloadDashboard, toUrlFriendlyName, trackCoreEvent, trackCorePageView, transformToChartData, updateThreadTitle, upsertWorkspaceDisplayNameInCache, useAccessControl, useActiveBreaks, useActiveLineId, useAllWorkspaceMetrics, useAnalyticsConfig, useAppTimezone, useAudioService, useAuth, useAuthConfig, useAxelNotifications, useCanSaveTargets, useClipFilter, useClipTypes, useClipTypesWithCounts, useCompanyUsersUsage, useComponentOverride, useCustomConfig, useDashboardConfig, useDashboardMetrics, useDatabaseConfig, useDateFormatter, useDateTimeConfig, useDynamicShiftConfig, useEndpointsConfig, useEntityConfig, useFactoryOverviewMetrics, useFeatureFlags, useFormatNumber, useHasLineAccess, useHistoricWorkspaceMetrics, useHlsStream, useHlsStreamWithCropping, useHookOverride, useHourEndTimer, useHourlyTargetAchievements, useHourlyTargetMisses, useIdleTimeReasons, useLeaderboardMetrics, useLineDetailedMetrics, useLineKPIs, useLineMetrics, useLineShiftConfig, useLineSupervisor, useLineWorkspaceMetrics, useLines, useMessages, useMetrics, useMultiLineShiftConfigs, useNavigation, useOverrides, usePageOverride, usePrefetchClipCounts, useRealtimeLineMetrics, useRegistry, useSKUs, useSessionKeepAlive, useSessionTracking, useSessionTrackingContext, useShiftConfig, useShifts, useSubscriptionManager, useSubscriptionManagerSafe, useSupabase, useSupabaseClient, useSupervisorsByLineIds, useTargets, useTeamManagementPermissions, useTheme, useThemeConfig, useThreads, useTicketHistory, useTimezoneContext, useUserLineAccess, useUserUsage, useVideoConfig, useWorkspaceConfig, useWorkspaceDetailedMetrics, useWorkspaceDisplayName, useWorkspaceDisplayNames, useWorkspaceDisplayNamesMap, useWorkspaceHealthById, useWorkspaceHealthStatus, useWorkspaceMetrics, useWorkspaceNavigation, useWorkspaceOperators, useWorkspaceUptimeTimeline, userService, videoPrefetchManager, videoPreloader, whatsappService, withAccessControl, withAuth, withRegistry, withTimezone, workspaceHealthService, workspaceService };