Fix drag-performance (#1184)

* Fix drag-performance

* Fixes

* Fixes

* Fixes

* Fixes

front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx

@@ -4,6 +4,8 @@ import {
   useSelectionContainer,
 } from '@air/react-drag-to-select';
 
+import { useDragSelect } from '../hooks/useDragSelect';
+
 type OwnProps = {
   dragSelectable: RefObject<HTMLElement>;
   onDragSelectionChange: (id: string, selected: boolean) => void;
@@ -15,8 +17,12 @@ export function DragSelect({
   onDragSelectionChange,
   onDragSelectionStart,
 }: OwnProps) {
+  const { isDragSelectionStartEnabled } = useDragSelect();
   const { DragSelection } = useSelectionContainer({
     shouldStartSelecting: (target) => {
+      if (!isDragSelectionStartEnabled()) {
+        return false;
+      }
       if (target instanceof HTMLElement) {
         let el = target;
         while (el.parentElement && !el.dataset.selectDisable) {

front/src/modules/ui/utilities/drag-select/hooks/useDragSelect.ts

@@ -0,0 +1,28 @@
+import { useRecoilCallback, useRecoilState } from 'recoil';
+
+import { isDragSelectionStartEnabledState } from '../states/internal/isDragSelectionStartEnabledState';
+
+export function useDragSelect() {
+  const [, setIsDragSelectionStartEnabledInternal] = useRecoilState(
+    isDragSelectionStartEnabledState,
+  );
+
+  function setDragSelectionStartEnabled(isEnabled: boolean) {
+    setIsDragSelectionStartEnabledInternal(isEnabled);
+  }
+
+  const isDragSelectionStartEnabled = useRecoilCallback(
+    ({ snapshot }) =>
+      () => {
+        return snapshot
+          .getLoadable(isDragSelectionStartEnabledState)
+          .getValue();
+      },
+    [],
+  );
+
+  return {
+    isDragSelectionStartEnabled,
+    setDragSelectionStartEnabled,
+  };
+}

front/src/modules/ui/utilities/drag-select/states/internal/isDragSelectionStartEnabledState.ts

@@ -0,0 +1,6 @@
+import { atom } from 'recoil';
+
+export const isDragSelectionStartEnabledState = atom({
+  key: 'drag-select/isDragSelectionStartEnabledState',
+  default: true,
+});