Clean up nested editor update (facebook#7039)

GermanJablo · Jan 11, 2025 · 930629c · 930629c
1 parent bd874a3
commit 930629c
Show file tree

Hide file tree

Showing 7 changed files with 35 additions and 49 deletions.
diff --git a/packages/lexical-playground/src/nodes/ExcalidrawNode/ExcalidrawComponent.tsx b/packages/lexical-playground/src/nodes/ExcalidrawNode/ExcalidrawComponent.tsx
@@ -57,16 +57,14 @@ export default function ExcalidrawComponent({
     (event: KeyboardEvent) => {
       if (isSelected) {
         event.preventDefault();
-        editor.update(() => {
-          const node = $getNodeByKey(nodeKey);
-          if (node) {
-            node.remove();
-          }
-        });
+        const node = $getNodeByKey(nodeKey);
+        if (node) {
+          node.remove();
+        }
       }
       return false;
     },
-    [editor, isSelected, nodeKey],
+    [isSelected, nodeKey],
   );
 
   useEffect(() => {

diff --git a/packages/lexical-playground/src/nodes/ImageComponent.tsx b/packages/lexical-playground/src/nodes/ImageComponent.tsx
@@ -180,17 +180,15 @@ export default function ImageComponent({
       if (isSelected && $isNodeSelection(deleteSelection)) {
         const event: KeyboardEvent = payload;
         event.preventDefault();
-        editor.update(() => {
-          deleteSelection.getNodes().forEach((node) => {
-            if ($isImageNode(node)) {
-              node.remove();
-            }
-          });
+        deleteSelection.getNodes().forEach((node) => {
+          if ($isImageNode(node)) {
+            node.remove();
+          }
         });
       }
       return false;
     },
-    [editor, isSelected],
+    [isSelected],
   );
 
   const $onEnter = useCallback(

diff --git a/packages/lexical-playground/src/nodes/InlineImageNode/InlineImageComponent.tsx b/packages/lexical-playground/src/nodes/InlineImageNode/InlineImageComponent.tsx
@@ -210,18 +210,16 @@ export default function InlineImageComponent({
         const event: KeyboardEvent = payload;
         event.preventDefault();
         if (isSelected && $isNodeSelection(deleteSelection)) {
-          editor.update(() => {
-            deleteSelection.getNodes().forEach((node) => {
-              if ($isInlineImageNode(node)) {
-                node.remove();
-              }
-            });
+          deleteSelection.getNodes().forEach((node) => {
+            if ($isInlineImageNode(node)) {
+              node.remove();
+            }
           });
         }
       }
       return false;
     },
-    [editor, isSelected],
+    [isSelected],
   );
 
   const $onEnter = useCallback(

diff --git a/packages/lexical-playground/src/nodes/PageBreakNode/index.tsx b/packages/lexical-playground/src/nodes/PageBreakNode/index.tsx
@@ -40,17 +40,15 @@ function PageBreakComponent({nodeKey}: {nodeKey: NodeKey}) {
       event.preventDefault();
       const deleteSelection = $getSelection();
       if (isSelected && $isNodeSelection(deleteSelection)) {
-        editor.update(() => {
-          deleteSelection.getNodes().forEach((node) => {
-            if ($isPageBreakNode(node)) {
-              node.remove();
-            }
-          });
+        deleteSelection.getNodes().forEach((node) => {
+          if ($isPageBreakNode(node)) {
+            node.remove();
+          }
         });
       }
       return false;
     },
-    [editor, isSelected],
+    [isSelected],
   );
 
   useEffect(() => {

diff --git a/packages/lexical-playground/src/nodes/PollComponent.tsx b/packages/lexical-playground/src/nodes/PollComponent.tsx
@@ -150,17 +150,15 @@ export default function PollComponent({
       if (isSelected && $isNodeSelection(deleteSelection)) {
         const event: KeyboardEvent = payload;
         event.preventDefault();
-        editor.update(() => {
-          deleteSelection.getNodes().forEach((node) => {
-            if ($isPollNode(node)) {
-              node.remove();
-            }
-          });
+        deleteSelection.getNodes().forEach((node) => {
+          if ($isPollNode(node)) {
+            node.remove();
+          }
         });
       }
       return false;
     },
-    [editor, isSelected],
+    [isSelected],
   );
 
   useEffect(() => {

diff --git a/packages/lexical-react/src/LexicalBlockWithAlignableContents.tsx b/packages/lexical-react/src/LexicalBlockWithAlignableContents.tsx
@@ -57,17 +57,15 @@ export function BlockWithAlignableContents({
       const deleteSelection = $getSelection();
       if (isSelected && $isNodeSelection(deleteSelection)) {
         event.preventDefault();
-        editor.update(() => {
-          deleteSelection.getNodes().forEach((node) => {
-            if ($isDecoratorNode(node)) {
-              node.remove();
-            }
-          });
+        deleteSelection.getNodes().forEach((node) => {
+          if ($isDecoratorNode(node)) {
+            node.remove();
+          }
         });
       }
       return false;
     },
-    [editor, isSelected],
+    [isSelected],
   );
 
   useEffect(() => {

diff --git a/packages/lexical-react/src/LexicalHorizontalRuleNode.tsx b/packages/lexical-react/src/LexicalHorizontalRuleNode.tsx
@@ -53,17 +53,15 @@ function HorizontalRuleComponent({nodeKey}: {nodeKey: NodeKey}) {
       const deleteSelection = $getSelection();
       if (isSelected && $isNodeSelection(deleteSelection)) {
         event.preventDefault();
-        editor.update(() => {
-          deleteSelection.getNodes().forEach((node) => {
-            if ($isHorizontalRuleNode(node)) {
-              node.remove();
-            }
-          });
+        deleteSelection.getNodes().forEach((node) => {
+          if ($isHorizontalRuleNode(node)) {
+            node.remove();
+          }
         });
       }
       return false;
     },
-    [editor, isSelected],
+    [isSelected],
   );
 
   useEffect(() => {