useMask for nested meshes

[enijar]

I'm using the useMask hook to clip all child meshes with the stencil buffer.

The code I've written in this repo is attempting to apply a mask based on the parent mesh. This doesn't seem to work on nested meshes. I'm using React Context to reference the parent ID and use the mask hook to apply the clipping.

The relevant code is here, here, and here.

Here's what it currently looks like:

And here is what I'd like it to look like:

Can someone help me with this? Or is another way to achieve the same effect?

Here's a minimal repro of the issue:

https://codesandbox.io/s/dreamy-sea-k55679?file=/src/App.tsx