@optifye/dashboard-core 6.3.3 → 6.3.5

package/dist/index.js

@@ -424,11 +424,11 @@ var actionService = {
 };
 function createMemoizedFunction(fn, getCacheKey) {
   const cache = /* @__PURE__ */ new Map();
-  const CACHE_DURATION3 = 5 * 60 * 1e3;
+  const CACHE_DURATION = 5 * 60 * 1e3;
   return (...args) => {
     const key = getCacheKey(...args);
     const cached = cache.get(key);
-    if (cached && Date.now() - cached.timestamp < CACHE_DURATION3) {
+    if (cached && Date.now() - cached.timestamp < CACHE_DURATION) {
       return cached.result;
     }
     const result = fn(...args);
@@ -2479,199 +2479,6 @@ async function deleteThread(threadId) {
   if (error) throw error;
 }
 
-// src/lib/services/cacheService.ts
-var CacheService = class {
-  constructor() {
-    this.memoryCache = /* @__PURE__ */ new Map();
-    this.DEFAULT_DURATION = 5 * 60 * 1e3;
-  }
-  // 5 minutes
-  /**
-   * Generate a cache key from multiple parts
-   */
-  generateKey(...parts) {
-    return parts.filter((p) => p !== void 0 && p !== null).join(":");
-  }
-  /**
-   * Get item from cache
-   */
-  get(key, options) {
-    const storage = options?.storage || "memory";
-    try {
-      let cacheItem = null;
-      if (storage === "memory") {
-        cacheItem = this.memoryCache.get(key) || null;
-      } else if (storage === "localStorage" || storage === "sessionStorage") {
-        const stored = window[storage].getItem(key);
-        if (stored) {
-          cacheItem = JSON.parse(stored);
-        }
-      }
-      if (!cacheItem) {
-        return null;
-      }
-      if (Date.now() > cacheItem.expiresAt) {
-        this.delete(key, options);
-        return null;
-      }
-      return cacheItem.data;
-    } catch (error) {
-      console.error(`Error getting cache item ${key}:`, error);
-      return null;
-    }
-  }
-  /**
-   * Set item in cache
-   */
-  set(key, data, options) {
-    const storage = options?.storage || "memory";
-    const duration = options?.duration || this.DEFAULT_DURATION;
-    const cacheItem = {
-      data,
-      timestamp: Date.now(),
-      expiresAt: Date.now() + duration
-    };
-    try {
-      if (storage === "memory") {
-        this.memoryCache.set(key, cacheItem);
-        if (this.memoryCache.size > 100) {
-          const firstKey = this.memoryCache.keys().next().value;
-          if (firstKey) {
-            this.memoryCache.delete(firstKey);
-          }
-        }
-      } else if (storage === "localStorage" || storage === "sessionStorage") {
-        window[storage].setItem(key, JSON.stringify(cacheItem));
-      }
-    } catch (error) {
-      console.error(`Error setting cache item ${key}:`, error);
-    }
-  }
-  /**
-   * Delete item from cache
-   */
-  delete(key, options) {
-    const storage = options?.storage || "memory";
-    try {
-      if (storage === "memory") {
-        this.memoryCache.delete(key);
-      } else if (storage === "localStorage" || storage === "sessionStorage") {
-        window[storage].removeItem(key);
-      }
-    } catch (error) {
-      console.error(`Error deleting cache item ${key}:`, error);
-    }
-  }
-  /**
-   * Clear all items from cache
-   */
-  clear(options) {
-    const storage = options?.storage || "memory";
-    try {
-      if (storage === "memory") {
-        this.memoryCache.clear();
-      } else if (storage === "localStorage" || storage === "sessionStorage") {
-        const keys = Object.keys(window[storage]);
-        keys.forEach((key) => {
-          try {
-            const item = window[storage].getItem(key);
-            if (item) {
-              const parsed = JSON.parse(item);
-              if (parsed.timestamp && parsed.expiresAt && parsed.data !== void 0) {
-                window[storage].removeItem(key);
-              }
-            }
-          } catch {
-          }
-        });
-      }
-    } catch (error) {
-      console.error("Error clearing cache:", error);
-    }
-  }
-  /**
-   * Get or set item in cache with a factory function
-   */
-  async getOrSet(key, factory, options) {
-    const cached = this.get(key, options);
-    if (cached !== null) {
-      return cached;
-    }
-    const data = await factory();
-    this.set(key, data, options);
-    return data;
-  }
-  /**
-   * Invalidate cache entries matching a pattern
-   */
-  invalidatePattern(pattern, options) {
-    const storage = options?.storage || "memory";
-    const regex = typeof pattern === "string" ? new RegExp(pattern) : pattern;
-    try {
-      if (storage === "memory") {
-        const keysToDelete = [];
-        this.memoryCache.forEach((_, key) => {
-          if (regex.test(key)) {
-            keysToDelete.push(key);
-          }
-        });
-        keysToDelete.forEach((key) => this.memoryCache.delete(key));
-      } else if (storage === "localStorage" || storage === "sessionStorage") {
-        const keys = Object.keys(window[storage]);
-        keys.forEach((key) => {
-          if (regex.test(key)) {
-            window[storage].removeItem(key);
-          }
-        });
-      }
-    } catch (error) {
-      console.error("Error invalidating cache pattern:", error);
-    }
-  }
-  /**
-   * Clean up expired items
-   */
-  cleanup(options) {
-    const storage = options?.storage || "memory";
-    const now2 = Date.now();
-    try {
-      if (storage === "memory") {
-        const keysToDelete = [];
-        this.memoryCache.forEach((item, key) => {
-          if (now2 > item.expiresAt) {
-            keysToDelete.push(key);
-          }
-        });
-        keysToDelete.forEach((key) => this.memoryCache.delete(key));
-      } else if (storage === "localStorage" || storage === "sessionStorage") {
-        const keys = Object.keys(window[storage]);
-        keys.forEach((key) => {
-          try {
-            const item = window[storage].getItem(key);
-            if (item) {
-              const parsed = JSON.parse(item);
-              if (parsed.expiresAt && now2 > parsed.expiresAt) {
-                window[storage].removeItem(key);
-              }
-            }
-          } catch {
-          }
-        });
-      }
-    } catch (error) {
-      console.error("Error cleaning up cache:", error);
-    }
-  }
-};
-var cacheService = new CacheService();
-if (typeof window !== "undefined") {
-  setInterval(() => {
-    cacheService.cleanup({ storage: "localStorage" });
-    cacheService.cleanup({ storage: "sessionStorage" });
-    cacheService.cleanup({ storage: "memory" });
-  }, 60 * 1e3);
-}
-
 // src/lib/services/subscriptionManager.ts
 var SubscriptionManager = class {
   constructor(supabase) {
@@ -4000,6 +3807,8 @@ var S3ClipsService = class {
   constructor(config) {
     // Request deduplication cache
     this.requestCache = new RequestDeduplicationCache();
+    // Flag to prevent metadata fetching during index building
+    this.isIndexBuilding = false;
     this.config = config;
     if (!config.s3Config) {
       throw new Error("S3 configuration is required");
@@ -4151,6 +3960,10 @@ var S3ClipsService = class {
    * Fetches full metadata including timestamps with deduplication
    */
   async getFullMetadata(playlistUri) {
+    if (this.isIndexBuilding) {
+      console.warn(`[S3ClipsService] Skipping metadata fetch during index building for: ${playlistUri}`);
+      return null;
+    }
     const deduplicationKey = `full-metadata:${playlistUri}`;
     return this.requestCache.deduplicate(
       deduplicationKey,
@@ -4217,141 +4030,152 @@ var S3ClipsService = class {
    * Internal implementation of clip counts fetching
    */
   async executeGetClipCounts(workspaceId, date, shiftId, buildIndex) {
-    const basePrefix = `sop_violations/${workspaceId}/${date}/${shiftId}/`;
-    const counts = { total: 0 };
-    const categoryFolders = [
-      "idle_time",
-      "low_value",
-      "sop_deviation",
-      "missing_quality_check",
-      "best_cycle_time",
-      "worst_cycle_time",
-      "long_cycle_time",
-      "cycle_completion",
-      "bottleneck"
-    ];
-    console.log(`[S3ClipsService] ${buildIndex ? "Building video index and counting" : "Fast counting"} clips for ${workspaceId} on ${date}, shift ${shiftId}`);
-    const startTime = performance.now();
-    const videoIndex = buildIndex ? {
-      byCategory: /* @__PURE__ */ new Map(),
-      allVideos: [],
-      counts: {},
-      workspaceId,
-      date,
-      shiftId: shiftId.toString(),
-      lastUpdated: /* @__PURE__ */ new Date(),
-      _debugId: `vid_${Date.now()}_${Math.random().toString(36).substring(7)}`
-    } : null;
-    const countPromises = categoryFolders.map(async (category) => {
-      const categoryPrefix = `${basePrefix}${category}/videos/`;
-      const categoryVideos = [];
-      try {
-        if (buildIndex) {
-          const command = new clientS3.ListObjectsV2Command({
-            Bucket: this.config.s3Config.bucketName,
-            Prefix: categoryPrefix,
-            MaxKeys: 1e3
-          });
-          let continuationToken;
-          do {
-            if (continuationToken) {
-              command.input.ContinuationToken = continuationToken;
-            }
-            const response = await this.s3Client.send(command);
-            if (response.Contents) {
-              for (const obj of response.Contents) {
-                if (obj.Key && obj.Key.endsWith("playlist.m3u8")) {
-                  if (obj.Key.includes("missed_qchecks")) {
-                    continue;
-                  }
-                  const s3Uri = `s3://${this.config.s3Config.bucketName}/${obj.Key}`;
-                  const sopCategories = this.getSOPCategories(workspaceId);
-                  const parsedInfo = parseS3Uri(s3Uri, sopCategories);
-                  const belongsToCategory = parsedInfo && (parsedInfo.type === category || // Handle specific mismatches between folder names and parsed types
-                  category === "cycle_completion" && parsedInfo.type === "cycle_completion" || category === "sop_deviation" && parsedInfo.type === "missing_quality_check" || category === "missing_quality_check" && parsedInfo.type === "missing_quality_check" || category === "idle_time" && parsedInfo.type === "low_value" || category === "low_value" && parsedInfo.type === "low_value");
-                  if (belongsToCategory) {
-                    const videoEntry = {
-                      uri: s3Uri,
-                      category: parsedInfo.type,
-                      // Use the parsed type, not the folder name
-                      timestamp: parsedInfo.timestamp,
-                      videoId: `${workspaceId}-${parsedInfo.timestamp}`,
-                      workspaceId,
-                      date,
-                      shiftId: shiftId.toString()
-                    };
-                    categoryVideos.push(videoEntry);
+    if (buildIndex) {
+      this.isIndexBuilding = true;
+      console.log(`[S3ClipsService] Starting index building - metadata fetching disabled`);
+    }
+    try {
+      const basePrefix = `sop_violations/${workspaceId}/${date}/${shiftId}/`;
+      const counts = { total: 0 };
+      const categoryFolders = [
+        "idle_time",
+        "low_value",
+        "sop_deviation",
+        "missing_quality_check",
+        "best_cycle_time",
+        "worst_cycle_time",
+        "long_cycle_time",
+        "cycle_completion",
+        "bottleneck"
+      ];
+      console.log(`[S3ClipsService] ${buildIndex ? "Building video index and counting" : "Fast counting"} clips for ${workspaceId} on ${date}, shift ${shiftId}`);
+      const startTime = performance.now();
+      const videoIndex = buildIndex ? {
+        byCategory: /* @__PURE__ */ new Map(),
+        allVideos: [],
+        counts: {},
+        workspaceId,
+        date,
+        shiftId: shiftId.toString(),
+        lastUpdated: /* @__PURE__ */ new Date(),
+        _debugId: `vid_${Date.now()}_${Math.random().toString(36).substring(7)}`
+      } : null;
+      const countPromises = categoryFolders.map(async (category) => {
+        const categoryPrefix = `${basePrefix}${category}/videos/`;
+        const categoryVideos = [];
+        try {
+          if (buildIndex) {
+            const command = new clientS3.ListObjectsV2Command({
+              Bucket: this.config.s3Config.bucketName,
+              Prefix: categoryPrefix,
+              MaxKeys: 1e3
+            });
+            let continuationToken;
+            do {
+              if (continuationToken) {
+                command.input.ContinuationToken = continuationToken;
+              }
+              const response = await this.s3Client.send(command);
+              if (response.Contents) {
+                for (const obj of response.Contents) {
+                  if (obj.Key && obj.Key.endsWith("playlist.m3u8")) {
+                    if (obj.Key.includes("missed_qchecks")) {
+                      continue;
+                    }
+                    const s3Uri = `s3://${this.config.s3Config.bucketName}/${obj.Key}`;
+                    const sopCategories = this.getSOPCategories(workspaceId);
+                    const parsedInfo = parseS3Uri(s3Uri, sopCategories);
+                    const belongsToCategory = parsedInfo && (parsedInfo.type === category || // Handle specific mismatches between folder names and parsed types
+                    category === "cycle_completion" && parsedInfo.type === "cycle_completion" || category === "sop_deviation" && parsedInfo.type === "missing_quality_check" || category === "missing_quality_check" && parsedInfo.type === "missing_quality_check" || category === "idle_time" && parsedInfo.type === "low_value" || category === "low_value" && parsedInfo.type === "low_value");
+                    if (belongsToCategory) {
+                      const videoEntry = {
+                        uri: s3Uri,
+                        category: parsedInfo.type,
+                        // Use the parsed type, not the folder name
+                        timestamp: parsedInfo.timestamp,
+                        videoId: `${workspaceId}-${parsedInfo.timestamp}`,
+                        workspaceId,
+                        date,
+                        shiftId: shiftId.toString()
+                      };
+                      categoryVideos.push(videoEntry);
+                    }
                   }
                 }
               }
+              continuationToken = response.NextContinuationToken;
+            } while (continuationToken);
+            categoryVideos.sort((a, b) => b.timestamp.localeCompare(a.timestamp));
+            if (categoryVideos.length > 0) {
+              console.log(`[S3ClipsService] Found ${categoryVideos.length} videos for category '${category}' (parsed types: ${[...new Set(categoryVideos.map((v) => v.category))].join(", ")})`);
             }
-            continuationToken = response.NextContinuationToken;
-          } while (continuationToken);
-          categoryVideos.sort((a, b) => b.timestamp.localeCompare(a.timestamp));
-          if (categoryVideos.length > 0) {
-            console.log(`[S3ClipsService] Found ${categoryVideos.length} videos for category '${category}' (parsed types: ${[...new Set(categoryVideos.map((v) => v.category))].join(", ")})`);
+            return { category, count: categoryVideos.length, videos: categoryVideos };
+          } else {
+            const command = new clientS3.ListObjectsV2Command({
+              Bucket: this.config.s3Config.bucketName,
+              Prefix: categoryPrefix,
+              Delimiter: "/",
+              MaxKeys: 1e3
+            });
+            let folderCount = 0;
+            let continuationToken;
+            do {
+              if (continuationToken) {
+                command.input.ContinuationToken = continuationToken;
+              }
+              const response = await this.s3Client.send(command);
+              if (response.CommonPrefixes) {
+                folderCount += response.CommonPrefixes.length;
+              }
+              continuationToken = response.NextContinuationToken;
+            } while (continuationToken);
+            return { category, count: folderCount, videos: [] };
           }
-          return { category, count: categoryVideos.length, videos: categoryVideos };
-        } else {
-          const command = new clientS3.ListObjectsV2Command({
-            Bucket: this.config.s3Config.bucketName,
-            Prefix: categoryPrefix,
-            Delimiter: "/",
-            MaxKeys: 1e3
-          });
-          let folderCount = 0;
-          let continuationToken;
-          do {
-            if (continuationToken) {
-              command.input.ContinuationToken = continuationToken;
-            }
-            const response = await this.s3Client.send(command);
-            if (response.CommonPrefixes) {
-              folderCount += response.CommonPrefixes.length;
+        } catch (error) {
+          console.error(`Error ${buildIndex ? "building index for" : "counting folders for"} category ${category}:`, error);
+          return { category, count: 0, videos: [] };
+        }
+      });
+      const results = await Promise.all(countPromises);
+      for (const { category, count, videos } of results) {
+        counts[category] = count;
+        counts.total += count;
+        if (buildIndex && videoIndex && videos) {
+          if (videos.length > 0) {
+            const parsedType = videos[0].category;
+            videoIndex.byCategory.set(parsedType, videos);
+            console.log(`[S3ClipsService] Indexed ${videos.length} videos under parsed type '${parsedType}'`);
+            if (category !== parsedType) {
+              videoIndex.byCategory.set(category, videos);
+              console.log(`[S3ClipsService] Created alias: S3 folder '${category}' -> parsed type '${parsedType}' (${videos.length} videos)`);
             }
-            continuationToken = response.NextContinuationToken;
-          } while (continuationToken);
-          return { category, count: folderCount, videos: [] };
+          }
+          videoIndex.allVideos.push(...videos);
         }
-      } catch (error) {
-        console.error(`Error ${buildIndex ? "building index for" : "counting folders for"} category ${category}:`, error);
-        return { category, count: 0, videos: [] };
       }
-    });
-    const results = await Promise.all(countPromises);
-    for (const { category, count, videos } of results) {
-      counts[category] = count;
-      counts.total += count;
-      if (buildIndex && videoIndex && videos) {
-        if (videos.length > 0) {
-          const parsedType = videos[0].category;
-          videoIndex.byCategory.set(parsedType, videos);
-          console.log(`[S3ClipsService] Indexed ${videos.length} videos under parsed type '${parsedType}'`);
-          if (category !== parsedType) {
-            videoIndex.byCategory.set(category, videos);
-            console.log(`[S3ClipsService] Created alias: S3 folder '${category}' -> parsed type '${parsedType}' (${videos.length} videos)`);
-          }
+      if (buildIndex && videoIndex) {
+        videoIndex.allVideos.sort((a, b) => b.timestamp.localeCompare(a.timestamp));
+        videoIndex.counts = { ...counts };
+      }
+      const elapsed = performance.now() - startTime;
+      console.log(`[S3ClipsService] ${buildIndex ? "Video index and counts" : "Clip counts"} completed in ${elapsed.toFixed(2)}ms - Total: ${counts.total}`);
+      if (buildIndex && videoIndex) {
+        console.log(`[S3ClipsService] Final video index summary:`);
+        console.log(`  - VideoIndex ID: ${videoIndex._debugId}`);
+        console.log(`  - Total videos in allVideos: ${videoIndex.allVideos.length}`);
+        console.log(`  - Categories in byCategory Map: ${Array.from(videoIndex.byCategory.keys()).join(", ")}`);
+        for (const [cat, vids] of videoIndex.byCategory.entries()) {
+          console.log(`    - '${cat}': ${vids.length} videos`);
         }
-        videoIndex.allVideos.push(...videos);
+        return { counts, videoIndex };
       }
-    }
-    if (buildIndex && videoIndex) {
-      videoIndex.allVideos.sort((a, b) => b.timestamp.localeCompare(a.timestamp));
-      videoIndex.counts = { ...counts };
-    }
-    const elapsed = performance.now() - startTime;
-    console.log(`[S3ClipsService] ${buildIndex ? "Video index and counts" : "Clip counts"} completed in ${elapsed.toFixed(2)}ms - Total: ${counts.total}`);
-    if (buildIndex && videoIndex) {
-      console.log(`[S3ClipsService] Final video index summary:`);
-      console.log(`  - VideoIndex ID: ${videoIndex._debugId}`);
-      console.log(`  - Total videos in allVideos: ${videoIndex.allVideos.length}`);
-      console.log(`  - Categories in byCategory Map: ${Array.from(videoIndex.byCategory.keys()).join(", ")}`);
-      for (const [cat, vids] of videoIndex.byCategory.entries()) {
-        console.log(`    - '${cat}': ${vids.length} videos`);
+      return counts;
+    } finally {
+      if (buildIndex) {
+        this.isIndexBuilding = false;
+        console.log(`[S3ClipsService] Index building complete - metadata fetching re-enabled`);
       }
-      return { counts, videoIndex };
     }
-    return counts;
   }
   async getClipCountsCacheFirst(workspaceId, date, shiftId, buildIndex) {
     const cacheKey = `clip-counts:${workspaceId}:${date}:${shiftId}`;
@@ -4445,18 +4269,18 @@ var S3ClipsService = class {
    * Get a specific clip by index for a category with deduplication
    * @deprecated Use getVideoFromIndex with a pre-built VideoIndex for better performance
    */
-  async getClipByIndex(workspaceId, date, shiftId, category, index) {
-    const deduplicationKey = `clip-by-index:${workspaceId}:${date}:${shiftId}:${category}:${index}`;
+  async getClipByIndex(workspaceId, date, shiftId, category, index, includeCycleTime = true, includeMetadata = false) {
+    const deduplicationKey = `clip-by-index:${workspaceId}:${date}:${shiftId}:${category}:${index}:${includeCycleTime}:${includeMetadata}`;
     return this.requestCache.deduplicate(
       deduplicationKey,
-      () => this.executeGetClipByIndex(workspaceId, date, shiftId, category, index),
+      () => this.executeGetClipByIndex(workspaceId, date, shiftId, category, index, includeCycleTime, includeMetadata),
       "ClipByIndex"
     );
   }
   /**
    * Internal implementation of clip by index fetching
    */
-  async executeGetClipByIndex(workspaceId, date, shiftId, category, index) {
+  async executeGetClipByIndex(workspaceId, date, shiftId, category, index, includeCycleTime = true, includeMetadata = false) {
     const categoryPrefix = `sop_violations/${workspaceId}/${date}/${shiftId}/${category}/videos/`;
     try {
       const command = new clientS3.ListObjectsV2Command({
@@ -4494,10 +4318,8 @@ var S3ClipsService = class {
           workspaceId,
           date,
           shiftId.toString(),
-          true,
-          // includeCycleTime
-          true
-          // includeMetadata
+          includeCycleTime,
+          includeMetadata
         );
       }
     } catch (error) {
@@ -4568,7 +4390,7 @@ var S3ClipsService = class {
     }
     let cycleTimeSeconds = null;
     let creationTimestamp = void 0;
-    if (includeMetadata || includeCycleTime && (parsedInfo.type === "bottleneck" && parsedInfo.description.toLowerCase().includes("cycle time") || parsedInfo.type === "best_cycle_time" || parsedInfo.type === "worst_cycle_time" || parsedInfo.type === "cycle_completion")) {
+    if (includeMetadata) {
       const metadata = await this.getFullMetadata(uri);
       if (metadata) {
         if (metadata.original_task_metadata?.cycle_time) {
@@ -4576,6 +4398,8 @@ var S3ClipsService = class {
         }
         creationTimestamp = metadata.upload_timestamp || metadata.original_task_metadata?.timestamp || metadata.creation_timestamp || metadata[""];
       }
+    } else if (includeCycleTime && (parsedInfo.type === "bottleneck" && parsedInfo.description.toLowerCase().includes("cycle time") || parsedInfo.type === "best_cycle_time" || parsedInfo.type === "worst_cycle_time" || parsedInfo.type === "cycle_completion")) {
+      cycleTimeSeconds = null;
     }
     const cloudfrontPlaylistUrl = this.s3UriToCloudfront(uri);
     const { type: videoType, timestamp: videoTimestamp } = parsedInfo;
@@ -5597,7 +5421,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
   const [error, setError] = React19.useState(null);
   const updateQueueRef = React19.useRef(false);
   const isFetchingRef = React19.useRef(false);
-  const timeoutRef = React19.useRef(null);
   const channelRef = React19.useRef(null);
   const schema = databaseConfig.schema ?? "public";
   const companyId = entityConfig.companyId || "";
@@ -5606,7 +5429,7 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
   const defaultTimezone = dateTimeConfig.defaultTimezone;
   const workspaceMetricsBaseTable = databaseConfig.tables?.workspaces ?? "workspace_metrics";
   const workspaceActionsTable = databaseConfig.tables?.actions ?? "workspace_actions";
-  const fetchMetrics = React19.useCallback(async (skipCache = false) => {
+  const fetchMetrics = React19.useCallback(async () => {
     if (!workspaceId || isFetchingRef.current) return;
     try {
       isFetchingRef.current = true;
@@ -5615,28 +5438,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
       const queryShiftId = shiftId !== void 0 ? shiftId : currentShift.shiftId;
       console.log("[useWorkspaceDetailedMetrics] Using shift ID:", queryShiftId, "from input shift:", shiftId);
       console.log("[useWorkspaceDetailedMetrics] Using date:", queryDate, "from input date:", date);
-      const cacheKey = cacheService.generateKey(
-        "workspace-detailed-metrics",
-        workspaceId,
-        queryDate,
-        queryShiftId,
-        companyId
-      );
-      if (!skipCache) {
-        const cachedData = cacheService.get(cacheKey, {
-          storage: "memory",
-          duration: 5 * 60 * 1e3
-          // 5 minutes
-        });
-        if (cachedData) {
-          console.log("[useWorkspaceDetailedMetrics] Using cached data for:", cacheKey);
-          setMetrics(cachedData);
-          setIsLoading(false);
-          updateQueueRef.current = false;
-          isFetchingRef.current = false;
-          return;
-        }
-      }
       console.log(`[useWorkspaceDetailedMetrics] Querying ${metricsTable} for workspace: ${workspaceId}, date: ${queryDate}, shift: ${queryShiftId}`);
       const { data, error: fetchError } = await supabase.from(metricsTable).select("*").eq("workspace_id", workspaceId).eq("date", queryDate).eq("shift_id", queryShiftId).maybeSingle();
       if (fetchError) throw fetchError;
@@ -5739,18 +5540,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
           setIsLoading(false);
           updateQueueRef.current = false;
           isFetchingRef.current = false;
-          const fallbackCacheKey = cacheService.generateKey(
-            "workspace-detailed-metrics",
-            workspaceId,
-            recentData.date,
-            recentData.shift_id,
-            companyId
-          );
-          cacheService.set(fallbackCacheKey, transformedData2, {
-            storage: "memory",
-            duration: 2 * 60 * 1e3
-            // 2 minutes for fallback data
-          });
           return;
         } else {
           console.warn("[useWorkspaceDetailedMetrics] No data found for workspace:", workspaceId, "at all");
@@ -5864,11 +5653,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
         ...data.sop_check !== void 0 && { sop_check: data.sop_check }
       };
       setMetrics(transformedData);
-      cacheService.set(cacheKey, transformedData, {
-        storage: "memory",
-        duration: 5 * 60 * 1e3
-        // 5 minutes
-      });
     } catch (err) {
       console.error("Error fetching workspace metrics:", err);
       setError({ message: err.message, code: err.code });
@@ -5881,12 +5665,7 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
   const queueUpdate = React19.useCallback(() => {
     if (!workspaceId || updateQueueRef.current) return;
     updateQueueRef.current = true;
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    timeoutRef.current = setTimeout(() => {
-      fetchMetrics();
-    }, 500);
+    fetchMetrics();
   }, [fetchMetrics, workspaceId]);
   const setupSubscription = React19.useCallback(() => {
     if (!workspaceId) return;
@@ -5903,7 +5682,7 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
       },
       async (payload) => {
         console.log(`Received ${metricsTablePrefix} update:`, payload);
-        await fetchMetrics(true);
+        await fetchMetrics();
       }
     ).subscribe((status) => {
       console.log(`Workspace detailed metrics subscription status:`, status);
@@ -5937,14 +5716,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
           matches: payloadData?.date === operationalDate && payloadData?.shift_id === queryShiftId
         });
         if (payloadData?.date === operationalDate && payloadData?.shift_id === queryShiftId) {
-          const cacheKey = cacheService.generateKey(
-            "workspace-detailed-metrics",
-            workspaceId,
-            operationalDate,
-            queryShiftId,
-            companyId
-          );
-          cacheService.delete(cacheKey, { storage: "memory" });
           queueUpdate();
         }
       }
@@ -5970,14 +5741,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
           matches: payloadData?.date === operationalDate && payloadData?.shift_id === queryShiftId
         });
         if (payloadData?.date === operationalDate && payloadData?.shift_id === queryShiftId) {
-          const cacheKey = cacheService.generateKey(
-            "workspace-detailed-metrics",
-            workspaceId,
-            operationalDate,
-            queryShiftId,
-            companyId
-          );
-          cacheService.delete(cacheKey, { storage: "memory" });
           queueUpdate();
         }
       }
@@ -6003,14 +5766,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
           matches: payloadData?.date === operationalDate && payloadData?.shift_id === queryShiftId
         });
         if (payloadData?.date === operationalDate && payloadData?.shift_id === queryShiftId) {
-          const cacheKey = cacheService.generateKey(
-            "workspace-detailed-metrics",
-            workspaceId,
-            operationalDate,
-            queryShiftId,
-            companyId
-          );
-          cacheService.delete(cacheKey, { storage: "memory" });
           queueUpdate();
         }
       }
@@ -6021,9 +5776,6 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
     fetchMetrics();
     setupSubscription();
     return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
       channels.forEach((channel) => {
         console.log("Cleaning up channel subscription");
         supabase.removeChannel(channel);
@@ -6037,7 +5789,7 @@ var useWorkspaceDetailedMetrics = (workspaceId, date, shiftId) => {
     metrics: metrics2,
     isLoading,
     error,
-    refetch: () => fetchMetrics(true)
+    refetch: () => fetchMetrics()
     // Force refresh without cache
   };
 };
@@ -6482,33 +6234,6 @@ var useLeaderboardMetrics = (lineId, topCount = 10) => {
     refetch: fetchLeaderboardData
   };
 };
-var CACHE_KEY_PREFIX = "dashboard_metrics_cache_";
-var CACHE_DURATION = 5 * 60 * 1e3;
-var getCache = (lineId) => {
-  if (typeof window === "undefined") return null;
-  try {
-    const cached = localStorage.getItem(`${CACHE_KEY_PREFIX}${lineId}`);
-    if (!cached) return null;
-    const parsedCache = JSON.parse(cached);
-    if (!parsedCache.lastUpdated || Date.now() - parsedCache.lastUpdated > CACHE_DURATION) {
-      localStorage.removeItem(`${CACHE_KEY_PREFIX}${lineId}`);
-      return null;
-    }
-    return parsedCache;
-  } catch {
-    return null;
-  }
-};
-var setCache = (lineId, metrics2) => {
-  if (typeof window === "undefined") return;
-  try {
-    localStorage.setItem(`${CACHE_KEY_PREFIX}${lineId}`, JSON.stringify({
-      ...metrics2,
-      lastUpdated: Date.now()
-    }));
-  } catch {
-  }
-};
 var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
   const { supabaseUrl, supabaseKey } = useDashboardConfig();
   const entityConfig = useEntityConfig();
@@ -6519,22 +6244,20 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
   const configuredLineMetricsTable = databaseConfig?.tables?.lineMetrics ?? "line_metrics";
   const schema = databaseConfig?.schema ?? "public";
   const supabase = useSupabase();
-  const [metrics2, setMetrics] = React19.useState(() => getCache(lineId) || { workspaceMetrics: [], lineMetrics: [] });
-  const [isLoading, setIsLoading] = React19.useState(() => !getCache(lineId));
+  const [metrics2, setMetrics] = React19.useState({ workspaceMetrics: [], lineMetrics: [] });
+  const [isLoading, setIsLoading] = React19.useState(true);
   const [error, setError] = React19.useState(null);
   const lineIdRef = React19.useRef(lineId);
   const isFetchingRef = React19.useRef(false);
   const updateQueueRef = React19.useRef(false);
-  const timeoutRef = React19.useRef(null);
   const companySpecificMetricsTable = React19.useMemo(
     () => getCompanyMetricsTableName(entityConfig.companyId, "performance_metrics"),
     [entityConfig.companyId]
   );
   React19.useEffect(() => {
     lineIdRef.current = lineId;
-    const cachedData = getCache(lineId);
-    setMetrics(cachedData || { workspaceMetrics: [], lineMetrics: [] });
-    setIsLoading(!cachedData);
+    setMetrics({ workspaceMetrics: [], lineMetrics: [] });
+    setIsLoading(true);
   }, [lineId]);
   const fetchAllMetrics = React19.useCallback(async () => {
     const currentLineIdToUse = lineIdRef.current;
@@ -6546,9 +6269,7 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
       return;
     }
     isFetchingRef.current = true;
-    if (!getCache(currentLineIdToUse)) {
-      setIsLoading(true);
-    }
+    setIsLoading(true);
     setError(null);
     try {
       const currentShiftDetails = getCurrentShift(defaultTimezone, shiftConfig);
@@ -6573,7 +6294,6 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
           lineMetrics: []
         };
         setMetrics(newMetricsState2);
-        setCache(currentLineIdToUse, newMetricsState2);
         return;
       }
       let workspaceQuery = supabase.from(companySpecificMetricsTable).select("company_id,line_id,shift_id,date,workspace_id,workspace_name,total_output,avg_pph,performance_score,avg_cycle_time,trend_score,ideal_output,efficiency,total_day_output").eq("date", operationalDate).eq("shift_id", currentShiftDetails.shiftId).in("workspace_id", enabledWorkspaceIds);
@@ -6625,7 +6345,6 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
         lineMetrics: lineData || []
       };
       setMetrics(newMetricsState);
-      setCache(currentLineIdToUse, newMetricsState);
     } catch (err) {
       setError({ message: err.message, code: err.code || "FETCH_ERROR" });
     } finally {
@@ -6651,12 +6370,7 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
       return;
     }
     updateQueueRef.current = true;
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    timeoutRef.current = setTimeout(() => {
-      fetchAllMetrics();
-    }, 500);
+    fetchAllMetrics();
   }, [fetchAllMetrics, supabase]);
   React19.useEffect(() => {
     if (lineId && supabase) {
@@ -6701,9 +6415,6 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
       onLineMetricsUpdate?.();
     });
     return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
       channels.forEach((channel) => {
         supabase?.removeChannel(channel).catch((err) => console.error("[useDashboardMetrics] Error removing channel:", err.message));
       });
@@ -6732,30 +6443,6 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
     refetch: fetchAllMetrics
   };
 };
-var CACHE_KEY_PREFIX2 = "line_kpis_cache_";
-var CACHE_DURATION2 = 5 * 60 * 1e3;
-var getCache2 = (lineId) => {
-  if (typeof window === "undefined") return null;
-  try {
-    const cached = localStorage.getItem(`${CACHE_KEY_PREFIX2}${lineId}`);
-    if (!cached) return null;
-    const parsedCache = JSON.parse(cached);
-    if (!parsedCache.timestamp || Date.now() - parsedCache.timestamp > CACHE_DURATION2) {
-      localStorage.removeItem(`${CACHE_KEY_PREFIX2}${lineId}`);
-      return null;
-    }
-    return parsedCache.data;
-  } catch (error) {
-    return null;
-  }
-};
-var setCache2 = (lineId, data) => {
-  if (typeof window === "undefined") return;
-  try {
-    localStorage.setItem(`${CACHE_KEY_PREFIX2}${lineId}`, JSON.stringify({ data, timestamp: Date.now() }));
-  } catch (error) {
-  }
-};
 var useLineKPIs = ({ lineId }) => {
   useDashboardConfig();
   const entityConfig = useEntityConfig();
@@ -6767,13 +6454,12 @@ var useLineKPIs = ({ lineId }) => {
   const dashboardServiceInstance = React19.useMemo(() => {
     return dashboardService;
   }, []);
-  const [kpis, setKPIs] = React19.useState(() => getCache2(lineId));
-  const [isLoading, setIsLoading] = React19.useState(!getCache2(lineId));
+  const [kpis, setKPIs] = React19.useState(null);
+  const [isLoading, setIsLoading] = React19.useState(true);
   const [error, setError] = React19.useState(null);
   const lineIdRef = React19.useRef(lineId);
   const isFetchingRef = React19.useRef(false);
   const updateQueueRef = React19.useRef(false);
-  const timeoutRef = React19.useRef(null);
   const defaultTimezone = dateTimeConfig.defaultTimezone;
   const schema = databaseConfig.schema ?? "public";
   const lineMetricsTable = databaseConfig.tables?.lineMetrics ?? "line_metrics";
@@ -6804,7 +6490,6 @@ var useLineKPIs = ({ lineId }) => {
       if (lineInfo) {
         const newKPIs = dashboardServiceInstance.calculateKPIs(lineInfo);
         setKPIs(newKPIs);
-        setCache2(currentLineId, newKPIs);
       } else {
         setKPIs(null);
       }
@@ -6821,12 +6506,7 @@ var useLineKPIs = ({ lineId }) => {
   const queueUpdate = React19.useCallback(() => {
     if (updateQueueRef.current) return;
     updateQueueRef.current = true;
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    timeoutRef.current = setTimeout(() => {
-      fetchKPIs();
-    }, 500);
+    fetchKPIs();
   }, [fetchKPIs]);
   React19.useEffect(() => {
     const currentLineId = lineIdRef.current;
@@ -6884,9 +6564,6 @@ var useLineKPIs = ({ lineId }) => {
       activeChannels.push(csChannel);
     }
     return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
       activeChannels.forEach((ch) => supabase.removeChannel(ch).catch((err) => console.error("[useLineKPIs] Error removing KPI channel:", err)));
     };
   }, [supabase, lineId, fetchKPIs, queueUpdate, dashboardServiceInstance, entityConfig, schema, lineMetricsTable, companySpecificMetricsTable, defaultTimezone, shiftConfig, kpis, isFactoryView]);
@@ -6915,7 +6592,6 @@ var useRealtimeLineMetrics = ({
   const [initialized, setInitialized] = React19.useState(false);
   const lineIdRef = React19.useRef(null);
   const updateQueueRef = React19.useRef(false);
-  const timeoutRef = React19.useRef(null);
   const isFetchingRef = React19.useRef(false);
   const channelsRef = React19.useRef([]);
   const currentShift = React19.useMemo(() => getCurrentShift(dateTimeConfig.defaultTimezone || "Asia/Kolkata", shiftConfig), [dateTimeConfig.defaultTimezone, shiftConfig]);
@@ -7128,12 +6804,7 @@ var useRealtimeLineMetrics = ({
   const queueUpdate = React19.useCallback(() => {
     if (updateQueueRef.current) return;
     updateQueueRef.current = true;
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    timeoutRef.current = setTimeout(() => {
-      fetchData();
-    }, 500);
+    fetchData();
   }, [fetchData]);
   const setupSubscriptions = React19.useCallback(() => {
     if (channelsRef.current.length > 0) {
@@ -7211,9 +6882,6 @@ var useRealtimeLineMetrics = ({
     }
     setupSubscriptions();
     return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
       if (channelsRef.current.length > 0) {
         channelsRef.current.forEach((channel) => {
           if (process.env.NODE_ENV === "development") {
@@ -8501,32 +8169,12 @@ var useAllWorkspaceMetrics = (options) => {
     return `${metricsTablePrefix}_${companyId.replace(/-/g, "_")}`;
   }, [entityConfig.companyId]);
   const schema = databaseConfig.schema ?? "public";
-  const fetchWorkspaceMetrics = React19.useCallback(async (skipCache = false) => {
+  const fetchWorkspaceMetrics = React19.useCallback(async () => {
     if (!initialized) {
       setLoading(true);
     }
     setError(null);
     try {
-      const cacheKey = cacheService.generateKey(
-        "all-workspace-metrics",
-        entityConfig.companyId,
-        queryDate,
-        queryShiftId
-      );
-      if (!skipCache && !loading) {
-        const cachedData = cacheService.get(cacheKey, {
-          storage: "memory",
-          duration: 5 * 60 * 1e3
-          // 5 minutes
-        });
-        if (cachedData) {
-          console.log("[useAllWorkspaceMetrics] Using cached data for:", cacheKey);
-          setWorkspaces(cachedData);
-          setInitialized(true);
-          setLoading(false);
-          return;
-        }
-      }
       console.log("Fetching all workspace metrics with params:", {
         queryDate,
         queryShiftId,
@@ -8576,11 +8224,6 @@ var useAllWorkspaceMetrics = (options) => {
       }));
       setWorkspaces(transformedData);
       setInitialized(true);
-      cacheService.set(cacheKey, transformedData, {
-        storage: "memory",
-        duration: 5 * 60 * 1e3
-        // 5 minutes
-      });
     } catch (err) {
       console.error("Error fetching all workspace metrics:", err);
       setError({ message: err.message, code: err.code || "FETCH_ERROR" });
@@ -8605,14 +8248,7 @@ var useAllWorkspaceMetrics = (options) => {
         },
         async (payload) => {
           console.log("All workspace metrics update received:", payload);
-          const cacheKey = cacheService.generateKey(
-            "all-workspace-metrics",
-            entityConfig.companyId,
-            queryDate,
-            queryShiftId
-          );
-          cacheService.delete(cacheKey, { storage: "memory" });
-          await fetchWorkspaceMetrics(true);
+          await fetchWorkspaceMetrics();
         }
       ).subscribe();
       return channel2;
@@ -8627,7 +8263,7 @@ var useAllWorkspaceMetrics = (options) => {
   React19.useEffect(() => {
     setInitialized(false);
   }, [queryDate, queryShiftId]);
-  const refreshWorkspaces = React19.useCallback(() => fetchWorkspaceMetrics(true), [fetchWorkspaceMetrics]);
+  const refreshWorkspaces = React19.useCallback(() => fetchWorkspaceMetrics(), [fetchWorkspaceMetrics]);
   return React19.useMemo(
     () => ({ workspaces, loading, error, refreshWorkspaces }),
     [workspaces, loading, error, refreshWorkspaces]
@@ -12080,8 +11716,11 @@ var useHourlyTargetAchievements = ({
       targetThreshold,
       enabled
     });
-    const currentHourIndex = hourlyData.length - 1;
-    if (currentHourIndex < 0 || hourlyData[currentHourIndex] === void 0) {
+    let currentHourIndex = hourlyData.length - 1;
+    while (currentHourIndex >= 0 && (hourlyData[currentHourIndex] === void 0 || hourlyData[currentHourIndex] === 0)) {
+      currentHourIndex--;
+    }
+    if (currentHourIndex < 0) {
       console.log("[HOURLY TARGET CHECK] No hourly data available");
       return;
     }
@@ -12179,8 +11818,11 @@ var useHourlyTargetMisses = ({
       targetThreshold,
       enabled
     });
-    const currentHourIndex = hourlyData.length - 1;
-    if (currentHourIndex < 0 || hourlyData[currentHourIndex] === void 0) {
+    let currentHourIndex = hourlyData.length - 1;
+    while (currentHourIndex >= 0 && (hourlyData[currentHourIndex] === void 0 || hourlyData[currentHourIndex] === 0)) {
+      currentHourIndex--;
+    }
+    if (currentHourIndex < 0) {
       console.log("[HOURLY TARGET MISS CHECK] No hourly data available");
       return;
     }
@@ -26629,6 +26271,85 @@ var BottlenecksContent = ({
   }, [workspaceId, date, s3ClipsService, shift, dashboardConfig, updateClipCounts, updateVideoIndex]);
   const loadingCategoryRef = React19.useRef(null);
   const videoRetryCountRef = React19.useRef(0);
+  const loadingVideosRef = React19.useRef(/* @__PURE__ */ new Set());
+  const loadedVideosMapRef = React19.useRef(/* @__PURE__ */ new Map());
+  const ensureVideosLoaded = React19.useCallback(async (centerIndex) => {
+    if (!s3ClipsService || !workspaceId || !isMountedRef.current) return;
+    const currentFilter = activeFilterRef.current;
+    const currentVideoIndex = videoIndexRef.current;
+    let effectiveFilter = currentFilter;
+    if (sopCategories && sopCategories.length > 0) {
+      const category = sopCategories.find((cat) => cat.id === currentFilter);
+      if (category && category.s3FolderName) {
+        effectiveFilter = category.s3FolderName;
+      }
+    }
+    const cacheKey = `${effectiveFilter}:${date}:${shift}`;
+    if (!loadedVideosMapRef.current.has(cacheKey)) {
+      loadedVideosMapRef.current.set(cacheKey, /* @__PURE__ */ new Set());
+    }
+    const loadedIndices = loadedVideosMapRef.current.get(cacheKey);
+    const indicesToLoad = [];
+    const rangeBefore = 1;
+    const rangeAfter = 3;
+    for (let i = Math.max(0, centerIndex - rangeBefore); i <= Math.min(clipCounts[effectiveFilter] - 1, centerIndex + rangeAfter); i++) {
+      if (!loadedIndices.has(i) && !loadingVideosRef.current.has(i)) {
+        indicesToLoad.push(i);
+      }
+    }
+    if (indicesToLoad.length === 0) return;
+    console.log(`[ensureVideosLoaded] Preloading ${indicesToLoad.length} videos around index ${centerIndex}: [${indicesToLoad.join(", ")}]`);
+    indicesToLoad.forEach((idx) => loadingVideosRef.current.add(idx));
+    const loadPromises = indicesToLoad.map(async (index) => {
+      try {
+        let video = null;
+        if (currentVideoIndex && currentVideoIndex.byCategory && currentVideoIndex.allVideos.length > 0) {
+          video = await s3ClipsService.getVideoFromIndex(
+            currentVideoIndex,
+            effectiveFilter,
+            index,
+            true,
+            // includeCycleTime - OK for preloading
+            true
+            // includeMetadata - OK for just +3/-1 videos, not ALL videos
+          );
+        }
+        if (!video) {
+          const operationalDate = date || getOperationalDate();
+          const shiftStr = shift?.toString() || "0";
+          video = await s3ClipsService.getClipByIndex(
+            workspaceId,
+            operationalDate,
+            shiftStr,
+            effectiveFilter,
+            index,
+            true,
+            // includeCycleTime - OK for preloading
+            true
+            // includeMetadata - OK for just +3/-1 videos, not ALL videos
+          );
+        }
+        if (video && isMountedRef.current) {
+          setAllVideos((prev) => {
+            const exists = prev.some((v) => v.id === video.id);
+            if (!exists) {
+              return [...prev, video];
+            }
+            return prev;
+          });
+          loadedIndices.add(index);
+          preloadVideoUrl(video.src);
+        }
+      } catch (error2) {
+        console.warn(`[ensureVideosLoaded] Failed to load video at index ${index}:`, error2);
+      } finally {
+        loadingVideosRef.current.delete(index);
+      }
+    });
+    Promise.all(loadPromises).catch((err) => {
+      console.warn("[ensureVideosLoaded] Some videos failed to preload:", err);
+    });
+  }, [s3ClipsService, workspaceId, clipCounts, sopCategories, date, shift]);
   const loadFirstVideoForCategory = React19.useCallback(async (category) => {
     if (!workspaceId || !s3ClipsService || !isMountedRef.current) return;
     const targetCategory = category || activeFilterRef.current;
@@ -26731,9 +26452,11 @@ var BottlenecksContent = ({
   }, [prefetchData, prefetchStatus, updateClipCounts, updateVideoIndex, hasInitialLoad]);
   React19.useEffect(() => {
     if (s3ClipsService && videoIndex && clipCounts[activeFilter] > 0) {
-      loadFirstVideoForCategory(activeFilter);
+      if (allVideos.length === 0) {
+        loadFirstVideoForCategory(activeFilter);
+      }
     }
-  }, [activeFilter, s3ClipsService, videoIndex, clipCounts, loadFirstVideoForCategory]);
+  }, [activeFilter, s3ClipsService, videoIndex, clipCounts, loadFirstVideoForCategory, allVideos.length]);
   React19.useEffect(() => {
     if (previousFilterRef.current !== activeFilter) {
       console.log(`Filter changed from ${previousFilterRef.current} to ${activeFilter} - resetting to first video`);
@@ -26802,26 +26525,25 @@ var BottlenecksContent = ({
       return new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime();
     });
   }, [activeFilter, allVideos, sopCategories]);
-  React19.useEffect(() => {
-    if (filteredVideos.length === 0) return;
-    const upcoming = [];
-    if (currentIndex + 1 < filteredVideos.length && filteredVideos[currentIndex + 1]) {
-      upcoming.push(filteredVideos[currentIndex + 1].src);
-    }
-    if (currentIndex - 1 >= 0 && currentIndex - 1 < filteredVideos.length && filteredVideos[currentIndex - 1]) {
-      upcoming.push(filteredVideos[currentIndex - 1].src);
-    }
-    if (upcoming.length > 0) {
-      preloadVideosUrl(upcoming);
-    }
-  }, [currentIndex, filteredVideos]);
   React19.useEffect(() => {
     if (isNavigating && currentIndex < filteredVideos.length) {
       setIsNavigating(false);
       setError(null);
       videoRetryCountRef.current = 0;
+      ensureVideosLoaded(currentIndex);
     }
   }, [isNavigating, currentIndex, filteredVideos.length]);
+  React19.useEffect(() => {
+    if (!isPlaying || !isMountedRef.current) return;
+    const preloadInterval = setInterval(() => {
+      if (isMountedRef.current) {
+        const currentIdx = currentIndexRef.current;
+        console.log(`[Background Preloader] Ensuring videos loaded around index ${currentIdx}`);
+        ensureVideosLoaded(currentIdx);
+      }
+    }, 2e3);
+    return () => clearInterval(preloadInterval);
+  }, [isPlaying]);
   const handleNext = React19.useCallback(async () => {
     if (!isMountedRef.current) return;
     const currentIdx = currentIndexRef.current;
@@ -26842,6 +26564,7 @@ var BottlenecksContent = ({
       }
       if (nextIndex < filteredVideos.length) {
         setIsNavigating(false);
+        ensureVideosLoaded(nextIndex);
         return;
       }
       if (isMountedRef.current) {
@@ -26859,8 +26582,8 @@ var BottlenecksContent = ({
             nextIndex,
             true,
             // includeCycleTime
-            true
-            // includeMetadata
+            false
+            // includeMetadata - DON'T fetch metadata during navigation to prevent flooding!
           );
         } else {
           console.warn(`[BottlenecksContent] Video index not ready for navigation: ID: ${currentVideoIndex?._debugId || "NO_ID"}, byCategory exists = ${!!currentVideoIndex?.byCategory}, allVideos = ${currentVideoIndex?.allVideos?.length || 0}`);
@@ -26873,7 +26596,11 @@ var BottlenecksContent = ({
             operationalDate,
             shiftStr,
             effectiveFilter,
-            nextIndex
+            nextIndex,
+            true,
+            // includeCycleTime - needed for main video display
+            false
+            // includeMetadata - DON'T fetch metadata during navigation to prevent flooding!
           );
         }
         if (video && isMountedRef.current) {
@@ -26886,26 +26613,7 @@ var BottlenecksContent = ({
             return prev;
           });
           preloadVideoUrl(video.src);
-          if (nextIndex + 1 < clipCounts[effectiveFilter]) {
-            setTimeout(() => {
-              const videoIndexForPreload = videoIndexRef.current;
-              if (videoIndexForPreload && s3ClipsService && isMountedRef.current) {
-                s3ClipsService.getVideoFromIndex(videoIndexForPreload, effectiveFilter, nextIndex + 1, true, true).then((nextVideo) => {
-                  if (nextVideo && isMountedRef.current) {
-                    setAllVideos((prev) => {
-                      if (!prev.some((v) => v.id === nextVideo.id)) {
-                        const newVideos = [...prev, nextVideo];
-                        return newVideos;
-                      }
-                      return prev;
-                    });
-                    preloadVideoUrl(nextVideo.src);
-                  }
-                }).catch(() => {
-                });
-              }
-            }, 100);
-          }
+          ensureVideosLoaded(nextIndex);
         }
       } catch (error2) {
         console.error("Error loading next video:", error2);
@@ -26927,6 +26635,7 @@ var BottlenecksContent = ({
       if (prevIndex < filteredVideos.length) {
         setCurrentIndex(prevIndex);
         setError(null);
+        ensureVideosLoaded(prevIndex);
       }
     }
   }, [filteredVideos.length]);
@@ -26935,6 +26644,8 @@ var BottlenecksContent = ({
   }, []);
   const handleVideoPlay = React19.useCallback((player) => {
     setIsPlaying(true);
+    const currentIdx = currentIndexRef.current;
+    ensureVideosLoaded(currentIdx);
   }, []);
   const handleVideoPause = React19.useCallback((player) => {
     setIsPlaying(false);
@@ -35500,6 +35211,10 @@ var TargetsViewUI = ({
                 ),
                 /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-8 w-px bg-gray-200/80" }),
                 /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-4 text-sm font-medium text-gray-600", children: [
+                  line.shiftStartTime,
+                  " \u2013 ",
+                  line.shiftEndTime,
+                  " \u2022 ",
                   line.shiftHours,
                   " hours"
                 ] }) })
@@ -36162,7 +35877,7 @@ var TargetsView = ({
   const handleShiftChange = (shiftId) => {
     setSelectedShift(shiftId);
     const loadShiftHours = async () => {
-      const updatedLineWorkspaces = { ...lineWorkspaces };
+      const updatedLineWorkspaces = { ...allShiftsData[shiftId] };
       let hasUpdates = false;
       for (const lineId of lineIds) {
         try {
@@ -36210,7 +35925,10 @@ var TargetsView = ({
         }
       }
       if (hasUpdates) {
-        setLineWorkspaces(updatedLineWorkspaces);
+        setAllShiftsData((prev) => ({
+          ...prev,
+          [shiftId]: updatedLineWorkspaces
+        }));
       }
     };
     loadShiftHours();
@@ -38007,7 +37725,6 @@ exports.apiUtils = apiUtils;
 exports.authCoreService = authCoreService;
 exports.authOTPService = authOTPService;
 exports.authRateLimitService = authRateLimitService;
-exports.cacheService = cacheService;
 exports.checkRateLimit = checkRateLimit2;
 exports.clearAllRateLimits = clearAllRateLimits2;
 exports.clearRateLimit = clearRateLimit2;