mirror of
https://github.com/blakeblackshear/frigate.git
synced 2025-12-06 13:34:13 +03:00
Camera group url fixes (#20295)
* Fix group url param where a camera group was not always loaded Need to use the loading state from the usePersistence hook because values are loaded from indexed db asynchronously * ensure group icon changes when using url param * clean up
This commit is contained in:
parent
1b6c246a44
commit
16c88fa8ac
@ -109,7 +109,7 @@ export function CameraGroupSelector({ className }: CameraGroupSelectorProps) {
|
|||||||
|
|
||||||
// groups
|
// groups
|
||||||
|
|
||||||
const [group, setGroup, deleteGroup] = usePersistedOverlayState(
|
const [group, setGroup, , deleteGroup] = usePersistedOverlayState(
|
||||||
"cameraGroup",
|
"cameraGroup",
|
||||||
"default" as string,
|
"default" as string,
|
||||||
);
|
);
|
||||||
|
|||||||
@ -40,6 +40,7 @@ export function usePersistedOverlayState<S extends string>(
|
|||||||
): [
|
): [
|
||||||
S | undefined,
|
S | undefined,
|
||||||
(value: S | undefined, replace?: boolean) => void,
|
(value: S | undefined, replace?: boolean) => void,
|
||||||
|
boolean,
|
||||||
() => void,
|
() => void,
|
||||||
] {
|
] {
|
||||||
const location = useLocation();
|
const location = useLocation();
|
||||||
@ -55,7 +56,7 @@ export function usePersistedOverlayState<S extends string>(
|
|||||||
|
|
||||||
// saved value from previous session
|
// saved value from previous session
|
||||||
|
|
||||||
const [persistedValue, setPersistedValue, , deletePersistedValue] =
|
const [persistedValue, setPersistedValue, loaded, deletePersistedValue] =
|
||||||
usePersistence<S>(key, overlayStateValue);
|
usePersistence<S>(key, overlayStateValue);
|
||||||
|
|
||||||
const setOverlayStateValue = useCallback(
|
const setOverlayStateValue = useCallback(
|
||||||
@ -73,6 +74,7 @@ export function usePersistedOverlayState<S extends string>(
|
|||||||
return [
|
return [
|
||||||
overlayStateValue ?? persistedValue ?? defaultValue,
|
overlayStateValue ?? persistedValue ?? defaultValue,
|
||||||
setOverlayStateValue,
|
setOverlayStateValue,
|
||||||
|
loaded,
|
||||||
deletePersistedValue,
|
deletePersistedValue,
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|||||||
@ -24,17 +24,21 @@ function Live() {
|
|||||||
// selection
|
// selection
|
||||||
|
|
||||||
const [selectedCameraName, setSelectedCameraName] = useHashState();
|
const [selectedCameraName, setSelectedCameraName] = useHashState();
|
||||||
const [cameraGroup, setCameraGroup] = usePersistedOverlayState(
|
const [cameraGroup, setCameraGroup, loaded, ,] = usePersistedOverlayState(
|
||||||
"cameraGroup",
|
"cameraGroup",
|
||||||
"default" as string,
|
"default" as string,
|
||||||
);
|
);
|
||||||
|
|
||||||
useSearchEffect("group", (cameraGroup) => {
|
useSearchEffect("group", (cameraGroup) => {
|
||||||
if (config && cameraGroup) {
|
if (config && cameraGroup && loaded) {
|
||||||
const group = config.camera_groups[cameraGroup];
|
const group = config.camera_groups[cameraGroup];
|
||||||
|
|
||||||
if (group) {
|
if (group) {
|
||||||
setCameraGroup(cameraGroup);
|
setCameraGroup(cameraGroup);
|
||||||
|
// return false so that url cleanup doesn't occur here.
|
||||||
|
// will be cleaned up by usePersistedOverlayState in the
|
||||||
|
// camera group selector so that the icon switches correctly
|
||||||
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user