From b15a8a8683bafbc9fd57dc64d60329f9ab08ecfd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 24 Aug 2021 22:13:18 +0200
Subject: [PATCH] fix: fix a bug when using nested node views in react, fix
 #1747

---
 packages/react/src/NodeViewContent.tsx       | 8 +++++++-
 packages/react/src/ReactNodeViewRenderer.tsx | 3 ++-
 packages/react/src/useReactNodeView.ts       | 1 +
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/NodeViewContent.tsx b/packages/react/src/NodeViewContent.tsx
index 0455d56d..e9a9e96f 100644
--- a/packages/react/src/NodeViewContent.tsx
+++ b/packages/react/src/NodeViewContent.tsx
@@ -1,4 +1,5 @@
-import React from 'react'
+import React, { useEffect } from 'react'
+import { useReactNodeView } from './useReactNodeView'
 
 export interface NodeViewContentProps {
   [key: string]: any,
@@ -7,6 +8,11 @@ export interface NodeViewContentProps {
 
 export const NodeViewContent: React.FC<NodeViewContentProps> = React.forwardRef((props, ref) => {
   const Tag = props.as || 'div'
+  const { maybeMoveContentDOM } = useReactNodeView()
+
+  useEffect(() => {
+    maybeMoveContentDOM?.()
+  }, [])
 
   return (
     <Tag
diff --git a/packages/react/src/ReactNodeViewRenderer.tsx b/packages/react/src/ReactNodeViewRenderer.tsx
index 730456f3..dfc6831f 100644
--- a/packages/react/src/ReactNodeViewRenderer.tsx
+++ b/packages/react/src/ReactNodeViewRenderer.tsx
@@ -50,10 +50,11 @@ class ReactNodeView extends NodeView<React.FunctionComponent, Editor, ReactNodeV
 
     const ReactNodeViewProvider: React.FunctionComponent = componentProps => {
       const onDragStart = this.onDragStart.bind(this)
+      const maybeMoveContentDOM = this.maybeMoveContentDOM.bind(this)
       const Component = this.component
 
       return (
-        <ReactNodeViewContext.Provider value={{ onDragStart }}>
+        <ReactNodeViewContext.Provider value={{ onDragStart, maybeMoveContentDOM }}>
           <Component {...componentProps} />
         </ReactNodeViewContext.Provider>
       )
diff --git a/packages/react/src/useReactNodeView.ts b/packages/react/src/useReactNodeView.ts
index a1353e53..1cad98a2 100644
--- a/packages/react/src/useReactNodeView.ts
+++ b/packages/react/src/useReactNodeView.ts
@@ -2,6 +2,7 @@ import { createContext, useContext } from 'react'
 
 export interface ReactNodeViewContextProps {
   onDragStart: (event: DragEvent) => void,
+  maybeMoveContentDOM: () => void,
 }
 
 export const ReactNodeViewContext = createContext<Partial<ReactNodeViewContextProps>>({