React and Three.js, Dragging Issue

assume that we have a random number of boxes, all the boxes are draggable, when you choose a random box, that box should not collide with other boxes due to dragging
hint: " i already tried the bounding box to check for collision but dont know what to write after"
thanks for helping <3

Figuring out how to repair a collision is really hard, but remembering where it was before it started colliding, and moving it back to that place once it collides is a lot easier.

So, maybe record where all the cubes are at the beginning… let the user do their move… and if there is a collision, reset the colliding cube back to your saved spot? If there is not collision, then update that cubes saved position to its new position… and repeat the process.

do you use a physics system? dragging plus collisions is pretty easy if you have one

for example Lusion connectors - CodeSandbox (this isn’t technically dragging but one shape follows the mouse). the other shapes aren’t fixed, but if they were they wouldn’t budge.

otherwise you would have to implement your own light collision system, using raycasting and three-bvh.

ps if it helps i have basic resources for dragging in react + three, though none of these implement physics yet