From 0fc82cf73be5249e829959d87e3ac43afdd66460 Mon Sep 17 00:00:00 2001
From: Baptiste Arnaud <contact@baptiste-arnaud.fr>
Date: Thu, 26 Jan 2023 10:08:33 +0100
Subject: [PATCH] :bug: (editor) Fix outside click not working in some cases

---
 apps/builder/src/components/VariableSearchInput.tsx           | 3 ++-
 .../components/TextBubbleEditor/TextBubbleEditor.tsx          | 3 +++
 apps/builder/src/hooks/useOutsideClick.ts                     | 4 +---
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/apps/builder/src/components/VariableSearchInput.tsx b/apps/builder/src/components/VariableSearchInput.tsx
index e2934014b..39e71489b 100644
--- a/apps/builder/src/components/VariableSearchInput.tsx
+++ b/apps/builder/src/components/VariableSearchInput.tsx
@@ -58,7 +58,7 @@ export const VariableSearchInput = ({
 
   useOutsideClick({
     ref: dropdownRef,
-    handler: () => onClose,
+    handler: onClose,
   })
 
   useEffect(() => {
@@ -189,6 +189,7 @@ export const VariableSearchInput = ({
             w="inherit"
             shadow="lg"
             onMouseDown={(e) => e.stopPropagation()}
+            onPointerDown={(e) => e.stopPropagation()}
           >
             {isCreateVariableButtonDisplayed && (
               <Button
diff --git a/apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleEditor/TextBubbleEditor.tsx b/apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleEditor/TextBubbleEditor.tsx
index 256839a35..e8d4b242d 100644
--- a/apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleEditor/TextBubbleEditor.tsx
+++ b/apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleEditor/TextBubbleEditor.tsx
@@ -148,6 +148,9 @@ const TextBubbleEditorContent = ({
             rememberedSelection.current = editor.selection
           },
           onKeyDown: handleKeyDown,
+          onClick: () => {
+            setIsVariableDropdownOpen(false)
+          },
         }}
       />
       {isVariableDropdownOpen && (
diff --git a/apps/builder/src/hooks/useOutsideClick.ts b/apps/builder/src/hooks/useOutsideClick.ts
index a4eb9dd84..c3db8f782 100644
--- a/apps/builder/src/hooks/useOutsideClick.ts
+++ b/apps/builder/src/hooks/useOutsideClick.ts
@@ -6,13 +6,11 @@ type Handler = (event: MouseEvent) => void
 type Props<T> = {
   ref: RefObject<T>
   handler: Handler
-  mouseEvent?: 'mousedown' | 'mouseup'
 }
 
 export const useOutsideClick = <T extends HTMLElement = HTMLElement>({
   ref,
   handler,
-  mouseEvent = 'mousedown',
 }: Props<T>): void => {
   const triggerHandlerIfOutside = (event: MouseEvent) => {
     const el = ref?.current
@@ -22,5 +20,5 @@ export const useOutsideClick = <T extends HTMLElement = HTMLElement>({
     handler(event)
   }
 
-  useEventListener(mouseEvent, triggerHandlerIfOutside)
+  useEventListener('pointerdown', triggerHandlerIfOutside)
 }