review settings tweaks

- remove horizontal divider
- update description language for switches
- keep save button disabled until review classification settings change
This commit is contained in:
Josh Hawkins 2026-01-19 20:53:28 -06:00
parent eaddac6211
commit 0f6f131c01
2 changed files with 20 additions and 7 deletions

View File

@ -386,11 +386,11 @@
"title": "Camera Review Settings", "title": "Camera Review Settings",
"object_descriptions": { "object_descriptions": {
"title": "Generative AI Object Descriptions", "title": "Generative AI Object Descriptions",
"desc": "Temporarily enable/disable Generative AI object descriptions for this camera. When disabled, AI generated descriptions will not be requested for tracked objects on this camera." "desc": "Temporarily enable/disable Generative AI object descriptions for this camera until Frigate restarts. When disabled, AI generated descriptions will not be requested for tracked objects on this camera."
}, },
"review_descriptions": { "review_descriptions": {
"title": "Generative AI Review Descriptions", "title": "Generative AI Review Descriptions",
"desc": "Temporarily enable/disable Generative AI review descriptions for this camera. When disabled, AI generated descriptions will not be requested for review items on this camera." "desc": "Temporarily enable/disable Generative AI review descriptions for this camera until Frigate restarts. When disabled, AI generated descriptions will not be requested for review items on this camera."
}, },
"review": { "review": {
"title": "Review", "title": "Review",

View File

@ -1,6 +1,7 @@
import Heading from "@/components/ui/heading"; import Heading from "@/components/ui/heading";
import { useCallback, useContext, useEffect, useMemo, useState } from "react"; import { useCallback, useContext, useEffect, useMemo, useState } from "react";
import { Toaster, toast } from "sonner"; import { toast } from "sonner";
import { Toaster } from "@/components/ui/sonner";
import { import {
Form, Form,
FormControl, FormControl,
@ -158,11 +159,12 @@ export default function CameraReviewSettingsView({
}); });
} }
setChangedValue(true); setChangedValue(true);
setUnsavedChanges(true);
setSelectDetections(isChecked as boolean); setSelectDetections(isChecked as boolean);
}, },
// we know that these deps are correct // we know that these deps are correct
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
[watchedAlertsZones], [watchedAlertsZones, setUnsavedChanges],
); );
const saveToConfig = useCallback( const saveToConfig = useCallback(
@ -197,6 +199,8 @@ export default function CameraReviewSettingsView({
position: "top-center", position: "top-center",
}, },
); );
setChangedValue(false);
setUnsavedChanges(false);
updateConfig(); updateConfig();
} else { } else {
toast.error( toast.error(
@ -229,7 +233,14 @@ export default function CameraReviewSettingsView({
setIsLoading(false); setIsLoading(false);
}); });
}, },
[updateConfig, setIsLoading, selectedCamera, cameraConfig, t], [
updateConfig,
setIsLoading,
selectedCamera,
cameraConfig,
t,
setUnsavedChanges,
],
); );
const onCancel = useCallback(() => { const onCancel = useCallback(() => {
@ -495,6 +506,7 @@ export default function CameraReviewSettingsView({
)} )}
onCheckedChange={(checked) => { onCheckedChange={(checked) => {
setChangedValue(true); setChangedValue(true);
setUnsavedChanges(true);
return checked return checked
? field.onChange([ ? field.onChange([
...field.value, ...field.value,
@ -600,6 +612,8 @@ export default function CameraReviewSettingsView({
zone.name, zone.name,
)} )}
onCheckedChange={(checked) => { onCheckedChange={(checked) => {
setChangedValue(true);
setUnsavedChanges(true);
return checked return checked
? field.onChange([ ? field.onChange([
...field.value, ...field.value,
@ -699,7 +713,6 @@ export default function CameraReviewSettingsView({
)} )}
/> />
</div> </div>
<Separator className="my-2 flex bg-secondary" />
<div className="flex w-full flex-row items-center gap-2 pt-2 md:w-[25%]"> <div className="flex w-full flex-row items-center gap-2 pt-2 md:w-[25%]">
<Button <Button
@ -712,7 +725,7 @@ export default function CameraReviewSettingsView({
</Button> </Button>
<Button <Button
variant="select" variant="select"
disabled={isLoading} disabled={!changedValue || isLoading}
className="flex flex-1" className="flex flex-1"
aria-label={t("button.save", { ns: "common" })} aria-label={t("button.save", { ns: "common" })}
type="submit" type="submit"