Improve event switching speed

This commit is contained in:
Nicolas Mowen 2024-04-11 09:33:46 -06:00
parent 9b62ceade0
commit 826f02317c

View File

@ -295,6 +295,7 @@ export default function EventView({
filter={filter} filter={filter}
timeRange={timeRange} timeRange={timeRange}
startTime={startTime} startTime={startTime}
loading={severity != severityToggle}
markItemAsReviewed={markItemAsReviewed} markItemAsReviewed={markItemAsReviewed}
markAllItemsAsReviewed={markAllItemsAsReviewed} markAllItemsAsReviewed={markAllItemsAsReviewed}
onSelectReview={onSelectReview} onSelectReview={onSelectReview}
@ -334,6 +335,7 @@ type DetectionReviewProps = {
filter?: ReviewFilter; filter?: ReviewFilter;
timeRange: { before: number; after: number }; timeRange: { before: number; after: number };
startTime?: number; startTime?: number;
loading: boolean;
markItemAsReviewed: (review: ReviewSegment) => void; markItemAsReviewed: (review: ReviewSegment) => void;
markAllItemsAsReviewed: (currentItems: ReviewSegment[]) => void; markAllItemsAsReviewed: (currentItems: ReviewSegment[]) => void;
onSelectReview: (review: ReviewSegment, ctrl: boolean) => void; onSelectReview: (review: ReviewSegment, ctrl: boolean) => void;
@ -349,6 +351,7 @@ function DetectionReview({
filter, filter,
timeRange, timeRange,
startTime, startTime,
loading,
markItemAsReviewed, markItemAsReviewed,
markAllItemsAsReviewed, markAllItemsAsReviewed,
onSelectReview, onSelectReview,
@ -600,6 +603,9 @@ function DetectionReview({
</div> </div>
<div className="w-[65px] md:w-[110px] flex flex-row"> <div className="w-[65px] md:w-[110px] flex flex-row">
<div className="w-[55px] md:w-[100px] overflow-y-auto no-scrollbar"> <div className="w-[55px] md:w-[100px] overflow-y-auto no-scrollbar">
{loading ? (
<Skeleton className="size-full" />
) : (
<EventReviewTimeline <EventReviewTimeline
segmentDuration={segmentDuration} segmentDuration={segmentDuration}
timestampSpread={15} timestampSpread={15}
@ -617,8 +623,12 @@ function DetectionReview({
timelineRef={reviewTimelineRef} timelineRef={reviewTimelineRef}
dense={isMobile} dense={isMobile}
/> />
)}
</div> </div>
<div className="w-[10px]"> <div className="w-[10px]">
{loading ? (
<Skeleton className="w-full" />
) : (
<SummaryTimeline <SummaryTimeline
reviewTimelineRef={reviewTimelineRef} reviewTimelineRef={reviewTimelineRef}
timelineStart={timeRange.before} timelineStart={timeRange.before}
@ -627,6 +637,7 @@ function DetectionReview({
events={reviewItems?.all ?? []} events={reviewItems?.all ?? []}
severityType={severity} severityType={severity}
/> />
)}
</div> </div>
</div> </div>
</> </>