fix: custom anchor ref

Author: astandrik

src/components/HoverPopup/HoverPopup.tsx

@@ -9,11 +9,14 @@ import './HoverPopup.scss';
 
 const b = cn('hover-popup');
 
+const DEBOUNCE_TIMEOUT = 100;
+
 interface HoverPopupProps {
     children: React.ReactNode;
     popupContent: React.ReactNode;
     showPopup?: boolean;
     offset?: [number, number];
+    anchorRef?: React.RefObject<HTMLElement>;
     onShowPopup?: VoidFunction;
     onHidePopup?: VoidFunction;
 }
@@ -23,14 +26,13 @@ export const HoverPopup = ({
     popupContent,
     showPopup,
     offset,
+    anchorRef,
     onShowPopup,
     onHidePopup,
 }: HoverPopupProps) => {
     const [isPopupVisible, setIsPopupVisible] = React.useState(false);
     const anchor = React.useRef<HTMLDivElement>(null);
 
-    const DEBOUNCE_TIMEOUT = 100;
-
     const debouncedHandleShowPopup = React.useMemo(
         () =>
             debounce(() => {
@@ -91,7 +93,7 @@ export const HoverPopup = ({
             </div>
             <Popup
                 contentClassName={b()}
-                anchorRef={anchor}
+                anchorRef={anchorRef || anchor}
                 open={open}
                 onMouseEnter={onPopupMouseEnter}
                 onMouseLeave={onPopupMouseLeave}

src/containers/Storage/PDisk/PDisk.tsx

@@ -1,3 +1,5 @@
+import React from 'react';
+
 import {DiskStateProgressBar} from '../../../components/DiskStateProgressBar/DiskStateProgressBar';
 import {HoverPopup} from '../../../components/HoverPopup/HoverPopup';
 import {InternalLink} from '../../../components/InternalLink';
@@ -38,6 +40,8 @@ export const PDisk = ({
     const {NodeId, PDiskId} = data;
     const pDiskIdsDefined = valueIsDefined(NodeId) && valueIsDefined(PDiskId);
 
+    const anchorRef = React.useRef<HTMLDivElement>(null);
+
     const renderVDisks = () => {
         if (!vDisks?.length) {
             return null;
@@ -69,14 +73,14 @@ export const PDisk = ({
     }
 
     return (
-        <div className={b(null, className)}>
+        <div className={b(null, className)} ref={anchorRef}>
             {renderVDisks()}
             <HoverPopup
                 showPopup={showPopup}
+                anchorRef={anchorRef}
                 onShowPopup={onShowPopup}
                 onHidePopup={onHidePopup}
                 popupContent={<PDiskPopup data={data} />}
-                offset={vDisks?.length ? [0, 28] : undefined}
             >
                 <InternalLink to={pDiskPath} className={b('content')}>
                     <DiskStateProgressBar