Handle window resizes in config editor (#19070)

This commit is contained in:
Nicolas Mowen 2025-07-10 08:28:23 -06:00 committed by GitHub
parent 79655379be
commit ee1db240d7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -16,6 +16,7 @@ import { MdOutlineRestartAlt } from "react-icons/md";
import RestartDialog from "@/components/overlay/dialog/RestartDialog"; import RestartDialog from "@/components/overlay/dialog/RestartDialog";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useRestart } from "@/api/ws"; import { useRestart } from "@/api/ws";
import { useResizeObserver } from "@/hooks/resize-observer";
type SaveOptions = "saveonly" | "restart"; type SaveOptions = "saveonly" | "restart";
@ -209,6 +210,10 @@ function ConfigEditor() {
}; };
}, [hasChanges, t]); }, [hasChanges, t]);
// layout change handler
const [{ width, height }] = useResizeObserver(configRef);
useEffect(() => { useEffect(() => {
if (editorRef.current) { if (editorRef.current) {
// Small delay to ensure DOM has updated // Small delay to ensure DOM has updated
@ -218,7 +223,7 @@ function ConfigEditor() {
return () => clearTimeout(timeoutId); return () => clearTimeout(timeoutId);
} }
}, [error]); }, [error, width, height]);
if (!config) { if (!config) {
return <ActivityIndicator />; return <ActivityIndicator />;