Add GenAI info to detail stream (#20527)
Some checks are pending
CI / ARM Extra Build (push) Blocked by required conditions
CI / Synaptics Build (push) Blocked by required conditions
CI / AMD64 Build (push) Waiting to run
CI / ARM Build (push) Waiting to run
CI / Jetson Jetpack 6 (push) Waiting to run
CI / AMD64 Extra Build (push) Blocked by required conditions
CI / Assemble and push default build (push) Blocked by required conditions

* Add camera previews back

* Add genai info
This commit is contained in:
Nicolas Mowen 2025-10-16 07:55:10 -06:00 committed by GitHub
parent b52044aecc
commit 9599450cff
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 67 additions and 61 deletions

View File

@ -1,4 +1,4 @@
import { useEffect, useRef, useState } from "react";
import { useEffect, useMemo, useRef, useState } from "react";
import { ObjectLifecycleSequence } from "@/types/timeline";
import { LifecycleIcon } from "@/components/overlay/detail/ObjectLifecycle";
import { getLifecycleItemDescription } from "@/utils/lifecycleUtil";
@ -256,9 +256,18 @@ function ReviewGroup({
}
}
const objectCount = fetchedEvents
? fetchedEvents.length
: (review.data.objects ?? []).length;
const reviewInfo = useMemo(() => {
if (review.data.metadata?.title) {
return review.data.metadata.title;
} else {
const objectCount = fetchedEvents
? fetchedEvents.length
: (review.data.objects ?? []).length;
return `${objectCount} ${t("detail.trackedObject", { count: objectCount })}`;
}
}, [review, t, fetchedEvents]);
return (
<div
data-review-id={id}
@ -278,9 +287,7 @@ function ReviewGroup({
<div className="flex items-center gap-2">
<div className="flex flex-col">
<div className="text-sm font-medium">{displayTime}</div>
<div className="text-xs text-muted-foreground">
{objectCount} {t("detail.trackedObject", { count: objectCount })}
</div>
<div className="text-xs text-muted-foreground">{reviewInfo}</div>
</div>
</div>
<div className="flex items-center gap-2">

View File

@ -774,62 +774,61 @@ export function RecordingView({
containerRef={mainLayoutRef}
/>
</div>
{isDesktop &&
effectiveCameras.length > 1 &&
timelineType !== "detail" && (
<div
ref={previewRowRef}
className={cn(
"scrollbar-container flex gap-2 overflow-auto",
mainCameraAspect == "tall"
? "h-full w-72 flex-col"
: `h-28 w-full`,
previewRowOverflows ? "" : "items-center justify-center",
)}
>
<div className="w-2" />
{effectiveCameras.map((cam) => {
if (cam == mainCamera || cam == "birdseye") {
return;
}
{isDesktop && effectiveCameras.length > 1 && (
<div
ref={previewRowRef}
className={cn(
"scrollbar-container flex gap-2 overflow-auto",
mainCameraAspect == "tall"
? "h-full w-72 flex-col"
: `h-28 w-full`,
previewRowOverflows ? "" : "items-center justify-center",
timelineType == "detail" && "mt-4",
)}
>
<div className="w-2" />
{effectiveCameras.map((cam) => {
if (cam == mainCamera || cam == "birdseye") {
return;
}
return (
<Tooltip key={cam}>
<TooltipTrigger asChild>
<div
className={
mainCameraAspect == "tall" ? "w-full" : "h-full"
}
style={{
aspectRatio: getCameraAspect(cam),
return (
<Tooltip key={cam}>
<TooltipTrigger asChild>
<div
className={
mainCameraAspect == "tall" ? "w-full" : "h-full"
}
style={{
aspectRatio: getCameraAspect(cam),
}}
>
<PreviewPlayer
previewRef={previewRef}
className="size-full"
camera={cam}
timeRange={currentTimeRange}
cameraPreviews={allPreviews ?? []}
startTime={startTime}
isScrubbing={scrubbing}
isVisible={visiblePreviews.includes(cam)}
onControllerReady={(controller) => {
previewRefs.current[cam] = controller;
controller.scrubToTimestamp(startTime);
}}
>
<PreviewPlayer
previewRef={previewRef}
className="size-full"
camera={cam}
timeRange={currentTimeRange}
cameraPreviews={allPreviews ?? []}
startTime={startTime}
isScrubbing={scrubbing}
isVisible={visiblePreviews.includes(cam)}
onControllerReady={(controller) => {
previewRefs.current[cam] = controller;
controller.scrubToTimestamp(startTime);
}}
onClick={() => onSelectCamera(cam)}
/>
</div>
</TooltipTrigger>
<TooltipContent className="smart-capitalize">
<CameraNameLabel camera={cam} />
</TooltipContent>
</Tooltip>
);
})}
<div className="w-2" />
</div>
)}
onClick={() => onSelectCamera(cam)}
/>
</div>
</TooltipTrigger>
<TooltipContent className="smart-capitalize">
<CameraNameLabel camera={cam} />
</TooltipContent>
</Tooltip>
);
})}
<div className="w-2" />
</div>
)}
</div>
</div>
<Timeline