add delay prop to table/dimension info popovers (#19560)

* add delay prop to table/dimension info popovers

* move isCypressActive delay check to TippyPopover

frontend/src/metabase/components/MetadataInfo/DimensionInfoPopover/DimensionInfoPopover.tsx

@@ -6,7 +6,6 @@ import Dimension from "metabase-lib/lib/Dimension";
 import TippyPopover, {
   ITippyPopoverProps,
 } from "metabase/components/Popover/TippyPopover";
-import { isCypressActive } from "metabase/env";
 
 import { WidthBoundDimensionInfo } from "./DimensionInfoPopover.styled";
 
@@ -21,7 +20,7 @@ const propTypes = {
 
 type Props = { dimension: Dimension } & Pick<
   ITippyPopoverProps,
-  "children" | "placement" | "disabled"
+  "children" | "placement" | "disabled" | "delay"
 >;
 
 const className = "dimension-info-popover";
@@ -31,6 +30,7 @@ function DimensionInfoPopover({
   children,
   placement,
   disabled,
+  delay = POPOVER_DELAY,
 }: Props) {
   // avoid a scenario where we may have a Dimension instance but not enough metadata
   // to even show a display name (probably indicative of a bug)
@@ -39,7 +39,7 @@ function DimensionInfoPopover({
   return hasMetadata ? (
     <TippyPopover
       className={className}
-      delay={isCypressActive ? 0 : POPOVER_DELAY}
+      delay={delay}
       interactive
       placement={placement || "left-start"}
       disabled={disabled}

frontend/src/metabase/components/MetadataInfo/TableInfoPopover/TableInfoPopover.tsx

@@ -19,19 +19,25 @@ const propTypes = {
 
 type Props = { tableId: number } & Pick<
   ITippyPopoverProps,
-  "children" | "placement" | "offset"
+  "children" | "placement" | "offset" | "delay"
 >;
 
 const className = "table-info-popover";
 
-function TableInfoPopover({ tableId, children, placement, offset }: Props) {
+function TableInfoPopover({
+  tableId,
+  children,
+  placement,
+  offset,
+  delay = POPOVER_DELAY,
+}: Props) {
   placement = placement || "left-start";
 
   return tableId != null ? (
     <TippyPopover
       className={className}
       interactive
-      delay={POPOVER_DELAY}
+      delay={delay}
       placement={placement}
       offset={offset}
       content={<WidthBoundTableInfo tableId={tableId} />}

frontend/src/metabase/components/Popover/TippyPopover.tsx

@@ -5,6 +5,7 @@ import cx from "classnames";
 
 import { isReducedMotionPreferred } from "metabase/lib/dom";
 import EventSandbox from "metabase/components/EventSandbox";
+import { isCypressActive } from "metabase/env";
 
 const TippyComponent = Tippy.default;
 type TippyProps = Tippy.TippyProps;
@@ -27,8 +28,10 @@ function TippyPopover({
   disableContentSandbox,
   lazy = true,
   content,
+  delay,
   ...props
 }: ITippyPopoverProps) {
+  delay = isCypressActive ? 0 : delay;
   const animationDuration = isReducedMotionPreferred() ? 0 : undefined;
   const [mounted, setMounted] = useState(!lazy);
   const plugins = useMemo(
@@ -65,6 +68,7 @@ function TippyPopover({
       plugins={plugins}
       {...props}
       duration={animationDuration}
+      delay={delay}
       content={computedContent}
     />
   );