administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-08 12:15:25 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Improve live updating

Browse Source
This commit is contained in:
Nicolas Mowen 2024-02-06 15:36:32 -07:00
parent deb49df5c9
commit eb98cb4fbf
1 changed files with 11 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
web/src/pages/Live.tsx
View File

@ -4,7 +4,7 @@ import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { Event as FrigateEvent } from "@/types/event"; import { Event as FrigateEvent } from "@/types/event";
import { FrigateConfig } from "@/types/frigateConfig"; import { FrigateConfig } from "@/types/frigateConfig";
import axios from "axios"; import axios from "axios";
import { useCallback, useMemo } from "react"; import { useCallback, useEffect, useMemo, useState } from "react";
import { LuStar } from "react-icons/lu"; import { LuStar } from "react-icons/lu";
import useSWR from "swr"; import useSWR from "swr";
@ -13,12 +13,18 @@ function Live() {
// recent events // recent events
const now = new Date(); const [recentCutoff, setRecentCutoff] = useState<Date>(new Date());
now.setHours(now.getHours() - 4, 0, 0, 0); useEffect(() => {
const recentTimestamp = now.getTime() / 1000; const intervalId: NodeJS.Timeout = setInterval(() => {
const date = new Date();
date.setHours(date.getHours() - 4);
setRecentCutoff(date);
}, 3600000);
return () => clearInterval(intervalId);
}, [3600000]);
const { data: events, mutate: updateEvents } = useSWR<FrigateEvent[]>([ const { data: events, mutate: updateEvents } = useSWR<FrigateEvent[]>([
"events", "events",
{ limit: 10, after: recentTimestamp }, { limit: 10, after: recentCutoff },
]); ]);
const onFavorite = useCallback( const onFavorite = useCallback(
@ -67,11 +73,6 @@ function Live() {
onClick={(e: Event) => onFavorite(e, event)} onClick={(e: Event) => onFavorite(e, event)}
fill={event.retain_indefinitely ? "currentColor" : "none"} fill={event.retain_indefinitely ? "currentColor" : "none"}
/> />
{event.end_time ? null : (
<div className="bg-slate-300 dark:bg-slate-700 absolute bottom-0 text-center w-full uppercase text-sm rounded-bl">
In progress
</div>
)}
</div> </div>
); );
})} })}