Link to relevant page from status bar warnings / errors (#11140)

* Use hash state for system pages

* Add links to items

* Add stats to other types

* Link on mobile as well

* Use link

* Cleanup using util
This commit is contained in:
Nicolas Mowen
2024-04-28 16:59:03 -06:00
committed by GitHub
parent c2c6113299
commit acf37f9920
7 changed files with 79 additions and 24 deletions

View File

@@ -11,6 +11,8 @@ import { FaVideo } from "react-icons/fa";
import Logo from "@/components/Logo";
import useOptimisticState from "@/hooks/use-optimistic-state";
import CameraMetrics from "@/views/system/CameraMetrics";
import { useHashState } from "@/hooks/use-overlay-state";
import { capitalizeFirstLetter } from "@/utils/stringUtil";
const metrics = ["general", "storage", "cameras"] as const;
type SystemMetric = (typeof metrics)[number];
@@ -18,12 +20,18 @@ type SystemMetric = (typeof metrics)[number];
function System() {
// stats page
const [page, setPage] = useState<SystemMetric>("general");
const [pageToggle, setPageToggle] = useOptimisticState(page, setPage, 100);
const [page, setPage] = useHashState<SystemMetric>();
const [pageToggle, setPageToggle] = useOptimisticState(
page ?? "general",
setPage,
100,
);
const [lastUpdated, setLastUpdated] = useState<number>(Date.now() / 1000);
useEffect(() => {
document.title = `${pageToggle[0].toUpperCase()}${pageToggle.substring(1)} Stats - Frigate`;
if (pageToggle) {
document.title = `${capitalizeFirstLetter(pageToggle)} Stats - Frigate`;
}
}, [pageToggle]);
// stats collection