Merge pull request #261 from dennemark/renderHtmlAfter

Use useAfterRender instead of useBeforeRender for Html
brianzinn · Nov 17, 2022 · f8b331c · f8b331c
2 parents 7f0eac1 + c9e523c
commit f8b331c
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/packages/react-babylonjs/src/customComponents/Html.tsx b/packages/react-babylonjs/src/customComponents/Html.tsx
@@ -20,7 +20,7 @@ import React, {
 // import {  unmountComponentAtNode } from 'react-dom'
 import { createRoot } from 'react-dom/client'
 import { FiberAbstractMeshProps, FiberAbstractMeshPropsCtor } from '../generatedProps'
-import { useBeforeRender } from '../hooks/render'
+import { useAfterRender } from '../hooks/render'
 import { useScene } from '../hooks/scene'
 
 function defaultCalculatePosition(el: AbstractMesh, camera: Camera) {
@@ -288,7 +288,7 @@ const Html = forwardRef(
 
     const visible = useRef(true)
 
-    useBeforeRender(() => {
+    useAfterRender(() => {
       const camera = scene?.activeCamera
 
       if (camera && group.current) {

diff --git a/packages/react-babylonjs/src/hooks/render.ts b/packages/react-babylonjs/src/hooks/render.ts
@@ -56,7 +56,8 @@ export const useAfterRender = (
   callback: OnFrameRenderFn,
   mask?: number,
   insertFirst?: boolean,
-  callOnce?: boolean
+  callOnce?: boolean,
+  deps: React.DependencyList = []
 ): void => {
   const { scene } = useContext(SceneContext)
 
@@ -79,5 +80,5 @@ export const useAfterRender = (
         scene.onAfterRenderObservable.remove(sceneObserver)
       }
     }
-  })
+  }, [scene, ...deps])
 }