From 1aa788b759024d6a85646fb2353313c7a5afa60c Mon Sep 17 00:00:00 2001 From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com> Date: Tue, 20 Feb 2024 16:20:32 -0600 Subject: [PATCH] use ReviewSegment type --- .../timeline/EventReviewTimeline.tsx | 4 ++-- web/src/components/timeline/EventSegment.tsx | 4 ++-- web/src/hooks/use-event-utils.ts | 4 ++-- web/src/hooks/use-segment-utils.ts | 19 +++++++++++++----- web/src/pages/UIPlayground.tsx | 4 ++-- web/src/types/review.ts | 20 +++++++++++++++++++ 6 files changed, 42 insertions(+), 13 deletions(-) create mode 100644 web/src/types/review.ts diff --git a/web/src/components/timeline/EventReviewTimeline.tsx b/web/src/components/timeline/EventReviewTimeline.tsx index 20ea08492..fc0c9d16d 100644 --- a/web/src/components/timeline/EventReviewTimeline.tsx +++ b/web/src/components/timeline/EventReviewTimeline.tsx @@ -9,7 +9,7 @@ import { } from "react"; import EventSegment from "./EventSegment"; import { useEventUtils } from "@/hooks/use-event-utils"; -import { Event } from "@/types/event"; +import { ReviewSegment } from "@/types/review"; export type EventReviewTimelineProps = { segmentDuration: number; @@ -21,7 +21,7 @@ export type EventReviewTimelineProps = { showMinimap?: boolean; minimapStartTime?: number; minimapEndTime?: number; - events: Event[]; + events: ReviewSegment[]; severityType: string; contentRef: RefObject; }; diff --git a/web/src/components/timeline/EventSegment.tsx b/web/src/components/timeline/EventSegment.tsx index 07ba503a4..8aba4fb25 100644 --- a/web/src/components/timeline/EventSegment.tsx +++ b/web/src/components/timeline/EventSegment.tsx @@ -1,10 +1,10 @@ import { useEventUtils } from "@/hooks/use-event-utils"; import { useSegmentUtils } from "@/hooks/use-segment-utils"; -import { Event } from "@/types/event"; +import { ReviewSegment } from "@/types/review"; import { useMemo } from "react"; type EventSegmentProps = { - events: Event[]; + events: ReviewSegment[]; segmentTime: number; segmentDuration: number; timestampSpread: number; diff --git a/web/src/hooks/use-event-utils.ts b/web/src/hooks/use-event-utils.ts index d7f4d64ca..d98ede6d8 100644 --- a/web/src/hooks/use-event-utils.ts +++ b/web/src/hooks/use-event-utils.ts @@ -1,7 +1,7 @@ import { useCallback } from 'react'; -import { Event } from '@/types/event'; +import { ReviewSegment } from '@/types/review'; -export const useEventUtils = (events: Event[], segmentDuration: number) => { +export const useEventUtils = (events: ReviewSegment[], segmentDuration: number) => { const isStartOfEvent = useCallback((time: number): boolean => { return events.some((event) => { const segmentStart = getSegmentStart(event.start_time); diff --git a/web/src/hooks/use-segment-utils.ts b/web/src/hooks/use-segment-utils.ts index d60638342..e0ed9f542 100644 --- a/web/src/hooks/use-segment-utils.ts +++ b/web/src/hooks/use-segment-utils.ts @@ -1,9 +1,9 @@ import { useCallback, useMemo } from 'react'; -import { Event } from '@/types/event'; +import { ReviewSegment } from '@/types/review'; export const useSegmentUtils = ( segmentDuration: number, - events: Event[], + events: ReviewSegment[], severityType: string, ) => { const getSegmentStart = useCallback((time: number): number => { @@ -20,7 +20,7 @@ export const useSegmentUtils = ( const mapSeverityToNumber = useCallback((severity: string): number => { switch (severity) { - case "motion": + case "significant_motion": return 1; case "detection": return 2; @@ -117,8 +117,17 @@ export const useSegmentUtils = ( roundBottom = !hasPrevOtherEvent; roundTop = !hasNextOtherEvent; } else { - roundTop = !hasNextSeverityEvent && !hasNextOtherEvent; - roundBottom = !hasPrevSeverityEvent && !hasPrevOtherEvent; + roundTop = !hasNextSeverityEvent || !hasNextOtherEvent; + roundBottom = !hasPrevSeverityEvent || !hasPrevOtherEvent; + } + + if (segmentTime == 1708459740) { + console.log("hasOverlappingSeverityEvent: " + hasOverlappingSeverityEvent) + console.log("hasPrevSeverityEvent: " + hasPrevSeverityEvent) + console.log("hasNextSeverityEvent: " + hasNextSeverityEvent) + console.log("hasOverlappingOtherEvent: " + hasOverlappingOtherEvent) + console.log("hasPrevOtherEvent: " + hasPrevOtherEvent) + console.log("hasNextOtherEvent: "+hasNextOtherEvent) } return { diff --git a/web/src/pages/UIPlayground.tsx b/web/src/pages/UIPlayground.tsx index e2507c190..b538ac89a 100644 --- a/web/src/pages/UIPlayground.tsx +++ b/web/src/pages/UIPlayground.tsx @@ -10,6 +10,7 @@ import ActivityIndicator from "@/components/ui/activity-indicator"; import { useApiHost } from "@/api"; import TimelineScrubber from "@/components/playground/TimelineScrubber"; import EventReviewTimeline from "@/components/timeline/EventReviewTimeline"; +import { ReviewSegment } from "@/types/review"; // Color data const colors = [ @@ -72,7 +73,7 @@ function UIPlayground() { const { data: config } = useSWR("config"); const [timeline, setTimeline] = useState(undefined); const contentRef = useRef(null); - const [mockEvents, setMockEvents] = useState([]); + const [mockEvents, setMockEvents] = useState([]); const onSelect = useCallback(({ items }: { items: string[] }) => { setTimeline(items[0]); @@ -91,7 +92,6 @@ function UIPlayground() { useMemo(() => { const initialEvents = Array.from({ length: 50 }, generateRandomEvent); setMockEvents(initialEvents); - console.log(initialEvents); }, []); return ( diff --git a/web/src/types/review.ts b/web/src/types/review.ts new file mode 100644 index 000000000..f7a0bb57e --- /dev/null +++ b/web/src/types/review.ts @@ -0,0 +1,20 @@ +export interface ReviewSegment { + id: string; + camera: string; + severity: ReviewSeverity; + start_time: number; + end_time: number; + thumb_path: string; + has_been_reviewed: boolean; + data: ReviewData; + } + + export type ReviewSeverity = "alert" | "detection" | "significant_motion"; + + type ReviewData = { + audio: string[]; + detections: string[]; + objects: string[]; + significant_motion_areas: number[]; + zones: string[]; + }; \ No newline at end of file