reduce preview calculations on rerenders

This commit is contained in:
Nicolas Mowen 2024-02-29 12:36:05 -07:00
parent feb4a6fb32
commit 540a33fcdc
2 changed files with 14 additions and 11 deletions

View File

@ -32,7 +32,7 @@ import { useSwipeable } from "react-swipeable";
type PreviewPlayerProps = {
review: ReviewSegment;
relevantPreview?: Preview;
allPreviews?: Preview[];
autoPlayback?: boolean;
setReviewed?: (reviewId: string) => void;
onTimeUpdate?: (time: number | undefined) => void;
@ -49,7 +49,7 @@ type Preview = {
export default function PreviewThumbnailPlayer({
review,
relevantPreview,
allPreviews,
setReviewed,
onClick,
onTimeUpdate,
@ -87,6 +87,17 @@ export default function PreviewThumbnailPlayer({
// playback
const relevantPreview = useMemo(
() =>
Object.values(allPreviews || []).find(
(preview) =>
preview.camera == review.camera &&
preview.start < review.start_time &&
preview.end > review.end_time,
),
[allPreviews],
);
const playingBack = useMemo(() => playback, [playback]);
const onPlayback = useCallback(

View File

@ -305,14 +305,6 @@ export default function EventView({
currentItems.map((value, segIdx) => {
const lastRow = segIdx == reviewItems[severity].length - 1;
const selected = selectedReviews.includes(value.id);
const relevantPreview = Object.values(
relevantPreviews || [],
).find(
(preview) =>
preview.camera == value.camera &&
preview.start < value.start_time &&
preview.end > value.end_time,
);
return (
<div
@ -328,7 +320,7 @@ export default function EventView({
<div className="aspect-video rounded-lg overflow-hidden">
<PreviewThumbnailPlayer
review={value}
relevantPreview={relevantPreview}
allPreviews={relevantPreviews}
setReviewed={markItemAsReviewed}
onTimeUpdate={setPreviewTime}
onClick={onSelectReview}