From 61130157563e3d57f03f5a820e850aaae3bf956a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jos=C3=A9=20Oliveira?= <josepfo.w@gmail.com>
Date: Tue, 12 Jul 2022 18:09:56 +0100
Subject: [PATCH] fix: add click away listener to tooltips

---
 new-lamassu-admin/src/components/Tooltip.js | 47 ++++++++++-----------
 1 file changed, 23 insertions(+), 24 deletions(-)

diff --git a/new-lamassu-admin/src/components/Tooltip.js b/new-lamassu-admin/src/components/Tooltip.js
index 2fa5b7f9..3808c286 100644
--- a/new-lamassu-admin/src/components/Tooltip.js
+++ b/new-lamassu-admin/src/components/Tooltip.js
@@ -69,30 +69,29 @@ const HoverableTooltip = memo(({ parentElements, children, width }) => {
   const handler = usePopperHandler(width)
 
   return (
-    <div>
-      {!R.isNil(parentElements) && (
-        <div
-          onMouseEnter={handler.handleOpenHelpPopper}
-          onMouseLeave={handler.handleCloseHelpPopper}>
-          {parentElements}
-        </div>
-      )}
-      {R.isNil(parentElements) && (
-        <button
-          type="button"
-          onMouseEnter={handler.handleOpenHelpPopper}
-          onMouseLeave={handler.handleCloseHelpPopper}
-          className={handler.classes.transparentButton}>
-          <HelpIcon />
-        </button>
-      )}
-      <Popper
-        open={handler.helpPopperOpen}
-        anchorEl={handler.helpPopperAnchorEl}
-        placement="bottom">
-        <div className={handler.classes.popoverContent}>{children}</div>
-      </Popper>
-    </div>
+    <ClickAwayListener onClickAway={handler.handleCloseHelpPopper}>
+      <div>
+        {!R.isNil(parentElements) && (
+          <div onMouseEnter={handler.handleOpenHelpPopper}>
+            {parentElements}
+          </div>
+        )}
+        {R.isNil(parentElements) && (
+          <button
+            type="button"
+            onMouseEnter={handler.handleOpenHelpPopper}
+            className={handler.classes.transparentButton}>
+            <HelpIcon />
+          </button>
+        )}
+        <Popper
+          open={handler.helpPopperOpen}
+          anchorEl={handler.helpPopperAnchorEl}
+          placement="bottom">
+          <div className={handler.classes.popoverContent}>{children}</div>
+        </Popper>
+      </div>
+    </ClickAwayListener>
   )
 })