react-three-fiber and react-three/drei orbitcontrols error

I have a very simple scene like so:

import React from 'react';
import { Canvas } from '@react-three/fiber';
import { OrbitControls } from '@react-three/drei';

const Scene = () => {
  return (
    <Canvas>
      <OrbitControls />
    </Canvas>
  );
};

export default Scene;

Now when I run this code I get the following runtime error:

Cannot read properties of undefined (reading ‘ReactCurrentOwner’)
TypeError: Cannot read properties of undefined (reading ‘ReactCurrentOwner’)

And if I remove the <OrbitControls /> component it all works fine.
But for my project I do need the orbit controls how do I make this work?

I have experience with regular old three js, but not with the libraries react-three-fiber and the helper library drei. Yet for the project I am working for uses these libraries soo here we are…

Any help would be greatly appreciated.