built out a simple framework for building 3d objects

an orbital camera and some basic shapes are used to build the 3d bin shell and the flat inventory when using manual or lidar are built

src/3dModels/Shapes/BaseMesh.tsx

@@ -0,0 +1,87 @@
+import { Euler, Vector3, BufferGeometry, MaterialParameters, Side } from "three";
+
+export interface BaseMeshProps {
+    geometry: BufferGeometry;
+    position?: Vector3;
+    rotation?: Euler;
+    colour?: string;
+    opacity?: number;
+    metalness?: number;
+    roughness?: number;
+    wireframe?: boolean;
+    frameColour?: string;
+    materialType?: "standard" | "basic";
+    materialProps?: Partial<MaterialParameters>;
+    materialOverride?: React.ReactNode;
+    side?: Side
+}
+
+export default function BaseMesh(props: BaseMeshProps) {
+    const {
+        geometry,
+        position,
+        rotation,
+        colour = "#fff",
+        opacity = 1,
+        metalness = 0,
+        roughness = 1,
+        wireframe = false,
+        frameColour = "black",
+        materialType,
+        materialProps,
+        materialOverride,
+        side
+    } = props;
+
+    const isTransparent = opacity < 1;
+    const buildMaterial = () => {
+        if (materialOverride) return materialOverride;
+        switch (materialType) {
+            case "basic":
+                return (
+                    <meshBasicMaterial
+                        color={colour}
+                        transparent={isTransparent}
+                        opacity={opacity}
+                        depthWrite={!isTransparent}
+                        side={side}
+                        {...materialProps}
+                    />
+                );
+    
+            case "standard":
+            default:
+                return (
+                    <meshStandardMaterial
+                        color={colour}
+                        metalness={metalness}
+                        roughness={roughness}
+                        transparent={isTransparent}
+                        opacity={opacity}
+                        depthWrite={!isTransparent}
+                        side={side}
+                        {...materialProps}
+                    />
+                );
+        }
+    };
+
+    return (
+        <group position={position} rotation={rotation}>
+            {/* Main surface */}
+            <mesh geometry={geometry}>
+                {buildMaterial()}
+            </mesh>
+
+            {/* Optional wireframe overlay */}
+            {wireframe && (
+                <mesh geometry={geometry}>
+                    <meshStandardMaterial
+                        wireframe
+                        color={frameColour}
+                    />
+                </mesh>
+            )}
+        </group>
+    );
+}