Merge pull request #1741 from RafaelTaranto/backport/click-away-on-tooltip

LAM-516 fix: add click away listener to tooltips

new-lamassu-admin/src/components/Tooltip.js

@@ -90,30 +90,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>
   )
 })