administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-04-12 01:57:36 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

verified icon, recognized plate, and clicking tweaks

Browse Source
This commit is contained in:
Josh Hawkins 2025-10-25 09:33:27 -05:00
parent 9ba0305fc5
commit e06c88564c
3 changed files with 49 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
web/src/components/overlay/detail/ObjectLifecycle.tsx
View File

@ -94,6 +94,10 @@ export default function ObjectLifecycle({
);
}, [config, event]);
const label = event.sub_label
? event.sub_label
: getTranslatedLabel(event.label);
const getZoneColor = useCallback(
(zoneName: string) => {
const zoneColor =
@ -635,10 +639,18 @@ export default function ObjectLifecycle({
)}
</div>
<div className="flex items-end gap-2">
<span>{getTranslatedLabel(event.label)}</span>
<span>{label}</span>
<span className="text-secondary-foreground">
{formattedStart ?? ""} - {formattedEnd ?? ""}
</span>
{event.data?.recognized_license_plate && (
<>
·{" "}
<span className="text-sm text-secondary-foreground">
{event.data.recognized_license_plate}
</span>
</>
)}
</div>
</div>
</div>

51
web/src/components/timeline/DetailStream.tsx
View File

@ -254,7 +254,9 @@ function ReviewGroup({
const rawIconLabels: string[] = [
...(fetchedEvents
? fetchedEvents.map((e) => e.label)
? fetchedEvents.map((e) =>
e.sub_label ? e.label + "-verified" : e.label,
)
: (review.data?.objects ?? [])),
...(review.data?.audio ?? []),
];
@ -317,7 +319,7 @@ function ReviewGroup({
<div className="ml-1 flex flex-col items-start gap-1.5">
<div className="flex flex-row gap-3">
<div className="text-sm font-medium">{displayTime}</div>
<div className="flex items-center gap-2">
<div className="relative flex items-center gap-2 text-white">
{iconLabels.slice(0, 5).map((lbl, idx) => (
<div
key={`${lbl}-${idx}`}
@ -427,6 +429,8 @@ function EventList({
const isSelected = selectedObjectIds.includes(event.id);
const label = event.sub_label || getTranslatedLabel(event.label);
const handleObjectSelect = (event: Event | undefined) => {
if (event) {
// onSeek(event.start_time ?? 0);
@ -466,28 +470,43 @@ function EventList({
"bg-secondary-highlight",
)}
>
<div className="ml-1.5 flex w-full items-center justify-between">
<div
className="flex items-center gap-2 text-sm font-medium"
onClick={(e) => {
e.stopPropagation();
handleObjectSelect(isSelected ? undefined : event);
}}
role="button"
>
<div className="ml-1.5 flex w-full items-end justify-between">
<div className="flex flex-1 items-center gap-2 text-sm font-medium">
<div
className={cn(
"rounded-full p-1",
"relative rounded-full p-1 text-white",
isSelected ? "bg-selected" : "bg-muted-foreground",
)}
onClick={(e) => {
e.stopPropagation();
handleObjectSelect(isSelected ? undefined : event);
}}
>
{getIconForLabel(event.label, "size-3 text-white")}
{getIconForLabel(
event.sub_label ? event.label + "-verified" : event.label,
"size-3 text-white",
)}
</div>
<div className="flex items-end gap-2">
<span>{getTranslatedLabel(event.label)}</span>
<div
className="flex flex-1 items-center gap-2"
onClick={(e) => {
e.stopPropagation();
onSeek(event.start_time ?? 0);
}}
role="button"
>
<span>{label}</span>
{event.data?.recognized_license_plate && (
<>
·{" "}
<span className="text-sm text-secondary-foreground">
{event.data.recognized_license_plate}
</span>
</>
)}
</div>
</div>
<div className="mr-2 flex flex-1 flex-row justify-end">
<div className="mr-2 flex flex-row justify-end">
<EventMenu
event={event}
config={config}

1
web/src/types/event.ts
View File

@ -22,6 +22,7 @@ export interface Event {
area: number;
ratio: number;
type: "object" | "audio" | "manual";
recognized_license_plate?: string;
path_data: [number[], number][];
};
}