From a8a30065a436867ef8e578541ab495a29f5b4f07 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Fri, 28 Oct 2022 14:14:28 +1100
Subject: [PATCH] Fixes more bounding box bugs

---
 .../tabs/Inpainting/InpaintingCanvas.tsx      | 42 +++++++++----------
 .../components/KeyboardEventManager.tsx       |  9 +---
 .../tabs/Inpainting/inpaintingSlice.ts        | 11 ++---
 3 files changed, 27 insertions(+), 35 deletions(-)

diff --git a/frontend/src/features/tabs/Inpainting/InpaintingCanvas.tsx b/frontend/src/features/tabs/Inpainting/InpaintingCanvas.tsx
index 5d55fb341b..ad34bbaf2b 100644
--- a/frontend/src/features/tabs/Inpainting/InpaintingCanvas.tsx
+++ b/frontend/src/features/tabs/Inpainting/InpaintingCanvas.tsx
@@ -118,32 +118,29 @@ const InpaintingCanvas = () => {
    * Canvas onMouseMove
    *
    */
-  const handleMouseMove = useCallback(
-    () => {
-      if (!stageRef.current) return;
+  const handleMouseMove = useCallback(() => {
+    if (!stageRef.current) return;
 
-      const scaledCursorPosition = getScaledCursorPosition(stageRef.current);
+    const scaledCursorPosition = getScaledCursorPosition(stageRef.current);
 
-      if (!scaledCursorPosition) return;
+    if (!scaledCursorPosition) return;
 
-      dispatch(setCursorPosition(scaledCursorPosition));
+    dispatch(setCursorPosition(scaledCursorPosition));
 
-      if (!maskLayerRef.current || !shouldLockBoundingBox) {
-        return;
-      }
+    if (!maskLayerRef.current || !shouldLockBoundingBox) {
+      return;
+    }
 
-      lastCursorPosition.current = scaledCursorPosition;
+    lastCursorPosition.current = scaledCursorPosition;
 
-      if (!isDrawing) return;
+    if (!isDrawing) return;
 
-      didMouseMoveRef.current = true;
-      // Extend the current line
-      dispatch(
-        addPointToCurrentLine([scaledCursorPosition.x, scaledCursorPosition.y])
-      );
-    },
-    [dispatch, isDrawing, shouldLockBoundingBox]
-  );
+    didMouseMoveRef.current = true;
+    // Extend the current line
+    dispatch(
+      addPointToCurrentLine([scaledCursorPosition.x, scaledCursorPosition.y])
+    );
+  }, [dispatch, isDrawing, shouldLockBoundingBox]);
 
   /**
    *
@@ -260,7 +257,8 @@ const InpaintingCanvas = () => {
                 ref={maskLayerRef}
               >
                 <InpaintingCanvasLines />
-                <InpaintingCanvasBrushPreview />
+
+                {shouldLockBoundingBox && <InpaintingCanvasBrushPreview />}
 
                 {shouldInvertMask && (
                   <KonvaImage
@@ -282,7 +280,9 @@ const InpaintingCanvas = () => {
                   <InpaintingBoundingBoxPreviewOverlay />
                 )}
                 {shouldShowBoundingBox && <InpaintingBoundingBoxPreview />}
-                <InpaintingCanvasBrushPreviewOutline />
+                {shouldLockBoundingBox && (
+                  <InpaintingCanvasBrushPreviewOutline />
+                )}
               </Layer>
             </>
           )}
diff --git a/frontend/src/features/tabs/Inpainting/components/KeyboardEventManager.tsx b/frontend/src/features/tabs/Inpainting/components/KeyboardEventManager.tsx
index 8f1d84631b..3c5b421c6a 100644
--- a/frontend/src/features/tabs/Inpainting/components/KeyboardEventManager.tsx
+++ b/frontend/src/features/tabs/Inpainting/components/KeyboardEventManager.tsx
@@ -19,11 +19,8 @@ import {
 const keyboardEventManagerSelector = createSelector(
   [(state: RootState) => state.options, (state: RootState) => state.inpainting],
   (options: OptionsState, inpainting: InpaintingState) => {
-    const {
-      shouldShowMask,
-      cursorPosition,
-      shouldLockBoundingBox,
-    } = inpainting;
+    const { shouldShowMask, cursorPosition, shouldLockBoundingBox } =
+      inpainting;
     return {
       activeTabName: tabMap[options.activeTab],
       shouldShowMask,
@@ -95,10 +92,8 @@ const KeyboardEventManager = () => {
           if (e.type === 'keydown') {
             dispatch(setIsDrawing(false));
             dispatch(setShouldLockBoundingBox(false));
-            dispatch(setShouldShowBrush(false));
           } else {
             dispatch(setShouldLockBoundingBox(true));
-            dispatch(setShouldShowBrush(true));
           }
           break;
         }
diff --git a/frontend/src/features/tabs/Inpainting/inpaintingSlice.ts b/frontend/src/features/tabs/Inpainting/inpaintingSlice.ts
index 8a24e068f4..dd8cfe1b15 100644
--- a/frontend/src/features/tabs/Inpainting/inpaintingSlice.ts
+++ b/frontend/src/features/tabs/Inpainting/inpaintingSlice.ts
@@ -237,6 +237,7 @@ export const inpaintingSlice = createSlice({
 
       const roundedCanvasWidth = roundDownToMultiple(canvasWidth, 64);
       const roundedCanvasHeight = roundDownToMultiple(canvasHeight, 64);
+
       const roundedBoundingBoxWidth = roundDownToMultiple(boundingBoxWidth, 64);
       const roundedBoundingBoxHeight = roundDownToMultiple(
         boundingBoxHeight,
@@ -276,22 +277,18 @@ export const inpaintingSlice = createSlice({
         roundedCanvasHeight - newBoundingBoxHeight
       );
 
-      const newBoundingBoxX = roundDownToMultiple(clampedX, 64);
-
-      const newBoundingBoxY = roundDownToMultiple(clampedY, 64);
-
       state.boundingBoxDimensions = {
         width: newBoundingBoxWidth,
         height: newBoundingBoxHeight,
       };
 
       state.boundingBoxCoordinate = {
-        x: newBoundingBoxX,
-        y: newBoundingBoxY,
+        x: clampedX,
+        y: clampedY,
       };
     },
     setBoundingBoxCoordinate: (state, action: PayloadAction<Vector2d>) => {
-      state.boundingBoxCoordinate = action.payload
+      state.boundingBoxCoordinate = action.payload;
       // const { x, y } = action.payload;
 
       // const maxX =