Merge pull request #12594 from ethereum/fix-tooltip-overwritten-prop

Fix Tooltip overwritten prop

Author: wackerow

src/components/Glossary/GlossaryTooltip/index.tsx

@@ -26,7 +26,7 @@ const GlossaryTooltip = ({ children, termKey }: GlossaryTooltipProps) => {
             options={{ ns: "glossary-tooltip" }}
           />
         }
-        onOpen={() => {
+        onBeforeOpen={() => {
           trackCustomEvent({
             eventCategory: "Glossary Tooltip",
             eventAction: cleanPath(asPath),

src/components/Tooltip/index.tsx

@@ -14,9 +14,15 @@ import { isMobile } from "@/lib/utils/isMobile"
 export interface IProps extends PopoverProps {
   content: ReactNode
   children?: ReactNode
+  onBeforeOpen?: () => void
 }
 
-const Tooltip: React.FC<IProps> = ({ content, children, ...rest }) => {
+const Tooltip: React.FC<IProps> = ({
+  content,
+  children,
+  onBeforeOpen,
+  ...rest
+}) => {
   const { isOpen, onOpen, onClose } = useDisclosure()
 
   // Close the popover when the user scrolls.
@@ -45,10 +51,15 @@ const Tooltip: React.FC<IProps> = ({ content, children, ...rest }) => {
     }
   }, [isOpen, onClose])
 
+  const handleOpen = () => {
+    onBeforeOpen?.()
+    onOpen()
+  }
+
   return (
     <Popover
       isOpen={isOpen}
-      onOpen={onOpen}
+      onOpen={handleOpen}
       onClose={onClose}
       placement="top"
       trigger={isMobile() ? "click" : "hover"}