From 3d6671b4216669c707c1e2521c019a803f5293f4 Mon Sep 17 00:00:00 2001
From: Marta Bondyra <marta.bondyra@elastic.co>
Date: Mon, 19 Oct 2020 20:34:36 +0200
Subject: [PATCH] fixes

---
 .../drag_drop/__snapshots__/drag_drop.test.tsx.snap |  2 +-
 .../lens/public/drag_drop/drag_drop.test.tsx        |  2 --
 x-pack/plugins/lens/public/drag_drop/drag_drop.tsx  | 13 +++++++++++--
 .../editor_frame/config_panel/layer_panel.test.tsx  |  5 +++--
 .../dimension_panel/droppable.test.ts               |  2 +-
 .../dimension_panel/droppable.ts                    |  8 ++++----
 6 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap b/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap
index 80a31fc20d4f9..dc53f3a2bc2a7 100644
--- a/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap
+++ b/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`DragDrop droppable is reflected in the className 1`] = `
 
 exports[`DragDrop items that have droppable=false get special styling when another item is dragged 1`] = `
 <button
-  className="lnsDragDrop lnsDragDrop-isDroppable"
+  className="lnsDragDrop lnsDragDrop-isDroppable lnsDragDrop-isNotDroppable"
   data-test-subj="lnsDragDrop"
   onDragEnd={[Function]}
   onDragLeave={[Function]}
diff --git a/x-pack/plugins/lens/public/drag_drop/drag_drop.test.tsx b/x-pack/plugins/lens/public/drag_drop/drag_drop.test.tsx
index 2b32d643a1daa..c7d81c0e3adb1 100644
--- a/x-pack/plugins/lens/public/drag_drop/drag_drop.test.tsx
+++ b/x-pack/plugins/lens/public/drag_drop/drag_drop.test.tsx
@@ -5,7 +5,6 @@
  */
 
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { render, mount } from 'enzyme';
 import { DragDrop, ReorderableDragDrop } from './drag_drop';
 import { ChildDragDropProvider, ReorderProvider } from './providers';
@@ -367,7 +366,6 @@ describe('DragDrop', () => {
       let dragging: { id: '1' } | undefined = { id: '1' };
       const preventDefault = jest.fn();
       const stopPropagation = jest.fn();
-      const setDragging = jest.fn();
       const onDrop = jest.fn();
       const component = mount(
         <ChildDragDropProvider
diff --git a/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx b/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx
index 793abba848410..0e5ad8b99a606 100644
--- a/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx
+++ b/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx
@@ -166,16 +166,17 @@ const DragDropInner = React.memo(function DragDropInner(
     itemsInGroup,
   } = props;
 
+  const isMoveDragging = isDragging && dragType === 'move';
   const classes = classNames(
     'lnsDragDrop',
     {
       'lnsDragDrop-isDraggable': draggable,
       'lnsDragDrop-isDragging': isDragging,
-      'lnsDragDrop-isHidden': isDragging && dragType === 'move',
+      'lnsDragDrop-isHidden': isMoveDragging,
       'lnsDragDrop-isDroppable': !draggable,
       'lnsDragDrop-isDropTarget': droppable && dragType !== 'reorder',
       'lnsDragDrop-isActiveDropTarget': droppable && state.isActive && dragType !== 'reorder',
-      'lnsDragDrop-isNotDroppable': isNotDroppable,
+      'lnsDragDrop-isNotDroppable': !isMoveDragging && isNotDroppable,
       'lnsDragDrop-isReplacing': droppable && state.isActive && dropType === 'replace',
     },
     className,
@@ -186,6 +187,14 @@ const DragDropInner = React.memo(function DragDropInner(
     // Setting stopPropgagation causes Chrome failures, so
     // we are manually checking if we've already handled this
     // in a nested child, and doing nothing if so...
+    function clearSelection() {
+      if (window.getSelection) {
+        window.getSelection().removeAllRanges();
+      } else if (document.selection) {
+        document.selection.empty();
+      }
+    }
+    clearSelection();
     if (e.dataTransfer.getData('text')) {
       return;
     }
diff --git a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx
index b02cbd4ca878f..ce21d113217d4 100644
--- a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx
+++ b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx
@@ -459,8 +459,9 @@ describe('LayerPanel', () => {
       );
 
       expect(mockDatasource.canHandleDrop).not.toHaveBeenCalled();
-      const reorderableGroupElement = component.find('DragDrop[data-test-subj="lnsGroup"]').at(1);
-      reorderableGroupElement?.prop('onDrop')!((draggingOperation as unknown) as DroppableEvent)!;
+      component.find('DragDrop[data-test-subj="lnsGroup"]').at(1).prop('onDrop')!(
+        (draggingOperation as unknown) as DroppableEvent
+      );
       expect(mockDatasource.onDrop).toHaveBeenCalledWith(
         expect.objectContaining({
           isReorder: true,
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.test.ts b/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.test.ts
index 8256e8699f31a..bbd1d4e0ae3ab 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.test.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.test.ts
@@ -658,7 +658,7 @@ describe('IndexPatternDimensionEditorPanel', () => {
         layers: {
           myLayer: {
             ...testState.layers.myLayer,
-            columnOrder: columnOrder,
+            columnOrder,
             columns: {
               ...testState.layers.myLayer.columns,
             },
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.ts b/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.ts
index 834b5af86d513..7f509cd0244f0 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/droppable.ts
@@ -108,8 +108,8 @@ export function onDrop(props: DatasourceDimensionDropHandlerProps<IndexPatternPr
     // Time to replace
     setState(
       mergeLayer({
-        state: state,
-        layerId: layerId,
+        state,
+        layerId,
         newLayer: {
           columnOrder: newColumnOrder,
           columns: newColumns,
@@ -163,9 +163,9 @@ export function onDrop(props: DatasourceDimensionDropHandlerProps<IndexPatternPr
 
   setState(
     changeColumn({
-      state: state,
+      state,
       layerId,
-      columnId: columnId,
+      columnId,
       newColumn,
       // If the field has changed, the onFieldChange method needs to take care of everything including moving
       // over params. If we create a new column above we want changeColumn to move over params.