diff --git a/web/src/components/timeline/MotionReviewTimeline.tsx b/web/src/components/timeline/MotionReviewTimeline.tsx index deac2ea44..fef69a75f 100644 --- a/web/src/components/timeline/MotionReviewTimeline.tsx +++ b/web/src/components/timeline/MotionReviewTimeline.tsx @@ -90,9 +90,13 @@ export function MotionReviewTimeline({ const motionStart = segmentTime; const motionEnd = motionStart + segmentDuration; + const firstHalfMotionValue = getMotionSegmentValue(motionStart); + const secondHalfMotionValue = getMotionSegmentValue( + motionStart + segmentDuration / 2, + ); + const segmentMotion = - getMotionSegmentValue(motionStart) > 0 || - getMotionSegmentValue(motionStart + segmentDuration / 2) > 0; + firstHalfMotionValue > 0 || secondHalfMotionValue > 0; const overlappingReviewItems = events.some( (item) => (item.start_time >= motionStart && item.start_time < motionEnd) || @@ -110,7 +114,8 @@ export function MotionReviewTimeline({ { - return interpolateMotionAudioData( - getMotionSegmentValue(segmentTime), - maxSegmentWidth, - ); - }, [ - segmentTime, - maxSegmentWidth, - getMotionSegmentValue, - interpolateMotionAudioData, - ]); + return interpolateMotionAudioData(firstHalfMotionValue, maxSegmentWidth); + }, [maxSegmentWidth, firstHalfMotionValue, interpolateMotionAudioData]); const secondHalfSegmentWidth = useMemo(() => { - return interpolateMotionAudioData( - getMotionSegmentValue(segmentTime + segmentDuration / 2), - maxSegmentWidth, - ); - }, [ - segmentTime, - segmentDuration, - maxSegmentWidth, - getMotionSegmentValue, - interpolateMotionAudioData, - ]); + return interpolateMotionAudioData(secondHalfMotionValue, maxSegmentWidth); + }, [maxSegmentWidth, secondHalfMotionValue, interpolateMotionAudioData]); const alignedMinimapStartTime = useMemo( () => alignStartDateToTimeline(minimapStartTime ?? 0),