useActionData on layout after v2.3.0

[eduardodallmann]

Hello, after version 2.3.0 the useActionData hook does not trigger the reaction.

I have a layout route _app/route.tsx and a route with a form _app/document.tsx, I also have a Form component. All 3 use useActionData and will show an alert when the action data changes. But the layout route doesn't react. If I change to version 2.2.0 everything works again.
I saw in the changelog that some things changed, I tried to include unstable_flushSync both true and false but without success. What am I missing?

Example:
https://codesandbox.io/p/devbox/aged-cache-jw7k7s

[eduardodallmann]

Looking at react-router, I believe the change that impacted was this
remix-run/react-router#11022

Contextualizing, in my current project, I use the useActionData hook in a layout route to always display the same error modal if the action of any child route returns {globalError: true, message: 'blabla'}.
If I can no longer use useActionData for this, what would be a good alternative?

[hi-ogawa]

Hey, there are some comments in the linked PR. You might find these helpful remix-run/react-router#11023 (comment) remix-run/react-router#11023 (comment)

[eduardodallmann]

thanks @hi-ogawa your suggestion works like a charm, although I'm afraid to use UNSAFE 😬

https://codesandbox.io/p/devbox/nostalgic-http-7zs7rp

[kiliman]

NOTE: the unsafe_ prefix simply means the API may change in the future. It doesn't mean it's buggy or will cause issues in your app. The Remix team wants people to use these APIs to ensure they cover the proper use cases. Once the requirements are fully understood, they will update the API and remove the unsafe_ prefix.