fix(react-grid-layout): fixed react-grid-layout issue (#59)

* Fix(react-grid-layout): fixed react-grid-layout issue * chore: lint issues
gravity-ui · Jun 15, 2023 · bdb3f87 · bdb3f87
1 parent ae29c82
commit bdb3f87
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/src/components/GridItem/GridItem.js b/src/components/GridItem/GridItem.js
@@ -38,7 +38,7 @@ class GridItem extends React.PureComponent {
     static contextType = DashKitContext;
 
     renderOverlay() {
-        const {overlayControls} = this.props;
+        const {overlayControls, isDragging} = this.props;
         const {editMode} = this.context;
 
         if (!editMode || this.props.item.data._editActive) {
@@ -54,6 +54,7 @@ class GridItem extends React.PureComponent {
                 <OverlayControls
                     configItem={item}
                     items={controls}
+                    isDragging={isDragging}
                     overlayControls={overlayControls}
                 />
             </React.Fragment>

diff --git a/src/components/OverlayControls/OverlayControls.tsx b/src/components/OverlayControls/OverlayControls.tsx
@@ -61,6 +61,7 @@ interface OverlayControlsDefaultProps {
 }
 
 interface OverlayControlsProps extends OverlayControlsDefaultProps {
+    isDragging?: boolean;
     configItem: ConfigItem;
     items?: OverlayControlItem[];
     overlayControls?: Record<string, OverlayControlItem[]>;
@@ -320,6 +321,11 @@ class OverlayControls extends React.Component<OverlayControlsProps> {
         this.context.editItem(this.props.configItem);
     };
     private onRemoveItem = () => {
+        // Otherwise it will crush an app dute to the issue in react-grid-layout
+        // https://github.com/react-grid-layout/react-grid-layout/issues/1836
+        if (this.props.isDragging) {
+            return;
+        }
         const {id} = this.props.configItem;
         this.context.removeItem(id);
     };