@jkwd/inbase 0.1.11 → 0.1.13

package/README.md

@@ -53,7 +53,7 @@ Sessions start in the map: click **Setup LLM session**, type an **initial instru
 
 A normal chat request does not open a session. Use `/inbase` after Setup LLM session, or `/skipinbase [request]` to work outside the map. `/inbase` starts the session immediately; `wait-for-blueprint` only reads the optional blueprint.
 
-If several sessions are open, only one session window is shown at a time. Switch tabs so the focused session is the one `/inbase` connects to.
+If several sessions are open, `/inbase` attaches the newest session that is still waiting. Sessions that already have an LLM are skipped, and the map window does not need to be focused.
 
 Turn on **Make LLM look where I look** if the agent should prefer the island you are standing on and the blocks you are facing. With **Step by step** on, click **Create proposal** to start a step, then **Accept proposal** when the patch is ready. With it off, the LLM implements the full plan; you can still walk Previous/Next over the diffs, then **Accept proposal**. Send an alternative instruction from the HUD to revise the remaining plan, or **Stop** to end the session.
 

package/apps/explorer/scripts/session-store.d.ts

@@ -130,6 +130,8 @@ export function setInitialInstruction(
   instruction: string | null | undefined,
 ): DiffManifest
 export function readAttachedSession(dataDir: string): string | null
+export function listAttachQueue(dataDir: string): string[]
+export function nextAttachSessionId(dataDir: string): string | null
 export type SessionBlueprint = {
   enabled: boolean
   sent: boolean

package/apps/explorer/scripts/session-store.mjs

@@ -341,6 +341,74 @@ export function focusSession(dataDir, sessionId) {
   return safeId
 }
 
+function attachQueueFile(dataDir) {
+  return path.join(dataDir, 'attach-queue.json')
+}
+
+function readStoredAttachQueue(dataDir) {
+  const value = readJson(attachQueueFile(dataDir), null)
+  const ids = Array.isArray(value?.sessionIds) ? value.sessionIds : []
+  const result = []
+  const seen = new Set()
+  for (const id of ids) {
+    try {
+      const safeId = assertSessionId(id)
+      if (seen.has(safeId)) continue
+      seen.add(safeId)
+      result.push(safeId)
+    } catch {
+      // Skip invalid ids.
+    }
+  }
+  return result
+}
+
+function writeAttachQueue(dataDir, sessionIds) {
+  atomicWrite(
+    attachQueueFile(dataDir),
+    `${JSON.stringify({ sessionIds }, null, 2)}\n`,
+  )
+}
+
+function sessionIsWaitingToAttach(manifest) {
+  return Boolean(manifest?.awaitingAttach)
+}
+
+export function listAttachQueue(dataDir) {
+  const recorded = readStoredAttachQueue(dataDir)
+  const waiting = new Set()
+  for (const sessionId of listOpenSessionIds(dataDir)) {
+    if (sessionIsWaitingToAttach(readManifest(dataDir, sessionId))) {
+      waiting.add(sessionId)
+    }
+  }
+  const queued = recorded.filter((sessionId) => waiting.has(sessionId))
+  const queuedSet = new Set(queued)
+  const missing = []
+  for (const sessionId of listOpenSessionIds(dataDir)) {
+    if (waiting.has(sessionId) && !queuedSet.has(sessionId)) {
+      missing.push(sessionId)
+    }
+  }
+  missing.reverse()
+  const next = [...queued, ...missing]
+  const unchanged =
+    next.length === recorded.length &&
+    next.every((sessionId, index) => sessionId === recorded[index])
+  if (!unchanged) writeAttachQueue(dataDir, next)
+  return next
+}
+
+export function nextAttachSessionId(dataDir) {
+  return listAttachQueue(dataDir)[0] ?? null
+}
+
+function enqueueAttachSession(dataDir, sessionId) {
+  const safeId = assertSessionId(sessionId)
+  const rest = listAttachQueue(dataDir).filter((id) => id !== safeId)
+  writeAttachQueue(dataDir, [safeId, ...rest])
+}
+
 function sessionAllowsPlacement(manifest) {
   return (
     manifest.phase !== 'blueprint_ask' &&
@@ -912,6 +980,7 @@ export function setupSession(dataDir, input = {}) {
     sent: false,
   })
   focusSession(dataDir, sessionId)
+  enqueueAttachSession(dataDir, sessionId)
   return manifest
 }
 
@@ -952,10 +1021,10 @@ export function readAttachedSession(dataDir) {
 export function attachSession(dataDir, sessionId) {
   const safeId = sessionId
     ? assertSessionId(sessionId)
-    : readActiveSession(dataDir)
+    : nextAttachSessionId(dataDir)
   if (!safeId) {
     throw new Error(
-      'No visualizer session is focused. Click Setup LLM session in the map, then /inbase.',
+      'No visualizer session is waiting to attach. Click Setup LLM session in the map, then /inbase.',
     )
   }
   const manifest = requireManifest(
@@ -966,14 +1035,6 @@ export function attachSession(dataDir, sessionId) {
   if (isTerminalSession(manifest)) {
     throw sessionStoppedError(safeId)
   }
-  const attached = readAttachedSession(dataDir)
-  if (attached && attached !== safeId) {
-    const other = readManifest(dataDir, attached)
-    const label = resolvedSessionName(other) || attached
-    throw new Error(
-      `An LLM is already attached to ${label}. Stop that session before attaching another.`,
-    )
-  }
   focusSession(dataDir, safeId)
   touchSessionConnection(dataDir, safeId)
   recordSessionAck(dataDir, safeId, 'attached', resolvedSessionName(manifest) || safeId)
@@ -1435,6 +1496,7 @@ export function clearDiffSessions(dataDir, targetRoot = null) {
   }
   writeActiveSession(dataDir, null)
   writeBlueprintSession(dataDir, null)
+  writeAttachQueue(dataDir, [])
 
   const root = diffSessionsRoot(dataDir)
   fs.mkdirSync(root, { recursive: true })

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,
@@ -152,6 +156,9 @@ function Explorer({
 }) {
   const [intents, setIntents] = useState<AgentIntent[]>([])
   const [focusedSessionId, setFocusedSessionId] = useState<string | null>(null)
+  const [nextAttachSessionId, setNextAttachSessionId] = useState<string | null>(
+    null,
+  )
   const [wantBranchChanges, setWantBranchChanges] = useState(false)
   const [branchChanges, setBranchChanges] = useState(emptyBranchChanges)
   const intent =
@@ -222,7 +229,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 +303,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 +735,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 +750,10 @@ function Explorer({
           },
         ]
       })
+      if (placedId) {
+        setSelectedFolder(placedId)
+        setSelectedId(null)
+      }
       document.exitPointerLock()
     },
     [canPlace],
@@ -772,14 +788,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 +1044,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
@@ -1156,6 +1185,8 @@ function Explorer({
     const poll = async () => {
       try {
         const bundle = await fetchAgentIntents()
+        if (cancelled) return
+        setNextAttachSessionId(bundle.nextAttachSessionId)
         const merged: AgentIntent[] = []
         for (const next of bundle.intents) {
           const sessionId = next.sessionId
@@ -1273,6 +1304,7 @@ function Explorer({
             namingIslandId={namingIslandId}
             onPlaceBlock={canPlace ? placeBlock : undefined}
             onPlaceIsland={canPlace ? placeIsland : undefined}
+            onBlueprintMenu={canPlace ? setMapMenu : undefined}
             onCommitName={commitBlockName}
             onCancelName={cancelBlockName}
             userCreatedBlocks={userBlocks}
@@ -1301,6 +1333,7 @@ function Explorer({
         intent={intent}
         intents={intents}
         focusedSessionId={focusedSessionId}
+        nextAttachSessionId={nextAttachSessionId}
         onFocusSession={focusSessionPanel}
         onSetupSession={setupLlmSession}
         onWorkflowAction={runWorkflowAction}
@@ -1346,6 +1379,12 @@ function Explorer({
         createdIds={plannedCreates}
         deletedIds={deletedIds}
       />
+      <MapContextMenu
+        menu={mapMenu}
+        onAddFile={placeBlockOnFolder}
+        onAddFolder={placeIslandOnFolder}
+        onClose={() => setMapMenu(null)}
+      />
     </>
   )
 }

package/apps/explorer/src/agentIntent.ts

@@ -164,9 +164,10 @@ function normalize(data: Partial<AgentIntent> | null | undefined): AgentIntent {
 export async function fetchAgentIntents(): Promise<AgentIntentBundle> {
   const query = new URLSearchParams({ t: String(Date.now()) })
   const response = await fetch(`/api/agent-intent?${query}`)
-  if (!response.ok) return { focusedSessionId: null, intents: [] }
+  if (!response.ok) return { focusedSessionId: null, nextAttachSessionId: null, intents: [] }
   const data = (await response.json()) as {
     focusedSessionId?: string | null
+    nextAttachSessionId?: string | null
     intents?: unknown
     sessionId?: string | null
   } & Partial<AgentIntent>
@@ -174,6 +175,10 @@ export async function fetchAgentIntents(): Promise<AgentIntentBundle> {
     return {
       focusedSessionId:
         typeof data.focusedSessionId === 'string' ? data.focusedSessionId : null,
+      nextAttachSessionId:
+        typeof data.nextAttachSessionId === 'string'
+          ? data.nextAttachSessionId
+          : null,
       intents: data.intents
         .map((intent) => normalize(intent as Partial<AgentIntent>))
         .filter((intent) => Boolean(intent.sessionId)),
@@ -182,6 +187,7 @@ export async function fetchAgentIntents(): Promise<AgentIntentBundle> {
   const intent = normalize(data)
   return {
     focusedSessionId: intent.sessionId,
+    nextAttachSessionId: intent.awaitingAttach ? intent.sessionId : null,
     intents: intent.sessionId ? [intent] : [],
   }
 }

package/apps/explorer/src/index.css

@@ -202,7 +202,18 @@ button {
   letter-spacing: 0.02em;
 }
 
+.map-folder-label-layer {
+  position: absolute;
+  inset: 0;
+  overflow: hidden;
+  pointer-events: none;
+  z-index: 80;
+}
+
 .map-folder-label {
+  position: absolute;
+  top: 0;
+  left: 0;
   display: grid;
   min-width: max-content;
   padding: 4px 7px;
@@ -213,6 +224,8 @@ button {
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
   text-align: center;
   white-space: nowrap;
+  visibility: hidden;
+  will-change: transform;
 }
 
 .map-folder-name {
@@ -561,14 +574,38 @@ button {
 }
 
 .hud-session-tab {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 7px;
   flex: 1 1 0;
   min-width: 0;
   overflow: hidden;
-  text-overflow: ellipsis;
   white-space: nowrap;
   font-size: 13px;
 }
 
+.hud-session-tab-label {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.hud-session-tab[data-attached='true'] {
+  border-color: #6ee7b7;
+  color: #b6f3d6;
+}
+
+.hud-session-tab[data-attached='true'] .hud-attach-dot {
+  background: #6ee7b7;
+  box-shadow: 0 0 8px #6ee7b7;
+}
+
+.hud-session-tab[data-attached='false'] .hud-attach-dot {
+  background: #6b7280;
+  box-shadow: none;
+}
+
 .hud-left-stack .hud-panel-planned {
   position: relative;
   top: auto;
@@ -593,6 +630,14 @@ button {
   box-shadow: 0 0 0 1px #9ad8ff;
 }
 
+.hud-left-stack .hud-panel-planned[data-attached='true'] {
+  box-shadow: 0 0 0 1px #6ee7b7;
+}
+
+.hud-left-stack .hud-panel-planned[data-attached='true'][data-focused='true'] {
+  box-shadow: 0 0 0 1px #6ee7b7, 0 0 0 3px rgba(110, 231, 183, 0.22);
+}
+
 .hud-panel-body {
   min-height: 0;
   flex: 1 1 auto;
@@ -665,6 +710,65 @@ button {
   flex: 1 1 auto;
 }
 
+.hud-panel-chrome-title-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  min-width: 0;
+}
+
+.hud-attach-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  flex: none;
+  padding: 2px 7px 2px 6px;
+  border: 1px solid rgba(110, 231, 183, 0.45);
+  border-radius: 999px;
+  background: rgba(110, 231, 183, 0.12);
+  color: #b6f3d6;
+  font-size: 10px;
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.hud-attach-badge[data-attached='false'] {
+  border-color: rgba(255, 255, 255, 0.16);
+  background: rgba(255, 255, 255, 0.04);
+  color: #8b95a5;
+}
+
+.hud-attach-dot {
+  width: 7px;
+  height: 7px;
+  flex: none;
+  border-radius: 50%;
+  background: #6ee7b7;
+  box-shadow: 0 0 8px #6ee7b7;
+}
+
+.hud-attach-badge[data-attached='true'] .hud-attach-dot {
+  animation: hud-attach-pulse 1.6s ease infinite;
+}
+
+.hud-attach-badge[data-attached='false'] .hud-attach-dot {
+  background: #6b7280;
+  box-shadow: none;
+}
+
+@keyframes hud-attach-pulse {
+  0%,
+  100% {
+    opacity: 1;
+    box-shadow: 0 0 8px #6ee7b7;
+  }
+  50% {
+    opacity: 0.55;
+    box-shadow: 0 0 2px #6ee7b7;
+  }
+}
+
 .hud-panel[data-minimized='true'] {
   overflow: hidden;
   padding-bottom: 12px;
@@ -676,6 +780,7 @@ button {
 
 .hud-panel-chrome-title {
   min-width: 0;
+  flex: 1 1 auto;
   overflow: hidden;
   color: #b7c0ce;
   font-size: 11px;
@@ -1112,6 +1217,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/DistantFileBlocks.tsx

@@ -0,0 +1,44 @@
+import { useRef } from 'react'
+import { Instances, Instance } from '@react-three/drei'
+import { dimColor, fileColor } from '../theme'
+import type { FileNode, PlacedFile } from '../types'
+
+type DistantFile = {
+  file: FileNode
+  placed: PlacedFile
+  dimmed: boolean
+}
+
+export function DistantFileBlocks({
+  items,
+}: {
+  items: DistantFile[]
+}) {
+  const cap = useRef(2048)
+  if (items.length > cap.current) cap.current = items.length
+  if (items.length === 0) return null
+
+  return (
+    <Instances
+      limit={cap.current}
+      range={items.length}
+      frustumCulled
+      raycast={() => {}}
+    >
+      <boxGeometry args={[1, 1, 1]} />
+      <meshLambertMaterial />
+      {items.map(({ file, placed, dimmed }) => {
+        const color = file.userCreated ? '#7ec8e8' : fileColor(file.language)
+        return (
+          <Instance
+            key={file.id}
+            position={placed.position}
+            scale={placed.size}
+            color={dimmed ? dimColor(color, 0.32) : color}
+            userData={{ fileId: file.id }}
+          />
+        )
+      })}
+    </Instances>
+  )
+}

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

@@ -1,6 +1,5 @@
-import { Suspense, useRef } from 'react'
+import { memo, Suspense } from 'react'
 import { Billboard, Edges, Html, Text } from '@react-three/drei'
-import { useFrame, useThree } from '@react-three/fiber'
 import { CHANGE_HIGHLIGHT, CONFIG, dimColor, fileColor, FILE_SELECTION, MAP_SELECTION, type ChangeKind } from '../theme'
 import { NameInput } from '../ui/NameInput'
 import { MapSelectBorder } from './MapSelectBorder'
@@ -59,33 +58,27 @@ function MapChangeMark({
   depth: number
   height: number
 }) {
-  const camera = useThree((state) => state.camera)
-  const markRef = useRef<HTMLDivElement>(null)
-
-  useFrame(() => {
-    const el = markRef.current
-    if (!el) return
-    const zoom = 'zoom' in camera ? Number(camera.zoom) : 1
-    const px = Math.min(width, depth) * 0.78 * zoom
-    el.style.fontSize = `${Math.max(px, 1)}px`
-  })
-
+  const size = Math.min(width, depth) * 0.78
   return (
-    <Html
-      position={[0, height / 2 + 0.12, 0]}
-      center
-      occlude={false}
-      zIndexRange={[120, 100]}
-      style={{ pointerEvents: 'none' }}
-    >
-      <div ref={markRef} className="map-change-mark">
+    <Suspense fallback={null}>
+      <Text
+        position={[0, height / 2 + 0.12, 0]}
+        rotation={[-Math.PI / 2, 0, 0]}
+        fontSize={size}
+        color="#f4f7fb"
+        anchorX="center"
+        anchorY="middle"
+        outlineWidth={size * 0.09}
+        outlineColor="#11151c"
+        renderOrder={10}
+      >
         {mark}
-      </div>
-    </Html>
+      </Text>
+    </Suspense>
   )
 }
 
-export function FileBlock({
+export const FileBlock = memo(function FileBlock({
   file,
   placed,
   selected,
@@ -132,7 +125,7 @@ export function FileBlock({
             ? muted
             : color
 
-  const showLabels = !naming && !mapMode
+  const showLabels = !naming && !mapMode && labelVisible
 
   return (
     <group position={placed.position}>
@@ -216,17 +209,15 @@ export function FileBlock({
       {showLabels && (
         <Suspense fallback={null}>
           {previewLabels ? (
-            labelVisible && (
-              <Html
-                position={[0, height / 2 + 0.4, 0]}
-                center
-                occlude={false}
-                style={{ pointerEvents: 'none' }}
-                zIndexRange={[20, 0]}
-              >
-                <div className="thumbnail-block-label">{label}</div>
-              </Html>
-            )
+            <Html
+              position={[0, height / 2 + 0.4, 0]}
+              center
+              occlude={false}
+              style={{ pointerEvents: 'none' }}
+              zIndexRange={[20, 0]}
+            >
+              <div className="thumbnail-block-label">{label}</div>
+            </Html>
           ) : (
             <>
               <Billboard position={[0, height / 2 + (planned || highlight ? 0.55 : 0.38), 0]}>
@@ -272,4 +263,4 @@ export function FileBlock({
       )}
     </group>
   )
-}
+})

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

@@ -18,6 +18,7 @@ type FolderAreaProps = {
   mapMode?: boolean
   highlightKind?: ChangeKind | null
   previewLabels?: boolean
+  labelVisible?: boolean
 }
 
 export function FolderArea({
@@ -27,6 +28,7 @@ export function FolderArea({
   mapMode = false,
   highlightKind = null,
   previewLabels = false,
+  labelVisible = true,
 }: FolderAreaProps) {
   const added = Boolean(folder.added)
   const highlight = highlightKind ? CHANGE_HIGHLIGHT[highlightKind] : null
@@ -87,7 +89,7 @@ export function FolderArea({
         </mesh>
       )}
       <Suspense fallback={null}>
-        {!naming && previewLabels && (
+        {!naming && previewLabels && labelVisible && (
           <Html
             position={[0, 1.35, -folder.depth / 2 + 1.6]}
             center
@@ -98,7 +100,7 @@ export function FolderArea({
             <div className="thumbnail-folder-label">{label}</div>
           </Html>
         )}
-        {!naming && !previewLabels && !mapMode && (
+        {!naming && !previewLabels && !mapMode && labelVisible && (
           <Text
             position={[0, 0.05, -folder.depth / 2 + 1.6]}
             rotation={[-Math.PI / 2, 0, 0]}