frigate/web/src/components/config-form/ConfigMessageBanner.tsx
Josh Hawkins 7413ce08d4
Merge detector and model in settings UI (#23216)
* add embedded mode to BaseSection so parents can host the save action

* add optional action slot to current Frigate+ model summary

* add w-full to action slot flex wrapper for explicit width contract

* i18n

* merged detectors and model settings view

* fix document title

* Embed detector form in merged settings view

* add detection model card with tabs and custom model embed

* add Frigate+ model selector with filter popover to merged page

* Add mismatch banner and gate save on detector and model compatibility

* Wire atomic save, restart toast, and undo on detectors and model page

* Clear child pending data on undo

* route merged detectors and model view in settings

* trim Frigate+ page to account-only and remove old detection model view

* basic e2e

* Fix unsaved-changes guard, custom path leak, and post-failure cache resync

* Rename to Detectors and model, float Modified badge, use ConfigMessageBanner for mismatch

* Hide Plus/Custom tabs when Frigate+ is not enabled

* Detect active Plus model via model.plus.id instead of path prefix

* Sync state back to snapshot when child form un-modifies and remount on undo

* Always require restart on save since model changes also need one

* Wrap Frigate+ model selector in SplitCardRow with label and description

* rename tab

* update docs

* sync top-level model with default detector's resolved model

when the user doesn't define a top-level `model:` block, `FrigateConfig.model` stayed at pydantic field defaults (320×320, /labelmap.txt) while the per-detector model picked up `DEFAULT_MODEL` for openvino on cpu (300×300, coco_91cl_bkgr.txt introduced in #23127), causing `RemoteObjectDetector` to fail with "buffer is too small for requested array" because the SHM was sized from the per-detector model but mapped using the top-level one. After the detector loop, copy the first detector's resolved model up to `self.model` so both sides agree on dimensions and labelmap

* revert to cpu detector by default

use openvino cpu for new configs only

* add defaults
2026-05-17 11:54:21 -06:00

53 lines
1.4 KiB
TypeScript

import { useTranslation } from "react-i18next";
import { Alert, AlertDescription } from "@/components/ui/alert";
import { LuInfo, LuTriangleAlert, LuCircleAlert } from "react-icons/lu";
import type {
ConditionalMessage,
MessageSeverity,
} from "./section-configs/types";
const severityVariantMap: Record<
MessageSeverity,
"info" | "warning" | "destructive"
> = {
info: "info",
warning: "warning",
error: "destructive",
};
function SeverityIcon({ severity }: { severity: MessageSeverity }) {
switch (severity) {
case "info":
return <LuInfo className="size-4" />;
case "warning":
return <LuTriangleAlert className="size-4" />;
case "error":
return <LuCircleAlert className="size-4" />;
}
}
type ConfigMessageBannerProps = {
messages: ConditionalMessage[];
};
export function ConfigMessageBanner({ messages }: ConfigMessageBannerProps) {
const { t } = useTranslation("views/settings");
if (messages.length === 0) return null;
return (
<div className="max-w-5xl space-y-2">
{messages.map((msg) => (
<Alert
key={msg.key}
variant={severityVariantMap[msg.severity]}
className="flex items-center [&>svg+div]:translate-y-0 [&>svg]:static [&>svg~*]:pl-2"
>
<SeverityIcon severity={msg.severity} />
<AlertDescription>{t(msg.messageKey, msg.values)}</AlertDescription>
</Alert>
))}
</div>
);
}