Publish finished reviews to mqtt / ws and use that for source of update banner

frigate/review/maintainer.py

@@ -1,5 +1,6 @@
 """Maintain review segments in db."""
 
+import json
 import logging
 import os
 import random
@@ -138,7 +139,14 @@ def __init__(self, config: FrigateConfig, stop_event: MpEvent):
 
  def end_segment(self, segment: PendingReviewSegment) -> None:
  """End segment."""
- self.requestor.send_data(UPSERT_REVIEW_SEGMENT, segment.end())
+ seg_data = segment.end()
+ self.requestor.send_data(UPSERT_REVIEW_SEGMENT, seg_data)
+ self.requestor.send_data(
+ "reviews",
+ json.dumps(
+ {"type": "end", "review": {k.name: v for k, v in seg_data.items()}}
+ ),
+ )
  self.active_review_segments[segment.camera] = None
 
  def update_existing_segment(

web/src/api/ws.tsx

@@ -10,7 +10,7 @@ import {
 import { produce, Draft } from "immer";
 import useWebSocket, { ReadyState } from "react-use-websocket";
 import { FrigateConfig } from "@/types/frigateConfig";
-import { FrigateEvent, ToggleableSetting } from "@/types/ws";
+import { FrigateEvent, FrigateReview, ToggleableSetting } from "@/types/ws";
 import { FrigateStats } from "@/types/stats";
 
 type ReducerState = {
@@ -218,7 +218,14 @@ export function useRestart(): {
 export function useFrigateEvents(): { payload: FrigateEvent } {
  const {
  value: { payload },
- } = useWs(`events`, "");
+ } = useWs("events", "");
+ return { payload };
+}
+
+export function useFrigateReviews(): { payload: FrigateReview } {
+ const {
+ value: { payload },
+ } = useWs("reviews", "");
  return { payload };
 }
 

web/src/pages/Events.tsx

@@ -1,7 +1,7 @@
-import { useFrigateEvents } from "@/api/ws";
+import { useFrigateReviews } from "@/api/ws";
 import useApiFilter from "@/hooks/use-api-filter";
 import useOverlayState from "@/hooks/use-overlay-state";
-import { ReviewFilter, ReviewSegment } from "@/types/review";
+import { ReviewFilter, ReviewSegment, ReviewSeverity } from "@/types/review";
 import DesktopEventView from "@/views/events/DesktopEventView";
 import DesktopRecordingView from "@/views/events/DesktopRecordingView";
 import MobileEventView from "@/views/events/MobileEventView";
@@ -15,6 +15,8 @@ const API_LIMIT = 250;
 
 export default function Events() {
  // recordings viewer
+
+ const [severity, setSeverity] = useState<ReviewSeverity>("alert");
  const [selectedReviewId, setSelectedReviewId] = useOverlayState("review");
 
  // review filter
@@ -97,6 +99,11 @@ export default function Events() {
  setSize(size + 1);
  }, [size]);
 
+ const reloadData = useCallback(() => {
+ setSize(1);
+ updateSegments();
+ }, [])
+
  // preview videos
 
  const previewTimes = useMemo(() => {
@@ -196,22 +203,21 @@ export default function Events() {
 
  // review updates
 
- const { payload: eventUpdate } = useFrigateEvents();
+ const { payload: reviewUpdate } = useFrigateReviews();
  const [hasUpdate, setHasUpdate] = useState(false);
  useEffect(() => {
- if (!eventUpdate) {
+ if (!reviewUpdate || hasUpdate) {
  return;
  }
 
- // if event is ended and was saved, update events list
  if (
- eventUpdate.type == "end" &&
- (eventUpdate.after.has_clip || eventUpdate.after.has_snapshot)
+ reviewUpdate.type == "end" &&
+ reviewUpdate.review.severity == severity
  ) {
  setHasUpdate(true);
  return;
  }
- }, [eventUpdate]);
+ }, [reviewUpdate]);
 
  if (selectedData) {
  return (
@@ -229,11 +235,13 @@ export default function Events() {
  relevantPreviews={allPreviews}
  reachedEnd={isDone}
  isValidating={isValidating}
+ severity={severity}
  hasUpdate={hasUpdate}
+ setSeverity={setSeverity}
  setHasUpdate={setHasUpdate}
  loadNextPage={onLoadNextPage}
  markItemAsReviewed={markItemAsReviewed}
- pullLatestData={updateSegments}
+ pullLatestData={reloadData}
  />
  );
  }
@@ -246,12 +254,14 @@ export default function Events() {
  reachedEnd={isDone}
  isValidating={isValidating}
  filter={reviewFilter}
+ severity={severity}
  hasUpdate={hasUpdate}
+ setSeverity={setSeverity}
  setHasUpdate={setHasUpdate}
  loadNextPage={onLoadNextPage}
  markItemAsReviewed={markItemAsReviewed}
  onSelectReview={setSelectedReviewId}
- pullLatestData={updateSegments}
+ pullLatestData={reloadData}
  updateFilter={onUpdateFilter}
  />
  );

web/src/types/ws.ts

@@ -1,3 +1,5 @@
+import { ReviewSegment } from "./review";
+
 type FrigateObjectState = {
  id: string;
  camera: string;
@@ -27,6 +29,11 @@ type FrigateObjectState = {
  };
 };
 
+export interface FrigateReview {
+ type: "new" | "update" | "end";
+ review: ReviewSegment;
+}
+
 export interface FrigateEvent {
  type: "new" | "update" | "end";
  before: FrigateObjectState;

web/src/views/events/DesktopEventView.tsx

@@ -18,7 +18,9 @@ type DesktopEventViewProps = {
  reachedEnd: boolean;
  isValidating: boolean;
  filter?: ReviewFilter;
+ severity: ReviewSeverity;
  hasUpdate: boolean;
+ setSeverity: (severity: ReviewSeverity) => void;
  setHasUpdate: (hasUpdated: boolean) => void;
  loadNextPage: () => void;
  markItemAsReviewed: (reviewId: string) => void;
@@ -33,7 +35,9 @@ export default function DesktopEventView({
  reachedEnd,
  isValidating,
  filter,
+ severity,
  hasUpdate,
+ setSeverity,
  setHasUpdate,
  loadNextPage,
  markItemAsReviewed,
@@ -42,7 +46,6 @@ export default function DesktopEventView({
  updateFilter,
 }: DesktopEventViewProps) {
  const { data: config } = useSWR<FrigateConfig>("config");
- const [severity, setSeverity] = useState<ReviewSeverity>("alert");
  const contentRef = useRef<HTMLDivElement | null>(null);
 
  // review paging

web/src/views/events/MobileEventView.tsx

@@ -14,7 +14,9 @@ type MobileEventViewProps = {
  relevantPreviews?: Preview[];
  reachedEnd: boolean;
  isValidating: boolean;
+ severity: ReviewSeverity;
  hasUpdate: boolean;
+ setSeverity: (severity: ReviewSeverity) => void;
  setHasUpdate: (hasUpdated: boolean) => void;
  loadNextPage: () => void;
  markItemAsReviewed: (reviewId: string) => void;
@@ -25,14 +27,15 @@ export default function MobileEventView({
  relevantPreviews,
  reachedEnd,
  isValidating,
+ severity,
  hasUpdate,
+ setSeverity,
  setHasUpdate,
  loadNextPage,
  markItemAsReviewed,
  pullLatestData,
 }: MobileEventViewProps) {
  const { data: config } = useSWR<FrigateConfig>("config");
- const [severity, setSeverity] = useState<ReviewSeverity>("alert");
  const contentRef = useRef<HTMLDivElement | null>(null);
 
  // review paging