work around radix pointer events issue when dialog is opened from drawer

fixes https://github.com/blakeblackshear/frigate/discussions/21940
This commit is contained in:
Josh Hawkins 2026-02-09 09:42:11 -06:00
parent e21565a209
commit 1d506c1684

View File

@ -4,6 +4,7 @@ import {
AlertDialogAction, AlertDialogAction,
AlertDialogCancel, AlertDialogCancel,
AlertDialogContent, AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter, AlertDialogFooter,
AlertDialogHeader, AlertDialogHeader,
AlertDialogTitle, AlertDialogTitle,
@ -37,6 +38,12 @@ export default function RestartDialog({
const [restartingSheetOpen, setRestartingSheetOpen] = useState(false); const [restartingSheetOpen, setRestartingSheetOpen] = useState(false);
const [countdown, setCountdown] = useState(60); const [countdown, setCountdown] = useState(60);
const clearBodyPointerEvents = () => {
if (typeof document !== "undefined") {
document.body.style.pointerEvents = "";
}
};
useEffect(() => { useEffect(() => {
setRestartDialogOpen(isOpen); setRestartDialogOpen(isOpen);
}, [isOpen]); }, [isOpen]);
@ -74,14 +81,25 @@ export default function RestartDialog({
<> <>
<AlertDialog <AlertDialog
open={restartDialogOpen} open={restartDialogOpen}
onOpenChange={() => { onOpenChange={(open) => {
setRestartDialogOpen(false); if (!open) {
onClose(); setRestartDialogOpen(false);
onClose();
clearBodyPointerEvents();
}
}} }}
> >
<AlertDialogContent> <AlertDialogContent
onCloseAutoFocus={(event) => {
event.preventDefault();
clearBodyPointerEvents();
}}
>
<AlertDialogHeader> <AlertDialogHeader>
<AlertDialogTitle>{t("restart.title")}</AlertDialogTitle> <AlertDialogTitle>{t("restart.title")}</AlertDialogTitle>
<AlertDialogDescription className="sr-only">
{t("restart.description")}
</AlertDialogDescription>
</AlertDialogHeader> </AlertDialogHeader>
<AlertDialogFooter> <AlertDialogFooter>
<AlertDialogCancel> <AlertDialogCancel>