Add 'interactive' tooltip prop (#8258)

The 'interactive' prop for React Tippy will keep the tooltip open when
the user moves the mouse over the tooltip. This enables interactive
tooltips, where the user is expected to click on something in the
tooltip (e.g. a message with a link).

ui/app/components/ui/tooltip-v2.js

@@ -8,6 +8,7 @@ export default class Tooltip extends PureComponent {
     children: null,
     containerClassName: '',
     html: null,
+    interactive: undefined,
     onHidden: null,
     position: 'left',
     size: 'small',
@@ -22,6 +23,7 @@ export default class Tooltip extends PureComponent {
     containerClassName: PropTypes.string,
     disabled: PropTypes.bool,
     html: PropTypes.node,
+    interactive: PropTypes.bool,
     onHidden: PropTypes.func,
     position: PropTypes.oneOf([
       'top',
@@ -39,7 +41,21 @@ export default class Tooltip extends PureComponent {
   }
 
   render () {
-    const { arrow, children, containerClassName, disabled, position, html, size, title, trigger, onHidden, wrapperClassName, style } = this.props
+    const {
+      arrow,
+      children,
+      containerClassName,
+      disabled,
+      position,
+      html,
+      interactive,
+      size,
+      title,
+      trigger,
+      onHidden,
+      wrapperClassName,
+      style,
+    } = this.props
 
     if (!title && !html) {
       return (
@@ -52,17 +68,18 @@ export default class Tooltip extends PureComponent {
     return (
       <div className={wrapperClassName}>
         <ReactTippy
-          html={html}
+          arrow={arrow}
           className={containerClassName}
           disabled={disabled}
-          title={title}
-          position={position}
-          trigger={trigger}
           hideOnClick={false}
-          size={size}
-          arrow={arrow}
+          html={html}
+          interactive={interactive}
           onHidden={onHidden}
+          position={position}
+          size={size}
           style={style}
+          title={title}
+          trigger={trigger}
         >
           {children}
         </ReactTippy>