brandxtech/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

preventing form updates when settings dialog is open

Browse source
This commit is contained in:
Carter 2026-06-25 12:33:14 -06:00
parent e8cc509915
commit ffd5e0a769
3 changed files with 13 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/component/ComponentSettings.tsx
View file

@ -213,7 +213,8 @@ export default function ComponentSettings(props: Props) {
}, [props.component, componentTypeOptions]); }, [props.component, componentTypeOptions]);
useEffect(() => { useEffect(() => {
if (props.component !== prevComponent || (!isDialogOpen && prevIsDialogOpen)) { if (isDialogOpen && prevIsDialogOpen) return;
if (props.component !== prevComponent || isDialogOpen !== prevIsDialogOpen) {
init(); init();
} }
}, [props.component, prevComponent, init, isDialogOpen, prevIsDialogOpen]); }, [props.component, prevComponent, init, isDialogOpen, prevIsDialogOpen]);

6
src/device/DeviceSettings.tsx
View file

@ -95,6 +95,7 @@ export default function DeviceSettings(props: Props) {
const deviceAPI = useDeviceAPI(); const deviceAPI = useDeviceAPI();
const { device, isDialogOpen, closeDialogCallback, canEdit, refreshCallback, components } = props; const { device, isDialogOpen, closeDialogCallback, canEdit, refreshCallback, components } = props;
const prevDevice = usePrevious(device); const prevDevice = usePrevious(device);
const prevIsDialogOpen = usePrevious(isDialogOpen);
const [deviceForm, setDeviceForm] = useState<Device>(deviceFromForm(Device.clone(device))); const [deviceForm, setDeviceForm] = useState<Device>(deviceFromForm(Device.clone(device)));
const [isRemoveDeviceDialogOpen, setIsRemoveDeviceDialogOpen] = useState<boolean>(false); const [isRemoveDeviceDialogOpen, setIsRemoveDeviceDialogOpen] = useState<boolean>(false);
const [sleeps, setSleeps] = useState<boolean>(device.settings.sleepDurationS > 0); const [sleeps, setSleeps] = useState<boolean>(device.settings.sleepDurationS > 0);
@ -110,7 +111,8 @@ export default function DeviceSettings(props: Props) {
const [existingMutation, setExistingMutation] = useState<pond.LinearMutation>(); const [existingMutation, setExistingMutation] = useState<pond.LinearMutation>();
useEffect(() => { useEffect(() => {
if (prevDevice !== device) { if (isDialogOpen && prevIsDialogOpen) return;
if (prevDevice !== device || isDialogOpen !== prevIsDialogOpen) {
setDeviceForm(deviceFromForm(Device.clone(props.device))); setDeviceForm(deviceFromForm(Device.clone(props.device)));
if (device.settings.extensionComponents[0]) { if (device.settings.extensionComponents[0]) {
setCompExtOne(device.settings.extensionComponents[0]); setCompExtOne(device.settings.extensionComponents[0]);
@ -130,7 +132,7 @@ export default function DeviceSettings(props: Props) {
setComponentsByDevice(cbd); setComponentsByDevice(cbd);
} }
} }
}, [device, prevDevice, props.device, components]); }, [device, prevDevice, props.device, components, isDialogOpen, prevIsDialogOpen]);
const close = () => { const close = () => {
closeDialogCallback(); closeDialogCallback();

9
src/interactions/InteractionSettings.tsx
View file

@ -133,6 +133,7 @@ export default function InteractionSettings(props: Props) {
const prevInitialInteraction = usePrevious(initialInteraction); const prevInitialInteraction = usePrevious(initialInteraction);
const prevComponents = usePrevious(components); const prevComponents = usePrevious(components);
const prevInitialComponent = usePrevious(initialComponent); const prevInitialComponent = usePrevious(initialComponent);
const prevIsDialogOpen = usePrevious(isDialogOpen);
const classes = useStyles(); const classes = useStyles();
const [{ user, as }] = useGlobalState(); const [{ user, as }] = useGlobalState();
const interactionsAPI = useInteractionsAPI(); const interactionsAPI = useInteractionsAPI();
@ -232,10 +233,12 @@ export default function InteractionSettings(props: Props) {
if (user && user.settings.timezone) { if (user && user.settings.timezone) {
setTimezone(user.settings.timezone); setTimezone(user.settings.timezone);
} }
if (isDialogOpen && prevIsDialogOpen) return;
if ( if (
prevInitialInteraction !== initialInteraction || prevInitialInteraction !== initialInteraction ||
(prevComponents && prevComponents.length !== components.length) || (prevComponents && prevComponents.length !== components.length) ||
getComponentIDString(prevInitialComponent) !== getComponentIDString(initialComponent) getComponentIDString(prevInitialComponent) !== getComponentIDString(initialComponent) ||
isDialogOpen !== prevIsDialogOpen
) { ) {
setDefaultState(); setDefaultState();
} }
@ -247,7 +250,9 @@ export default function InteractionSettings(props: Props) {
prevInitialComponent, prevInitialComponent,
prevInitialInteraction, prevInitialInteraction,
setDefaultState, setDefaultState,
user user,
isDialogOpen,
prevIsDialogOpen
]); ]);
const getAvailableSinks = () => { const getAvailableSinks = () => {