can place on wall

packages/core/src/hooks/spatial-grid/spatial-grid-manager.ts

@@ -45,18 +45,21 @@ export class SpatialGridManager {
         item.asset.attachTo === "wall" ||
         item.asset.attachTo === "wall-side"
       ) {
-        // Wall-attached item
-        if (item.wallId && item.wallT !== undefined) {
-          const wallLength = this.getWallLength(item.wallId);
+        // Wall-attached item - use parentId as the wall ID
+        const wallId = item.parentId;
+        if (wallId && this.walls.has(wallId)) {
+          const wallLength = this.getWallLength(wallId);
           if (wallLength > 0) {
             const [width, height] = item.asset.dimensions;
             const halfW = width / wallLength / 2;
             const halfH = height / 2;
+            // Calculate t from local X position (position[0] is distance along wall)
+            const t = item.position[0] / wallLength;
             this.getWallGrid(levelId).insert({
               itemId: item.id,
-              wallId: item.wallId,
-              tStart: item.wallT - halfW,
-              tEnd: item.wallT + halfW,
+              wallId: wallId,
+              tStart: t - halfW,
+              tEnd: t + halfW,
               yStart: item.position[1] - halfH,
               yEnd: item.position[1] + halfH,
             });
@@ -86,17 +89,20 @@ export class SpatialGridManager {
       ) {
         // Remove old placement and re-insert
         this.getWallGrid(levelId).removeByItemId(item.id);
-        if (item.wallId && item.wallT !== undefined) {
-          const wallLength = this.getWallLength(item.wallId);
+        const wallId = item.parentId;
+        if (wallId && this.walls.has(wallId)) {
+          const wallLength = this.getWallLength(wallId);
           if (wallLength > 0) {
             const [width, height] = item.asset.dimensions;
             const halfW = width / wallLength / 2;
             const halfH = height / 2;
+            // Calculate t from local X position (position[0] is distance along wall)
+            const t = item.position[0] / wallLength;
             this.getWallGrid(levelId).insert({
               itemId: item.id,
-              wallId: item.wallId,
-              tStart: item.wallT - halfW,
-              tEnd: item.wallT + halfW,
+              wallId: wallId,
+              tStart: t - halfW,
+              tEnd: t + halfW,
               yStart: item.position[1] - halfH,
               yEnd: item.position[1] + halfH,
             });

packages/core/src/hooks/spatial-grid/spatial-grid-sync.ts

@@ -45,13 +45,14 @@ export function initSpatialGridSync() {
       }
     }
 
-    // Detect updated nodes (only items with position/rotation changes)
+    // Detect updated nodes (items with position/rotation/parentId changes)
     for (const [id, node] of Object.entries(state.nodes)) {
       const prev = prevState.nodes[id as AnyNode["id"]];
       if (prev && node.type === "item" && prev.type === "item") {
         if (
           !arraysEqual(node.position, prev.position) ||
-          !arraysEqual(node.rotation, prev.rotation)
+          !arraysEqual(node.rotation, prev.rotation) ||
+          node.parentId !== prev.parentId
         ) {
           const levelId = resolveLevelId(node, state.nodes);
           spatialGridManager.handleNodeUpdated(node, levelId);

packages/core/src/hooks/spatial-grid/use-spatial-query.ts

@@ -1,6 +1,6 @@
 import { useCallback } from "react";
-import { spatialGridManager } from "./spatial-grid-manager";
 import { LevelNode, WallNode } from "../../schema";
+import { spatialGridManager } from "./spatial-grid-manager";
 
 export function useSpatialQuery() {
   const canPlaceOnFloor = useCallback(

packages/core/src/hooks/spatial-grid/wall-spatial-grid.ts

@@ -64,7 +64,6 @@ export class WallSpatialGrid {
     this.itemToWall.delete(itemId);
   }
 
-  // The missing method!
   removeByItemId(itemId: string) {
     const wallId = this.itemToWall.get(itemId);
     if (wallId) {

packages/core/src/store/use-scene.ts

@@ -69,24 +69,28 @@ const useScene = create<SceneState>()(
           start: [0, 0],
           end: [5, 0],
           children: [],
+          parentId: level0.id,
         });
 
         const wall1 = WallNode.parse({
           start: [0, 0],
           end: [0, 5],
           children: [],
+          parentId: level0.id,
         });
 
         const wall2 = WallNode.parse({
           start: [5, 5],
           end: [0, 5],
           children: [],
+          parentId: level0.id,
         });
 
         const wall3 = WallNode.parse({
           start: [5, 5],
           end: [5, 0],
           children: [],
+          parentId: level0.id,
         });
 
         const window1 = ItemNode.parse({
@@ -165,7 +169,6 @@ const useScene = create<SceneState>()(
   ),
 );
 
-useScene.getState().loadScene();
 export default useScene;
 
 // Subscribe to the temporal store (Undo/Redo events)