fix

Author: lucasgoral

src/components/Helper/AnimatedHoverTextButton.tsx

@@ -3,22 +3,19 @@ import '@ui5/webcomponents-icons/dist/copy';
 import { JSX, RefObject, useState } from 'react';
 import ButtonDesign from '@ui5/webcomponents/dist/types/ButtonDesign.js';
 
-export function AnimatedHoverTextButton({
-  text,
-  icon,
-
-  ref,
-}: {
+type HoverTextButtonProps = {
   text: string;
   icon: JSX.Element;
-
   ref?: RefObject<ButtonDomRef | null>;
-}) {
+  onClick: () => void;
+};
+export const AnimatedHoverTextButton = ({ text, icon, onClick, ref }: HoverTextButtonProps) => {
   const [hover, setHover] = useState(false);
   return (
     <Button
       ref={ref}
       design={ButtonDesign.Transparent}
+      onClick={onClick}
       onMouseOver={() => setHover(true)}
       onMouseLeave={() => setHover(false)}
     >
@@ -28,4 +25,4 @@ export function AnimatedHoverTextButton({
       </FlexBox>
     </Button>
   );
-}
+};

src/components/Shared/ResourceStatusCell.tsx

@@ -1,6 +1,6 @@
 import { ButtonDomRef, FlexBox, Icon, ResponsivePopover, Text } from '@ui5/webcomponents-react';
 import { timeAgo } from '../../utils/i18n/timeAgo';
-import { RefObject, useRef, useState } from 'react';
+import { useRef, useState } from 'react';
 import { AnimatedHoverTextButton } from '../Helper/AnimatedHoverTextButton.tsx';
 import PopoverPlacement from '@ui5/webcomponents/dist/types/PopoverPlacement.js';
 import styles from './ResourceStatusCell.module.css';
@@ -24,7 +24,9 @@ export const ResourceStatusCell = ({
   const handleClose = () => {
     setPopoverIsOpen(false);
   };
-
+  const handleOpen = () => {
+    setPopoverIsOpen(true);
+  };
   return (
     <span>
       <AnimatedHoverTextButton
@@ -38,9 +40,10 @@ export const ResourceStatusCell = ({
           />
         }
         text={isOk ? positiveText : negativeText}
+        onClick={handleOpen}
       />
       <ResponsivePopover
-        opener={btnRef.current}
+        opener={btnRef.current ?? undefined}
         open={popoverIsOpen}
         placement={PopoverPlacement.Bottom}
         onClose={handleClose}