disable rotation with prop

/claim tscircuit#103
chaadiic · Jan 9, 2025 · a1f7388 · a1f7388
1 parent 00cc0a3
commit a1f7388
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git a/src/CadViewer.tsx b/src/CadViewer.tsx
@@ -21,12 +21,13 @@ import { Error3d } from "./three-components/Error3d"
 
 interface Props {
   soup?: AnySoupElement[]
+  autoRotateDisabled?: boolean
 }
 
 export const CadViewer = forwardRef<
   THREE.Object3D,
   React.PropsWithChildren<Props>
->(({ soup, children }, ref) => {
+>(({ soup, children, autoRotateDisabled }, ref) => {
   const [hoveredComponent, setHoveredComponent] = useState<null | {
     cad_component_id: string
     name: string
@@ -46,7 +47,7 @@ export const CadViewer = forwardRef<
   const cad_components = su(soup).cad_component.list()
 
   return (
-    <CadViewerContainer ref={ref} hoveredComponent={hoveredComponent}>
+    <CadViewerContainer ref={ref} hoveredComponent={hoveredComponent} autoRotateDisabled={autoRotateDisabled}>
       {boardStls.map(({ stlUrl, color }, index) => (
         <STLModel
           key={stlUrl}
@@ -65,7 +66,6 @@ export const CadViewer = forwardRef<
           <AnyCadComponent
             key={cad_component.cad_component_id}
             onHover={(e) => {
-              // TODO this should be done by onUnhover
               if (!e) {
                 setHoveredComponent(null)
               }
@@ -81,10 +81,7 @@ export const CadViewer = forwardRef<
               })
             }}
             cad_component={cad_component}
-            isHovered={
-              hoveredComponent?.cad_component_id ===
-              cad_component.cad_component_id
-            }
+            isHovered={hoveredComponent?.cad_component_id === cad_component.cad_component_id}
           />
         </ThreeErrorBoundary>
       ))}

diff --git a/src/CadViewerContainer.tsx b/src/CadViewerContainer.tsx
@@ -22,12 +22,13 @@ interface Props {
     name: string
     mousePosition: [number, number, number]
   } | null
+  autoRotateDisabled?: boolean
 }
 
 export const CadViewerContainer = forwardRef<
   THREE.Object3D,
   React.PropsWithChildren<Props>
->(({ children, hoveredComponent }, ref) => {
+>(({ children, hoveredComponent, autoRotateDisabled }, ref) => {
   return (
     <div style={{ position: "relative", width: "100%", height: "100%" }}>
       <div
@@ -55,7 +56,7 @@ export const CadViewerContainer = forwardRef<
         camera={{ up: [0, 0, 1], position: [5, 5, 5] }}
       >
         <RotationTracker />
-        <OrbitControls autoRotate autoRotateSpeed={1} />
+        {!autoRotateDisabled && <OrbitControls autoRotate autoRotateSpeed={1} />}
         <ambientLight intensity={Math.PI / 2} />
         <pointLight
           position={[-10, -10, 10]}