level items

apps/editor/components/tools/item/item-tool.tsx

@@ -16,6 +16,7 @@ import { is } from "@react-three/fiber/dist/declarations/src/core/utils";
 import { use, useEffect, useRef } from "react";
 import { BoxGeometry, Line, Mesh, MeshStandardMaterial, Vector3 } from "three";
 import { randInt } from "three/src/math/MathUtils.js";
+import { resolveLevelId } from "../../../../../packages/core/src/hooks/spatial-grid/spatial-grid-sync";
 
 export const ItemTool: React.FC = () => {
   const cursorRef = useRef<Mesh>(null!);
@@ -131,6 +132,12 @@ export const ItemTool: React.FC = () => {
     };
 
     const onWallEnter = (event: WallEvent) => {
+      if (
+        useViewer.getState().currentLevelId !==
+        resolveLevelId(event.node, useScene.getState().nodes)
+      ) {
+        return;
+      }
       if (
         draftItem.current?.asset.attachTo === "wall" ||
         draftItem.current?.asset.attachTo === "wall-side"
@@ -157,6 +164,7 @@ export const ItemTool: React.FC = () => {
     };
 
     const onWallLeave = (event: WallEvent) => {
+      if (!isOnWall.current) return;
       isOnWall.current = false;
       currentWallId = null;
       event.stopPropagation();

apps/editor/store/use-editor.tsx

@@ -95,7 +95,7 @@ const useEditor = create<EditorState>()((set, get) => ({
             }
           }
         }
-        viewer.setLevelMode("exploded"); // Better for structure editing
+        viewer.setLevelMode("stacked"); // Better for structure editing
         break;
 
       case "furnish":

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

@@ -2,7 +2,10 @@ import { AnyNode } from "../../schema";
 import useScene from "../../store/use-scene";
 import { spatialGridManager } from "./spatial-grid-manager";
 
-function resolveLevelId(node: AnyNode, nodes: Record<string, AnyNode>): string {
+export function resolveLevelId(
+  node: AnyNode,
+  nodes: Record<string, AnyNode>,
+): string {
   // If the node itself is a level
   if (node.type === "level") return node.id;
 

packages/viewer/src/store/use-viewer.ts

@@ -14,7 +14,7 @@ type ViewerState = {
 };
 
 const useViewer = create<ViewerState>()((set, get) => ({
-  levelMode: "exploded",
+  levelMode: "stacked",
   setLevelMode: (mode) => set({ levelMode: mode }),
   currentLevelId: null,
   setCurrentLevelId: (id) => set({ currentLevelId: id }),