fix: 3D View blank canvas (coordinate mismatch) and truncated UI

frontend/src/components/facility3d/Room3DViewer.tsx

@@ -20,24 +20,43 @@ export function Room3DViewer({ room, visMode = 'STANDARD', onPlantClick }: Room3
             return {
                 ...room,
                 // Ensure dimensions exist
-                width: room.width || 20,
+                width: room.width || 40, // Default to ~40ft
-                height: room.height || 30,
+                height: room.height || 60,
-                x: 0,
+                posX: room.x || 0, // Map x/y to posX/posY if needed, or default 0
-                y: 0,
+                posY: room.y || 0,
-                sections: room.sections || room.racks || [], // Map racks/sections to standard field
+                sections: room.sections || room.racks || [],
             };
         }
 
-        // Fallback: Create a mock layout based on capacity
+        // Fallback: Create a mock layout with some demo racks
+        const mockWidth = 50;
+        const mockHeight = 40;
+
+        // Generate 4 mock racks
+        const mockSections = Array.from({ length: 4 }).map((_, i) => ({
+            id: `mock-rack-${i}`,
+            name: `Rack 0${i + 1}`,
+            type: 'rack',
+            posX: 5 + (i * 10), // Spaced out X
+            posY: 10,           // Centered Y roughly
+            width: 4,
+            height: 20,
+            positions: Array.from({ length: 16 }).map((__, p) => ({
+                id: `p-${i}-${p}`,
+                name: `P${p + 1}`,
+                valid: true
+            }))
+        }));
+
         return {
             id: room.id,
             name: room.name,
             type: room.type,
-            width: 20,
+            width: mockWidth,
-            height: 30,
+            height: mockHeight,
-            x: 0,
+            posX: 0,
-            y: 0,
+            posY: 0,
-            sections: [], // Empty for now, or could generatively fill
+            sections: mockSections,
         };
     }, [room]);
 
@@ -71,7 +90,7 @@ export function Room3DViewer({ room, visMode = 'STANDARD', onPlantClick }: Room3
                 <OrbitControls makeDefault minPolarAngle={0} maxPolarAngle={Math.PI / 2.2} />
             </Canvas>
 
-            <div className="absolute top-4 right-4 bg-black/60 backdrop-blur-md px-3 py-1.5 rounded-full border border-white/10 text-xs font-medium text-white/80 pointer-events-none">
+            <div className="absolute bottom-4 right-4 bg-black/60 backdrop-blur-md px-3 py-1.5 rounded-full border border-white/10 text-xs font-medium text-white/80 pointer-events-none">
                 Interactive 3D View
             </div>
         </div>