Merge pull request #7905 from metabase/fix-collections-scroll-issues

Fix virtualized list and drag and drop scroll issues

frontend/src/metabase/components/Popover.jsx

@@ -108,9 +108,10 @@ export default class Popover extends Component {
         if (this._popoverElement.parentNode) {
           this._popoverElement.parentNode.removeChild(this._popoverElement);
         }
-        clearInterval(this._timer);
-        delete this._popoverElement, this._timer;
+        delete this._popoverElement;
       }, POPOVER_TRANSITION_LEAVE);
+      clearInterval(this._timer);
+      delete this._timer;
     }
   }
 

frontend/src/metabase/components/VirtualizedList.jsx

@@ -6,9 +6,8 @@ const VirtualizedList = ({ items, rowHeight, renderItem }) => (
   <AutoSizer>
     {({ width }) => (
       <WindowScroller>
-        {({ height, isScrolling, registerChild, scrollTop }) => (
+        {({ height, isScrolling, scrollTop }) => (
           <List
-            ref={registerChild}
             autoHeight
             width={width}
             height={Math.min(height, rowHeight * items.length)}

frontend/src/metabase/containers/dnd/ItemsDragLayer.jsx

@@ -22,13 +22,15 @@ export default class ItemsDragLayer extends React.Component {
       return null;
     }
     const items = selected.length > 0 ? selected : [item.item];
+    const x = currentOffset.x + window.scrollX;
+    const y = currentOffset.y + window.scrollY;
     return (
       <div
         style={{
           position: "absolute",
           top: 0,
           left: 0,
-          transform: `translate(${currentOffset.x}px, ${currentOffset.y}px)`,
+          transform: `translate(${x}px, ${y}px)`,
           pointerEvents: "none",
         }}
       >