From 1b617768cf06545417e2d701ed766938a1714de2 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Thu, 2 May 2024 09:12:14 +1000
Subject: [PATCH] fix(ui): canvas infinite loop when setting bbox dims

When typing in a number into the w/h number inputs, if the number is less than the step, it appears the value of 0 is used. This is unexpected; it means Chakra isn't clamping the value correctly (or maybe our wrapper isn't clamping it).

Add checks to never bail if the width or height value from the number input component is 0.
---
 .../components/ImageSettingsAccordion/ImageSizeCanvas.tsx   | 6 ++++++
 .../components/ImageSettingsAccordion/ImageSizeLinear.tsx   | 6 ++++++
 2 files changed, 12 insertions(+)

diff --git a/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeCanvas.tsx b/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeCanvas.tsx
index 878174fe75..1dc8f49b78 100644
--- a/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeCanvas.tsx
+++ b/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeCanvas.tsx
@@ -16,6 +16,9 @@ export const ImageSizeCanvas = memo(() => {
 
   const onChangeWidth = useCallback(
     (width: number) => {
+      if (width === 0) {
+        return;
+      }
       dispatch(setBoundingBoxDimensions({ width }, optimalDimension));
     },
     [dispatch, optimalDimension]
@@ -23,6 +26,9 @@ export const ImageSizeCanvas = memo(() => {
 
   const onChangeHeight = useCallback(
     (height: number) => {
+      if (height === 0) {
+        return;
+      }
       dispatch(setBoundingBoxDimensions({ height }, optimalDimension));
     },
     [dispatch, optimalDimension]
diff --git a/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeLinear.tsx b/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeLinear.tsx
index 7e436556da..0b28200ca2 100644
--- a/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeLinear.tsx
+++ b/invokeai/frontend/web/src/features/settingsAccordions/components/ImageSettingsAccordion/ImageSizeLinear.tsx
@@ -18,6 +18,9 @@ export const ImageSizeLinear = memo(() => {
 
   const onChangeWidth = useCallback(
     (width: number) => {
+      if (width === 0) {
+        return;
+      }
       dispatch(widthChanged({ width }));
     },
     [dispatch]
@@ -25,6 +28,9 @@ export const ImageSizeLinear = memo(() => {
 
   const onChangeHeight = useCallback(
     (height: number) => {
+      if (height === 0) {
+        return;
+      }
       dispatch(heightChanged({ height }));
     },
     [dispatch]