@jkwd/inbase 0.1.11 → 0.1.12

package/apps/explorer/src/App.tsx

@@ -14,6 +14,10 @@ import {
 } from './layout'
 import { World } from './scene/World'
 import { HUD } from './ui/HUD'
+import {
+  MapContextMenu,
+  type MapContextMenuState,
+} from './ui/MapContextMenu'
 import {
   fetchUserContext,
   persistFollowLook,
@@ -222,7 +226,9 @@ function Explorer({
     ],
   )
   const layout = useMemo(() => {
-    const world = layoutWorld(previewGraph)
+    const world = layoutWorld(
+      withUserCreatedGraph(previewGraph, [], userIslands),
+    )
     if (previewing) markCreatedFolders(world, changeSet.createFolders ?? [])
     return withUserCreatedLayout(world, userBlocks, userIslands)
   }, [
@@ -294,6 +300,7 @@ function Explorer({
   const [selectedId, setSelectedId] = useState<string | null>(null)
   const [selectedTick, setSelectedTick] = useState(0)
   const [selectedFolder, setSelectedFolder] = useState<string | null>(null)
+  const [mapMenu, setMapMenu] = useState<MapContextMenuState | null>(null)
   const [aimedRelation, setAimedRelation] = useState<AimedRelation | null>(null)
   const [aimedFileId, setAimedFileId] = useState<string | null>(null)
   const [inspectTick, setInspectTick] = useState(0)
@@ -725,12 +732,14 @@ function Explorer({
   const placeIsland = useCallback(
     (parent: string) => {
       if (!canPlace) return
+      let placedId: string | null = null
       setUserIslands((current) => {
         if (current.some((island) => island.naming)) return current
+        placedId = `draft:${Date.now()}`
         return [
           ...current,
           {
-            id: `draft:${Date.now()}`,
+            id: placedId,
             name: '',
             path: '',
             parent,
@@ -738,6 +747,10 @@ function Explorer({
           },
         ]
       })
+      if (placedId) {
+        setSelectedFolder(placedId)
+        setSelectedId(null)
+      }
       document.exitPointerLock()
     },
     [canPlace],
@@ -772,14 +785,23 @@ function Explorer({
       )
       setUserIslands(next)
       persistBlueprint(userBlocks, next)
+      setSelectedFolder(resolved.path)
+      setSelectedId(null)
       return true
     },
     [graph.folders, persistBlueprint, userBlocks, userIslands],
   )
 
-  const cancelIslandName = useCallback((id: string) => {
-    setUserIslands((current) => current.filter((island) => island.id !== id))
-  }, [])
+  const cancelIslandName = useCallback(
+    (id: string) => {
+      const draft = userIslands.find((island) => island.id === id)
+      setUserIslands((current) => current.filter((island) => island.id !== id))
+      setSelectedFolder((selected) =>
+        selected === id ? draft?.parent ?? null : selected,
+      )
+    },
+    [userIslands],
+  )
 
   const deleteSelectedCreatedBlock = useCallback(() => {
     if (!canPlace || !selectedId) return false
@@ -1019,6 +1041,10 @@ function Explorer({
     return () => window.removeEventListener('keydown', onKey)
   }, [cancelBlockName, cancelIslandName, namingId, namingIslandId])
 
+  useEffect(() => {
+    if (mode !== 'map' || naming) setMapMenu(null)
+  }, [mode, naming])
+
   useEffect(() => {
     const onKey = (event: KeyboardEvent) => {
       if (event.repeat || event.code !== 'Backspace') return
@@ -1273,6 +1299,7 @@ function Explorer({
             namingIslandId={namingIslandId}
             onPlaceBlock={canPlace ? placeBlock : undefined}
             onPlaceIsland={canPlace ? placeIsland : undefined}
+            onBlueprintMenu={canPlace ? setMapMenu : undefined}
             onCommitName={commitBlockName}
             onCancelName={cancelBlockName}
             userCreatedBlocks={userBlocks}
@@ -1346,6 +1373,12 @@ function Explorer({
         createdIds={plannedCreates}
         deletedIds={deletedIds}
       />
+      <MapContextMenu
+        menu={mapMenu}
+        onAddFile={placeBlockOnFolder}
+        onAddFolder={placeIslandOnFolder}
+        onClose={() => setMapMenu(null)}
+      />
     </>
   )
 }

package/apps/explorer/src/index.css

@@ -1112,6 +1112,35 @@ button {
   margin-top: 14px;
 }
 
+.map-context-menu {
+  position: fixed;
+  z-index: 40;
+  display: flex;
+  min-width: 168px;
+  flex-direction: column;
+  gap: 2px;
+  padding: 4px;
+  color: #e7ebf2;
+  background: rgba(25, 28, 34, 0.96);
+  border: 1px solid var(--vc-border);
+  pointer-events: auto;
+}
+
+.map-context-menu button {
+  cursor: pointer;
+  padding: 8px 10px;
+  color: inherit;
+  text-align: left;
+  background: transparent;
+  border: 0;
+}
+
+.map-context-menu button:hover,
+.map-context-menu button:focus-visible {
+  background: var(--vc-surface);
+  outline: none;
+}
+
 .hud-decide {
   display: flex;
   flex-wrap: wrap;

package/apps/explorer/src/scene/MapView.tsx

@@ -6,6 +6,12 @@ import { folderAt, worldBounds } from '../layout'
 import type { ChangeKind } from '../theme'
 import type { WorldLayout } from '../types'
 
+export type MapBlueprintMenu = {
+  x: number
+  y: number
+  folder: string
+}
+
 type MapViewProps = {
   layout: WorldLayout
   enabled: boolean
@@ -16,6 +22,7 @@ type MapViewProps = {
   onSelect: (fileId: string | null) => void
   onSelectFolder: (folderPath: string | null) => void
   onTravelTo: (fromId: string, toId: string) => void
+  onBlueprintMenu?: (menu: MapBlueprintMenu) => void
 }
 
 export function MapView({
@@ -28,6 +35,7 @@ export function MapView({
   onSelect,
   onSelectFolder,
   onTravelTo,
+  onBlueprintMenu,
 }: MapViewProps) {
   const size = useThree((state) => state.size)
   const { camera, gl, invalidate, scene } = useThree()
@@ -172,7 +180,28 @@ export function MapView({
     }
 
     const onContextMenu = (event: MouseEvent) => {
-      if (event.ctrlKey) event.preventDefault()
+      if (event.ctrlKey) {
+        event.preventDefault()
+        return
+      }
+      if (!onBlueprintMenu) return
+      event.preventDefault()
+      const pick = pickAt(event.clientX, event.clientY)
+      if (!pick) return
+      const hit = new THREE.Vector3()
+      const plane = new THREE.Plane(new THREE.Vector3(0, 1, 0), 0)
+      if (!pick.raycaster.ray.intersectPlane(plane, hit)) return
+      const folder =
+        folderAt(hit.x, hit.z, layout) ??
+        (selectedFolder ? layout.folders[selectedFolder] : undefined) ??
+        layout.folders['.']
+      if (!folder) return
+      onSelectFolder(folder.path)
+      onBlueprintMenu({
+        x: event.clientX,
+        y: event.clientY,
+        folder: folder.path,
+      })
     }
 
     const ground = new THREE.Plane(new THREE.Vector3(0, 1, 0), 0)
@@ -250,10 +279,12 @@ export function MapView({
     invalidate,
     layout,
     onLand,
+    onBlueprintMenu,
     onSelect,
     onSelectFolder,
     onTravelTo,
     scene,
+    selectedFolder,
   ])
 
   return (

package/apps/explorer/src/scene/World.tsx

@@ -3,7 +3,7 @@ import { FileBlock } from './FileBlock'
 import { Bridge } from './Bridge'
 import { RelationLines } from './RelationLines'
 import { Player } from './Player'
-import { MapView } from './MapView'
+import { MapView, type MapBlueprintMenu } from './MapView'
 import { SelectionController } from './SelectionController'
 import { UserContextTracker } from './UserContextTracker'
 import { BlockPlacer } from './BlockPlacer'
@@ -60,6 +60,7 @@ type WorldProps = {
   namingId?: string | null
   onPlaceBlock?: (spot: { x: number; z: number; folder: string }) => void
   onPlaceIsland?: (parent: string) => void
+  onBlueprintMenu?: (menu: MapBlueprintMenu) => void
   onCommitName?: (id: string, name: string) => boolean
   onCancelName?: (id: string) => void
   userCreatedBlocks?: UserCreatedBlock[]
@@ -100,6 +101,7 @@ export function World({
   namingIslandId = null,
   onPlaceBlock,
   onPlaceIsland,
+  onBlueprintMenu,
   onCommitName,
   onCancelName,
   userCreatedBlocks = [],
@@ -171,6 +173,9 @@ export function World({
         onSelect={onSelect}
         onSelectFolder={onSelectFolder}
         onTravelTo={onTravelTo}
+        onBlueprintMenu={
+          mapping && !placing && onBlueprintMenu ? onBlueprintMenu : undefined
+        }
       />
 
       {Object.values(viewLayout.folders).map((folder) => (

package/apps/explorer/src/ui/HUD.tsx

@@ -334,7 +334,7 @@ function HandshakeSetup({
         </h2>
         <p>
           Press <kbd>Space</kbd> for a file and <kbd>B</kbd> for an island.
-          Optional.
+          On the map, right-click to add a file or folder. Optional.
         </p>
       </section>
       <section className="hud-setup-section">
@@ -373,7 +373,7 @@ function sessionLiveStatus(intent: AgentIntent) {
     return { text: 'LLM wait timed out', busy: false }
   }
   if (intent.awaitingAttach) {
-    return { text: 'Waiting for /inbase in Cursor', busy: true }
+    return { text: 'Waiting for /inbase in Cursor', busy: false }
   }
   if (kind === 'execute') {
     return { text: `LLM received ${detail}`, busy: true }
@@ -606,11 +606,13 @@ function SessionPanel({
       />
       {!minimized && (
         <>
-          <LiveStatus
-            intent={intent}
-            showStop={showConnectedProgress || working}
-            onStop={() => act('stop')}
-          />
+          {!intent.awaitingAttach && (
+            <LiveStatus
+              intent={intent}
+              showStop={showConnectedProgress || working}
+              onStop={() => act('stop')}
+            />
+          )}
           <label className="hud-mode-switch">
             <span>Step by step</span>
             <button
@@ -700,8 +702,9 @@ function SessionPanel({
             <>
               {canPlace && !intent.working && (
                 <p>
-                  <kbd>Space</kbd> places a file, <kbd>B</kbd> an island for
-                  this session.
+                  On the map, right-click to add a file or folder.{' '}
+                  <kbd>Space</kbd> places a file, <kbd>B</kbd> an island while
+                  walking.
                 </p>
               )}
               {intent.steps?.length > 0 && (
@@ -1251,8 +1254,8 @@ function explorerInstructions({
               { id: 'select-island', keys: ['Click'], label: 'Select an island' },
               {
                 id: 'add-file-folder',
-                keys: [],
-                label: 'Add file / Add folder in panel',
+                keys: ['Right-click'],
+                label: 'Add file or folder',
               },
             ]
           : []),

package/apps/explorer/src/ui/MapContextMenu.tsx

@@ -0,0 +1,89 @@
+import { useEffect } from 'react'
+import { createPortal } from 'react-dom'
+
+export type MapContextMenuState = {
+  x: number
+  y: number
+  folder: string
+}
+
+type MapContextMenuProps = {
+  menu: MapContextMenuState | null
+  onAddFile: (folder: string) => void
+  onAddFolder: (folder: string) => void
+  onClose: () => void
+}
+
+export function MapContextMenu({
+  menu,
+  onAddFile,
+  onAddFolder,
+  onClose,
+}: MapContextMenuProps) {
+  useEffect(() => {
+    if (!menu) return
+    const onKey = (event: KeyboardEvent) => {
+      if (event.code !== 'Escape') return
+      event.preventDefault()
+      onClose()
+    }
+    const onPointerDown = (event: PointerEvent) => {
+      const target = event.target
+      if (target instanceof Element && target.closest('.map-context-menu')) {
+        return
+      }
+      onClose()
+    }
+    window.addEventListener('keydown', onKey)
+    window.addEventListener('pointerdown', onPointerDown, true)
+    return () => {
+      window.removeEventListener('keydown', onKey)
+      window.removeEventListener('pointerdown', onPointerDown, true)
+    }
+  }, [menu, onClose])
+
+  if (!menu) return null
+
+  const pad = 8
+  const width = 176
+  const height = 84
+  const left = Math.min(
+    Math.max(pad, menu.x),
+    window.innerWidth - width - pad,
+  )
+  const top = Math.min(
+    Math.max(pad, menu.y),
+    window.innerHeight - height - pad,
+  )
+
+  return createPortal(
+    <div
+      className="map-context-menu"
+      role="menu"
+      style={{ left, top }}
+      onContextMenu={(event) => event.preventDefault()}
+    >
+      <button
+        type="button"
+        role="menuitem"
+        onClick={() => {
+          onAddFile(menu.folder)
+          onClose()
+        }}
+      >
+        Add file
+      </button>
+      <button
+        type="button"
+        role="menuitem"
+        onClick={() => {
+          onAddFolder(menu.folder)
+          onClose()
+        }}
+      >
+        Add folder
+      </button>
+    </div>,
+    document.body,
+  )
+}

package/apps/explorer/src/userCreated.ts

@@ -5,6 +5,7 @@ import type {
   FileNode,
   PatchImportAddition,
   PatchSymbolAddition,
+  PlacedFolder,
   UserCreatedBlock,
   UserCreatedIsland,
   WorldLayout,
@@ -193,6 +194,54 @@ export function withUserCreatedGraph(
   }
 }
 
+function placedFolderParent(
+  folder: PlacedFolder,
+  islands: UserCreatedIsland[],
+) {
+  const created = islands.find((item) => islandKey(item) === folder.path)
+  if (created) return created.parent
+  return folderParent(folder.path)
+}
+
+function expandParentsToChildren(
+  folders: Record<string, PlacedFolder>,
+  islands: UserCreatedIsland[],
+) {
+  const parentPaths = new Set<string>()
+  for (const island of islands) {
+    let current: string | null = island.parent
+    while (current) {
+      parentPaths.add(current)
+      current = folderParent(current)
+    }
+  }
+  const ordered = [...parentPaths].sort(
+    (left, right) =>
+      right.split('/').filter(Boolean).length -
+      left.split('/').filter(Boolean).length,
+  )
+  for (const parentPath of ordered) {
+    const parent = folders[parentPath]
+    if (!parent) continue
+    const children = Object.values(folders).filter(
+      (folder) =>
+        folder.path !== parentPath &&
+        placedFolderParent(folder, islands) === parentPath,
+    )
+    if (children.length === 0) continue
+    let extent = parent.width / 2
+    for (const child of children) {
+      extent = Math.max(
+        extent,
+        Math.abs(child.x - child.width / 2 - parent.x),
+        Math.abs(child.x + child.width / 2 - parent.x),
+      )
+    }
+    const width = extent * 2
+    if (width > parent.width) folders[parentPath] = { ...parent, width }
+  }
+}
+
 function overlayIslands(
   layout: WorldLayout,
   islands: UserCreatedIsland[],
@@ -245,6 +294,7 @@ function overlayIslands(
     })
   }
 
+  expandParentsToChildren(folders, islands)
   return { ...layout, folders, bridges }
 }
 

package/bin/session.mjs

@@ -30,15 +30,31 @@ function printAck(kind, detail) {
   console.log(`VISUAL_CODER_ACK ${kind}: ${detail}`)
 }
 
-function createManifestGate(manifestPath) {
+export function createManifestGate(manifestPath, watch = fs.watch) {
   const dir = path.dirname(manifestPath)
   let wake = () => {}
   let watcher = null
+
+  const dropWatcher = () => {
+    try {
+      watcher?.close()
+    } catch {
+      // Already closed after an error, or never opened.
+    }
+    watcher = null
+  }
+
   try {
-    watcher = fs.watch(dir, () => wake())
+    watcher = watch(dir, () => wake())
+    watcher?.on?.('error', () => {
+      // EMFILE and sandbox limits must not crash wait-for-approval. Poll instead.
+      dropWatcher()
+      wake()
+    })
   } catch {
-    watcher = null
+    dropWatcher()
   }
+
   return {
     wait(ms) {
       return new Promise((resolve) => {
@@ -50,7 +66,7 @@ function createManifestGate(manifestPath) {
       })
     },
     close() {
-      watcher?.close()
+      dropWatcher()
     },
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jkwd/inbase",
-  "version": "0.1.11",
+  "version": "0.1.12",
   "description": "A first-person 3D map of a codebase, with a visual coding workflow for Cursor.",
   "license": "MIT",
   "author": "Joris Kuijper",

package/skill/inbase/SKILL.md

@@ -144,11 +144,13 @@ npx inbase report-plan \
 npx inbase wait-for-approval --session "<session-id>"
 ```
 
-   Do not edit project files until this prints `VISUAL_CODER_ACK execute` /
-   `VISUAL_CODER_EXECUTE`. If Step by step is off, this returns immediately for
-   each remaining step. First reply in chat acknowledging the ack, then re-read
-   this session's `blueprint.json`; the user can place files and islands on any
-   step.
+   Describe this tool call as `inbase wait-for-approval`, not "waiting for the
+   user to invoke". The command keeps running until they invoke; when it
+   returns, they already did. Do not edit project files until this prints
+   `VISUAL_CODER_ACK execute` / `VISUAL_CODER_EXECUTE`. If Step by step is off,
+   this returns immediately for each remaining step. First reply in chat
+   acknowledging the ack, then re-read this session's `blueprint.json`; the
+   user can place files and islands on any step.
 9. Implement only the invoked step by editing the live project files (Write,
    StrReplace, Delete). Paths are the same ids as `codebase.json`. Then record
    the step — Inbase diffs the working tree against the snapshot taken at