import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
const CameraController = () => {
const { camera, gl } = useThree();
useEffect(() => {
const controls = new OrbitControls(camera, gl.domElement);
return () => {
controls.dispose();
};
}, [camera, gl]);
return null;
};
const Home: NextPage = () => {
return (
<div className="">
<main className=" w-full h-[100vh]">
<Canvas>
<CameraController />
<ambientLight intensity={0.1} />
<directionalLight color="blue" position={[0, 0, 5]} />
<AnimateBox />
</Canvas>
</main>
</div>
);
};