fix: Slate error on closing text component (#1510)

concord-consortium · Sep 25, 2024 · 0ccaefc · 0ccaefc
1 parent 95db58d
commit 0ccaefc
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/v3/src/components/text/text-tile.tsx b/v3/src/components/text/text-tile.tsx
@@ -29,14 +29,21 @@ export const TextTile = observer(function TextTile({ tile }: ITileBaseProps) {
   }, [initialValue])
 
   useEffect(() => {
-    return tile && mstReaction(
+    let animationFrame: number
+    const disposer = tile && mstReaction(
       () => isTileSelected() && tile?.transitionComplete,
       isSelected => {
         // RAF to delay focus request until after model processing completes
-        isSelected && requestAnimationFrame(() => ReactEditor.focus(editor))
+        if (isSelected) {
+          animationFrame = requestAnimationFrame(() => ReactEditor.focus(editor))
+        }
       },
       { name: "FocusEditorOnTileSelect" }, tile
     )
+    return () => {
+      if (animationFrame) cancelAnimationFrame(animationFrame)
+      disposer?.()
+    }
   }, [editor, isTileSelected, tile])
 
   const textTileRef = useRef<HTMLDivElement | null>(null)