fix(core/executions): Disable text selection when re-ordering pipelin…

…es (#6603)
spinnaker · Feb 22, 2019 · 70fb404 · 70fb404
1 parent 35d38da
commit 70fb404
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/app/scripts/modules/core/src/pipeline/filter/ExecutionFilters.tsx b/app/scripts/modules/core/src/pipeline/filter/ExecutionFilters.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 import * as ReactGA from 'react-ga';
 import { get, isEmpty, orderBy, uniq } from 'lodash';
 import { Debounce } from 'lodash-decorators';
+import * as classnames from 'classnames';
 import { SortableContainer, SortableElement, SortableHandle, arrayMove, SortEnd } from 'react-sortable-hoc';
 import { Subscription } from 'rxjs';
 
@@ -290,7 +291,7 @@ const FilterCheckbox = (props: {
 
 const Pipeline = SortableElement(
   (props: { tag: IFilterTag; pipeline: string; dragEnabled: boolean; update: () => void }) => (
-    <div className="checkbox sortable">
+    <div className={classnames('checkbox sortable', { 'disable-user-select': props.dragEnabled })}>
       <div>
         <label>
           {props.dragEnabled && <DragHandle />}

diff --git a/app/scripts/modules/core/src/pipeline/filter/executionFilters.less b/app/scripts/modules/core/src/pipeline/filter/executionFilters.less
@@ -1,4 +1,5 @@
-execution-filters, .execution-filters {
+execution-filters,
+.execution-filters {
   width: 100%;
   display: flex;
   .sortable {
@@ -9,5 +10,8 @@ execution-filters, .execution-filters {
       opacity: 0.7;
       font-size: 80%;
     }
+    &.disable-user-select {
+      user-select: none;
+    }
   }
 }