From 59f3245bf3a2cb5e98c80175f9c1b0bb8d701a2d Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Tue, 15 Nov 2022 16:38:46 +0100
Subject: [PATCH] fix(ui) - funnel isseues dropdown

---
 .../FunnelIssuesDropdown.tsx                  | 35 ++++++++++---------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/frontend/app/components/Dashboard/components/Funnels/FunnelIssuesDropdown/FunnelIssuesDropdown.tsx b/frontend/app/components/Dashboard/components/Funnels/FunnelIssuesDropdown/FunnelIssuesDropdown.tsx
index 361337443..2dade061d 100644
--- a/frontend/app/components/Dashboard/components/Funnels/FunnelIssuesDropdown/FunnelIssuesDropdown.tsx
+++ b/frontend/app/components/Dashboard/components/Funnels/FunnelIssuesDropdown/FunnelIssuesDropdown.tsx
@@ -49,7 +49,8 @@ function FunnelIssuesDropdown() {
         }
     }
 
-    const onClickOutside = () => {
+    const onClickOutside = (e: any) => {
+        if (e.target.id === 'dd-button') return;
         if (isOpen) {
             setTimeout(() => {
                 setIsOpen(false);
@@ -85,21 +86,23 @@ function FunnelIssuesDropdown() {
                     IndicatorSeparator: (): any => null,
                     IndicatorsContainer: (): any => null,
                     Control: ({ children, ...props }: any) => (
-                        <components.Control {...props}>
-                            <OutsideClickDetectingDiv
-                                // className={ cn("relative flex items-center", { "flex-1" : fullWidth }) }
-                                onClickOutside={onClickOutside}
-                            >
-                            { children }
-                            <button
-                                className="px-2 py-1 bg-white rounded-2xl border border-teal border-dashed color-teal flex items-center hover:bg-active-blue"
-                                onClick={() => setIsOpen(!isOpen)}
-                            >
-                                <Icon name="funnel" size={16} color="teal" />
-                                <span className="ml-2">Issues</span>
-                            </button>
-                            </OutsideClickDetectingDiv>
-                        </components.Control>
+                        <OutsideClickDetectingDiv
+                            className="relative items-center block"
+                            onClickOutside={onClickOutside}
+                        >
+                            <components.Control {...props}>
+                                { children }
+                                <button
+                                    id="dd-button"
+                                    className="px-2 py-1 bg-white rounded-2xl border border-teal border-dashed color-teal flex items-center hover:bg-active-blue select-none"
+                                    onClick={() => setIsOpen(!isOpen)}
+                                >
+                                    <Icon name="funnel" size={16} color="teal" className="pointer-events-none" />
+                                    <span className="ml-2 pointer-events-none">Issues</span>
+                                </button>
+                                
+                            </components.Control>
+                        </OutsideClickDetectingDiv>
                     ),
                     Placeholder: (): any => null,
                     SingleValue: (): any => null,