I have found the solution for my question.
it seems that react-three-fiber has conflicts with React 19. so by installing '@react-three/fiber@alpha' seems to fix the issue
npm install @react-three/fiber@alpha
here is the link to where I found the answer:
https://github.com/vercel/next.js/issues/66468#issuecomment-2296319798
thanks for all the answers!