[DDW-787] Fix closing discreet mode popover on staking page

source/renderer/app/components/staking/stake-pools/StakePoolsList.js

@@ -4,23 +4,32 @@ import { observer } from 'mobx-react';
 import React, { useEffect, useState } from 'react';
 import type { ElementRef } from 'react';
 import { AutoSizer, List, WindowScroller } from 'react-virtualized';
-import { hideAll } from 'tippy.js';
+import { Instance } from 'tippy.js';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
 import styles from './StakePoolsList.scss';
 import StakePool from '../../../domains/StakePool';
 import { ThumbPool } from '../widgets/ThumbPool';
 
+type TippyElement = Element & {
+  _tippy: Instance,
+};
+
 // Maximum number of stake pools for which we do not need to use the preloading
 const PRELOADER_THRESHOLD = 100;
 const POOL_THUMB_SIZE = 80;
 const POOL_THUMB_GRID_GAP = 10;
 
 /**
- * Utility function to programmatically hide all pop overs
+ * Utility function to programmatically hide the active pop over
  * This is used to hide the pool tooltips on scrolling the list
  */
-function hideAllPopOvers() {
-  hideAll();
+function hidePoolPopOver() {
+  const popOver: TippyElement | null = (document.querySelector('.PoolPopOver')
+    ?.parentElement: any);
+
+  if (popOver) {
+    popOver?._tippy.hide();
+  }
 }
 
 /**
@@ -57,12 +66,12 @@ export const StakePoolsList = observer((props: StakePoolsListProps) => {
       ? props.scrollElementRef.current
       : null;
     if (scrollContainer !== null) {
-      scrollContainer.addEventListener('scroll', hideAllPopOvers, true);
+      scrollContainer.addEventListener('scroll', hidePoolPopOver, true);
     }
     setTimeout(() => setIsLoading(false));
     return () => {
       if (scrollContainer !== null) {
-        scrollContainer.removeEventListener('scroll', hideAllPopOvers);
+        scrollContainer.removeEventListener('scroll', hidePoolPopOver);
       }
     };
   });

source/renderer/app/components/staking/widgets/PoolPopOver.js

@@ -55,6 +55,7 @@ export function PoolPopOver(props: {
       {isHovered ? ( // Init the pop over only when the target is hovered
         <PopOver
           interactive
+          className="PoolPopOver"
           delay={props.openWithDelay ? STAKE_POOL_TOOLTIP_HOVER_WAIT : 0}
           duration={0}
           appendTo={document.body}