From 64723f06282e54750f3ee6fd0878c571e0a93e94 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Wed, 30 Aug 2023 14:07:24 +1200
Subject: [PATCH] fix: ControlNet DnD icons repeated twice

---
 .../components/ControlNetImagePreview.tsx     | 65 +++++++------------
 1 file changed, 23 insertions(+), 42 deletions(-)

diff --git a/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx b/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx
index 6290d66052..aa097b5969 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx
@@ -166,27 +166,7 @@ const ControlNetImagePreview = ({ isSmall, controlNet }: Props) => {
         imageDTO={controlImage}
         isDropDisabled={shouldShowProcessedImage || !isEnabled}
         postUploadAction={postUploadAction}
-      >
-        <>
-          <IAIDndImageIcon
-            onClick={handleResetControlImage}
-            icon={controlImage ? <FaUndo /> : undefined}
-            tooltip="Reset Control Image"
-          />
-          <IAIDndImageIcon
-            onClick={handleSaveControlImage}
-            icon={controlImage ? <FaSave size={16} /> : undefined}
-            tooltip="Save Control Image"
-            styleOverrides={{ marginTop: 6 }}
-          />
-          <IAIDndImageIcon
-            onClick={handleSetControlImageToDimensions}
-            icon={controlImage ? <FaRulerVertical size={16} /> : undefined}
-            tooltip="Set Control Image Dimensions To W/H"
-            styleOverrides={{ marginTop: 12 }}
-          />
-        </>
-      </IAIDndImage>
+      />
 
       <Box
         sx={{
@@ -207,28 +187,29 @@ const ControlNetImagePreview = ({ isSmall, controlNet }: Props) => {
           imageDTO={processedControlImage}
           isUploadDisabled={true}
           isDropDisabled={!isEnabled}
-        >
-          <>
-            <IAIDndImageIcon
-              onClick={handleResetControlImage}
-              icon={controlImage ? <FaUndo /> : undefined}
-              tooltip="Reset Control Image"
-            />
-            <IAIDndImageIcon
-              onClick={handleSaveControlImage}
-              icon={controlImage ? <FaSave size={16} /> : undefined}
-              tooltip="Save Control Image"
-              styleOverrides={{ marginTop: 6 }}
-            />
-            <IAIDndImageIcon
-              onClick={handleSetControlImageToDimensions}
-              icon={controlImage ? <FaRulerVertical size={16} /> : undefined}
-              tooltip="Set Control Image Dimensions To W/H"
-              styleOverrides={{ marginTop: 12 }}
-            />
-          </>
-        </IAIDndImage>
+        />
       </Box>
+
+      <>
+        <IAIDndImageIcon
+          onClick={handleResetControlImage}
+          icon={controlImage ? <FaUndo /> : undefined}
+          tooltip="Reset Control Image"
+        />
+        <IAIDndImageIcon
+          onClick={handleSaveControlImage}
+          icon={controlImage ? <FaSave size={16} /> : undefined}
+          tooltip="Save Control Image"
+          styleOverrides={{ marginTop: 6 }}
+        />
+        <IAIDndImageIcon
+          onClick={handleSetControlImageToDimensions}
+          icon={controlImage ? <FaRulerVertical size={16} /> : undefined}
+          tooltip="Set Control Image Dimensions To W/H"
+          styleOverrides={{ marginTop: 12 }}
+        />
+      </>
+
       {pendingControlImages.includes(controlNetId) && (
         <Flex
           sx={{