Three.js canvas updates when cam position/target is changed

[chrome willow]

Hey, currently I am trying to load multiple 3d elements on my page (works fine) and change the positionings with the help of a modal.

I followed this tutorial to provide only one canvas with multiple 3d elements in it: https://codesandbox.io/p/devbox/github/pmndrs/react-three-next/

However: the changing of the camera perspective is pretty buggy as you can see here: (see attached) -> If you don't know what I mean, watch the video (1 min)

Why is it that buggy and why does changing the position & target from one element does affect the other elements as well?

For the rendering of the elements I used the codesandbox. Let me know if you need more code for specific parts.

[chrome willow]

Bump

[chrome willow]

bump

[chrome willow]

Solved it by removing the <Stage> component and adding a PerspectiveCamera that will be made as default. Another thing that I done was to put every element to the position 0,0,0. I also modified how position/targets are calculated/renewed and created my own camera controller so it's less buggy and there are less rerenders. With the remove of the stage I also renewed the lighting and now have a more accurate and easier to manage light management.

The final result (to big for discord):
https://we.tl/t-XPMbirk0QN