chore: video section issues

src/components/video-player-section.tsx

@@ -32,8 +32,9 @@ type LogAction = { type: 'ADD_LOG'; payload: DetectionLogEntry } | { type: 'CLEA
 function logsReducer(state: DetectionLogEntry[], action: LogAction): DetectionLogEntry[] {
   switch (action.type) {
     case 'ADD_LOG':
-      if (state.length > 0 && state[0].frame === action.payload.frame) return state;
-      return [action.payload, ...state].slice(0, MAX_LOGS);
+      // Move to top if already exists, or just add to top
+      const filtered = state.filter((log) => log.frame !== action.payload.frame);
+      return [action.payload, ...filtered].slice(0, MAX_LOGS);
     case 'CLEAR':
       return [];
     default:
@@ -87,7 +88,10 @@ export default function VideoPlayerSection({
 
   // Custom Hooks
   const gpsMap = useGpsMap(data);
-  const { getNearestDetections } = useFrameDetectionMap(data, detectionType);
+  const { getNearestDetections, sortedDetectionIndices } = useFrameDetectionMap(
+    data,
+    detectionType,
+  );
   const { getStickyCounts, sortedFrameIndices } = useCumulativeCounts(data.frames);
 
   // Memoized video URL
@@ -119,10 +123,8 @@ export default function VideoPlayerSection({
       // Frame stats
       setCurrentFrameCounts(counts);
 
-      // Logging logic (throttled/batched by frame ID)
-      if (dets && dets.length > 0 && !loggedFrames.current.has(frame)) {
-        loggedFrames.current.add(frame);
-
+      // Logging logic
+      if (dets && dets.length > 0) {
         const firstDetId = dets[0].pothole_id ?? dets[0].signboard_id ?? dets[0].detection_id;
         const coords = gpsMap.get(firstDetId);
 
@@ -148,7 +150,7 @@ export default function VideoPlayerSection({
         });
       }
     },
-    [data.video_info.fps, getNearestDetections, getStickyCounts, gpsMap, sortedFrameIndices],
+    [data.video_info.fps, getNearestDetections, getStickyCounts, gpsMap, sortedDetectionIndices],
   );
 
   // Playback loop hook
@@ -173,9 +175,20 @@ export default function VideoPlayerSection({
   const handleVideoSeeked = useCallback(() => {
     const video = videoRef.current;
     if (!video) return;
-    const frame = Math.round(video.currentTime * data.video_info.fps);
-    handleFrameUpdate(frame);
-  }, [data.video_info.fps, handleFrameUpdate]);
+
+    const fps = data.video_info.fps || 30;
+    const currentFrame = Math.round(video.currentTime * fps);
+
+    // Snap to the next available frame index that has detections
+    const nextDetectionFrame = sortedDetectionIndices.find((f) => f >= currentFrame);
+
+    if (nextDetectionFrame !== undefined && nextDetectionFrame !== currentFrame) {
+      video.currentTime = nextDetectionFrame / fps;
+      return;
+    }
+
+    handleFrameUpdate(currentFrame);
+  }, [data.video_info.fps, handleFrameUpdate, sortedDetectionIndices]);
 
   const seekToFrame = useCallback(
     (frame: number) => {
@@ -216,7 +229,7 @@ export default function VideoPlayerSection({
                 onLoadedData={handleLoadedData}
                 onEnded={handleVideoEnded}
                 onSeeked={handleVideoSeeked}
-                currentDetections={getNearestDetections(currentFrame, sortedFrameIndices) || []}
+                currentDetections={getNearestDetections(currentFrame, sortedDetectionIndices) || []}
               />
 
               <DetectionStatsBar