React doesn't reload on globals change

[TraverserEternal]

Hi, love this package! It's something I've always wanted for unity. I noticed in my unity project that react doesn't seem to rerender when Globals change. Is this a known issue, or am I doing something wrong? If you'd like, I can bring some further details/images to clarify

[KurtGokhan]

Globals are not supposed to change. They are meant to be global constants. They are passed from C# to the React side only at the initialization and never again. What you can do is, you can assign a MonoBehavior to a global, then handle the changes inside that MonoBehavior. You can have an internal dictionary that holds the variables, and add events that handle changes to variables to trigger a render in React side.

Also, ReactUnity does not rerender React components itself. That is handled by React. If you want to rerender a component, you need to do it in React way. You can try one of these methods.

[TraverserEternal]

Alright, how would I go about making an event to trigger the react render? I currently have a monobehaviour (assigned as a global), but variables that change within that monobehaviour aren't reflected on the react side of things.

Thanks for the help in advance!

[caldarellial]

I've had early luck working with UnityEvents to accomplish this. Hope this helps.

[KurtGokhan]

Thanks @caldarellial , good example.

This seems like a common use case so I will check if it is possible to do the change detection with React Contexts.

[TraverserEternal]

OH! I didn't know you could add event listeners across the language! That's incredible, thank you so much. This project is great

[KurtGokhan]

This is now possible with latest version of @reactunity/core and @reactunity/renderer.

reactunity/renderer now has two useful exports: GlobalsProvider component and useGlobals hook. Example usage:

function App() {
  // This will be rerendered when Globals change in the C# side
  const globals = useGlobals();

  // Component logic here ...
}

Renderer.render(
  <GlobalsProvider>
    <App />
  </GlobalsProvider>
);

Edit: GlobalsProvider is not needed anymore.