Implement support for no recordings indicator on timeline (#18363)

* Indicate no recordings on the history timeline with gray hash marks

This commit includes a new backend API endpoint and the frontend changes needed to support this functionality

* don't show slashes for now

web/src/components/timeline/MotionReviewTimeline.tsx

@@ -17,6 +17,7 @@ import {
   VirtualizedMotionSegments,
   VirtualizedMotionSegmentsRef,
 } from "./VirtualizedMotionSegments";
+import { RecordingSegment } from "@/types/record";
 
 export type MotionReviewTimelineProps = {
   segmentDuration: number;
@@ -38,6 +39,7 @@ export type MotionReviewTimelineProps = {
   setExportEndTime?: React.Dispatch<React.SetStateAction<number>>;
   events: ReviewSegment[];
   motion_events: MotionData[];
+  noRecordingRanges?: RecordingSegment[];
   contentRef: RefObject<HTMLDivElement>;
   timelineRef?: RefObject<HTMLDivElement>;
   onHandlebarDraggingChange?: (isDragging: boolean) => void;
@@ -66,6 +68,7 @@ export function MotionReviewTimeline({
   setExportEndTime,
   events,
   motion_events,
+  noRecordingRanges,
   contentRef,
   timelineRef,
   onHandlebarDraggingChange,
@@ -97,6 +100,17 @@ export function MotionReviewTimeline({
     motion_events,
   );
 
+  const getRecordingAvailability = useCallback(
+    (time: number): boolean | undefined => {
+      if (!noRecordingRanges?.length) return undefined;
+
+      return !noRecordingRanges.some(
+        (range) => time >= range.start_time && time < range.end_time,
+      );
+    },
+    [noRecordingRanges],
+  );
+
   const segmentTimes = useMemo(() => {
     const segments = [];
     let segmentTime = timelineStartAligned;
@@ -206,6 +220,7 @@ export function MotionReviewTimeline({
         dense={dense}
         motionOnly={motionOnly}
         getMotionSegmentValue={getMotionSegmentValue}
+        getRecordingAvailability={getRecordingAvailability}
       />
     </ReviewTimeline>
   );