From 89de04775e40c3c87b4af83586274ce18e847346 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Wed, 26 Jun 2024 21:25:54 +1000
Subject: [PATCH] fix(ui): do not select already-selected entity

---
 .../components/common/CanvasEntityContainer.tsx       | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/invokeai/frontend/web/src/features/controlLayers/components/common/CanvasEntityContainer.tsx b/invokeai/frontend/web/src/features/controlLayers/components/common/CanvasEntityContainer.tsx
index 700c1669bf..1cc7221831 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/common/CanvasEntityContainer.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/common/CanvasEntityContainer.tsx
@@ -1,7 +1,7 @@
 import type { ChakraProps } from '@invoke-ai/ui-library';
 import { Flex } from '@invoke-ai/ui-library';
 import type { PropsWithChildren } from 'react';
-import { memo, useMemo } from 'react';
+import { memo, useCallback, useMemo } from 'react';
 
 type Props = PropsWithChildren<{
   isSelected: boolean;
@@ -16,11 +16,18 @@ export const CanvasEntityContainer = memo(({ isSelected, onSelect, selectedBorde
     }
     return 'base.800';
   }, [isSelected, selectedBorderColor]);
+  const _onSelect = useCallback(() => {
+    if (isSelected) {
+      return;
+    }
+    onSelect();
+  }, [isSelected, onSelect]);
+
   return (
     <Flex
       position="relative"
       gap={2}
-      onClick={onSelect}
+      onClick={_onSelect}
       bg={bg}
       px={2}
       borderRadius="base"