zone editor

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

@@ -1,6 +1,8 @@
 import useEditor, { type Phase, type Tool } from "@/store/use-editor";
+import { useViewer } from "@pascal-app/viewer";
 import { ItemTool } from "./item/item-tool";
 import { WallTool } from "./wall/wall-tool";
+import { ZoneBoundaryEditor } from "./zone/zone-boundary-editor";
 import { ZoneTool } from "./zone/zone-tool";
 
 const tools: Record<Phase, Partial<Record<Tool, React.FC>>> = {
@@ -19,10 +21,21 @@ export const ToolManager: React.FC = () => {
   const phase = useEditor((state) => state.phase);
   const mode = useEditor((state) => state.mode);
   const tool = useEditor((state) => state.tool);
+  const selectedZoneId = useViewer((state) => state.selection.zoneId);
 
-  if (mode !== "build" || tool === null) return null;
+  // Show zone boundary editor when in structure/select mode with a zone selected
+  const showZoneBoundaryEditor =
+    phase === "structure" && mode === "select" && selectedZoneId !== null;
 
-  const Component = tools[phase]?.[tool];
+  // Show build tools when in build mode
+  const showBuildTool = mode === "build" && tool !== null;
 
-  return Component ? <Component /> : null;
+  const BuildToolComponent = showBuildTool ? tools[phase]?.[tool] : null;
+
+  return (
+    <>
+      {showZoneBoundaryEditor && <ZoneBoundaryEditor />}
+      {BuildToolComponent && <BuildToolComponent />}
+    </>
+  );
 };