@jkwd/inbase 0.1.18 → 0.1.20

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

@@ -1,5 +1,5 @@
 import { useEffect, useRef, useState, type ReactNode } from 'react'
-import { persistInitialInstruction } from '../agentIntent'
+import { persistAddContextFiles, persistInitialInstruction, persistRemoveContextFile } from '../agentIntent'
 import { NameInput } from './NameInput'
 import { SelectionThumbnail } from '../scene/SelectionThumbnail'
 import {
@@ -10,6 +10,8 @@ import {
   type AimedRelation,
   type BlueprintNote,
   type BlueprintNoteKind,
+  type BlueprintPointer,
+  type BlueprintPointerKind,
   type BranchChanges,
   type CodebaseGraph,
   type PatchImportAddition,
@@ -18,7 +20,8 @@ import {
   type WorldLayout,
   type WorkflowAction,
 } from '../types'
-import { findBlueprintNote } from '../userCreated'
+import { findBlueprintNote, findBlueprintPointer } from '../userCreated'
+import { EyeIcon } from './EyeIcon'
 import { beginKeyboardIsolation, shouldIgnoreShortcut } from '../keyboard'
 
 function reviewTitle(status: AgentIntentStatus) {
@@ -311,25 +314,43 @@ function BlueprintSymbolRow({
   className,
   hasNote,
   noteOpen,
+  pointed,
   canEdit,
   canRemove,
   onRemove,
   onOpenNote,
+  onTogglePoint,
 }: {
   name: string
   className?: string
   hasNote: boolean
   noteOpen?: boolean
+  pointed?: boolean
   canEdit: boolean
   canRemove?: boolean
   onRemove?: () => void
   onOpenNote: () => void
+  onTogglePoint?: () => void
 }) {
   return (
     <li>
       <span className={className}>{name}</span>
       {canEdit && (
         <div className="hud-item-actions">
+          {onTogglePoint && (
+            <button
+              className="hud-item-point"
+              type="button"
+              data-pointed={pointed ? 'true' : 'false'}
+              aria-label={
+                pointed ? `Stop pointing to ${name}` : `Point to ${name}`
+              }
+              aria-pressed={Boolean(pointed)}
+              onClick={onTogglePoint}
+            >
+              <EyeIcon size={13} />
+            </button>
+          )}
           <button
             className="hud-item-note"
             type="button"
@@ -450,6 +471,119 @@ function InitialInstructionField({
   )
 }
 
+function formatFileSize(bytes: number) {
+  if (bytes < 1024) return `${bytes} B`
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`
+}
+
+async function fileToBase64(file: File) {
+  const bytes = new Uint8Array(await file.arrayBuffer())
+  const chunk = 0x8000
+  let binary = ''
+  for (let offset = 0; offset < bytes.length; offset += chunk) {
+    binary += String.fromCharCode(...bytes.subarray(offset, offset + chunk))
+  }
+  return btoa(binary)
+}
+
+type ContextFileInfo = {
+  id: string
+  name: string
+  mimeType: string
+  size: number
+}
+
+function ContextFileDrop({
+  files,
+  busy,
+  error,
+  onAdd,
+  onRemove,
+}: {
+  files: ContextFileInfo[]
+  busy: boolean
+  error: string | null
+  onAdd: (files: File[]) => void
+  onRemove: (fileId: string) => void
+}) {
+  const inputRef = useRef<HTMLInputElement>(null)
+  const [over, setOver] = useState(false)
+
+  const takeFiles = (list: FileList | File[] | null) => {
+    if (!list || busy) return
+    const next = [...list].filter((file) => file.size > 0)
+    if (next.length > 0) onAdd(next)
+  }
+
+  return (
+    <div className="hud-context">
+      <button
+        className="hud-context-drop"
+        type="button"
+        data-over={over}
+        data-busy={busy}
+        disabled={busy}
+        aria-label="Attach files for the LLM"
+        onDragEnter={(event) => {
+          event.preventDefault()
+          if (event.dataTransfer.types.includes('Files')) setOver(true)
+        }}
+        onDragOver={(event) => {
+          event.preventDefault()
+          event.dataTransfer.dropEffect = 'copy'
+        }}
+        onDragLeave={(event) => {
+          if (event.currentTarget.contains(event.relatedTarget as Node)) return
+          setOver(false)
+        }}
+        onDrop={(event) => {
+          event.preventDefault()
+          event.stopPropagation()
+          setOver(false)
+          takeFiles(event.dataTransfer.files)
+        }}
+        onKeyDown={(event) => event.stopPropagation()}
+        onClick={() => inputRef.current?.click()}
+      >
+        <input
+          ref={inputRef}
+          type="file"
+          multiple
+          hidden
+          onChange={(event) => {
+            takeFiles(event.target.files)
+            event.target.value = ''
+          }}
+        />
+        {busy ? 'Attaching…' : 'Drop files or click to attach'}
+      </button>
+      {files.length > 0 && (
+        <ul className="hud-context-list">
+          {files.map((file) => (
+            <li key={file.id}>
+              <span className="hud-context-name" title={file.name}>
+                {file.name}
+              </span>
+              <span className="hud-context-size">{formatFileSize(file.size)}</span>
+              <button
+                className="hud-item-remove"
+                type="button"
+                aria-label={`Remove ${file.name}`}
+                disabled={busy}
+                onClick={() => onRemove(file.id)}
+              >
+                ×
+              </button>
+            </li>
+          ))}
+        </ul>
+      )}
+      {error ? <p className="hud-context-error">{error}</p> : null}
+    </div>
+  )
+}
+
 function blueprintIsDefined(intent: AgentIntent) {
   return (
     (intent.userCreatedBlocks?.length ?? 0) > 0 ||
@@ -457,31 +591,61 @@ function blueprintIsDefined(intent: AgentIntent) {
     (intent.blueprintFunctions?.length ?? 0) > 0 ||
     (intent.blueprintVariables?.length ?? 0) > 0 ||
     (intent.blueprintImports?.length ?? 0) > 0 ||
-    (intent.blueprintNotes?.length ?? 0) > 0
+    (intent.blueprintNotes?.length ?? 0) > 0 ||
+    (intent.blueprintPointers?.length ?? 0) > 0
   )
 }
 
 function HandshakeSetup({
   instruction,
   onInstructionChange,
+  contextFiles,
+  contextBusy,
+  contextError,
+  onAddContextFiles,
+  onRemoveContextFile,
   blueprintDefined,
   awaitingAttach,
   nextAttachLabel,
 }: {
   instruction: string
   onInstructionChange: (value: string) => void
+  contextFiles: ContextFileInfo[]
+  contextBusy: boolean
+  contextError: string | null
+  onAddContextFiles: (files: File[]) => void
+  onRemoveContextFile: (fileId: string) => void
   blueprintDefined: boolean
   awaitingAttach: boolean
   nextAttachLabel: string | null
 }) {
   return (
     <div className="hud-setup">
-      <section className="hud-setup-section">
+      <section
+        className="hud-setup-section"
+        onDragOver={(event) => {
+          if (event.dataTransfer.types.includes('Files')) event.preventDefault()
+        }}
+        onDrop={(event) => {
+          event.preventDefault()
+          const dropped = [...(event.dataTransfer.files ?? [])].filter(
+            (file) => file.size > 0,
+          )
+          if (dropped.length > 0) onAddContextFiles(dropped)
+        }}
+      >
         <h2 className="hud-setup-heading">Instructions</h2>
         <InitialInstructionField
           value={instruction}
           onChange={onInstructionChange}
         />
+        <ContextFileDrop
+          files={contextFiles}
+          busy={contextBusy}
+          error={contextError}
+          onAdd={onAddContextFiles}
+          onRemove={onRemoveContextFile}
+        />
       </section>
       <section className="hud-setup-section">
         <h2 className="hud-setup-heading">
@@ -538,6 +702,11 @@ function sessionLiveStatus(intent: AgentIntent) {
   if (intent.awaitingAttach) {
     return { text: 'Waiting for /inbase in Cursor', busy: false }
   }
+  if (intent.status === 'pending') {
+    return intent.listening
+      ? { text: 'LLM is listening — accept or send an instruction', busy: false }
+      : { text: 'Review this step', busy: false }
+  }
   if (kind === 'execute') {
     return { text: `LLM received ${detail}`, busy: true }
   }
@@ -566,11 +735,6 @@ function sessionLiveStatus(intent: AgentIntent) {
       ? { text: 'LLM is listening — run the next step', busy: false }
       : { text: 'Plan ready', busy: false }
   }
-  if (intent.status === 'pending') {
-    return intent.listening
-      ? { text: 'LLM is listening — accept or send an instruction', busy: false }
-      : { text: 'Review this step', busy: false }
-  }
   if (
     kind === 'attached' ||
     intent.status === 'blueprint' ||
@@ -649,14 +813,22 @@ function SessionPanel({
   const [initialInstruction, setInitialInstruction] = useState(
     () => intent.initialInstruction ?? '',
   )
+  const [contextFiles, setContextFiles] = useState<ContextFileInfo[]>(
+    () => intent.contextFiles ?? [],
+  )
+  const [contextBusy, setContextBusy] = useState(false)
+  const [contextError, setContextError] = useState<string | null>(null)
   const sessionId = intent.sessionId
-  const pending = intent.status === 'pending' && intent.isActiveDiff
+  const latestEntry = intent.isActiveDiff ? intent.chain.at(-1) : null
+  const pending =
+    latestEntry?.status === 'pending' ||
+    (intent.status === 'pending' && intent.isActiveDiff)
   const askingBlueprint = intent.status === 'blueprint_ask'
   const sendingBlueprint = intent.status === 'blueprint'
   const canPlace = Boolean(intent.creationMode)
   const preparing = intent.status === 'preparing'
-  const planReady = intent.status === 'planned'
   const working = intent.status === 'working' || intent.status === 'replanning'
+  const planReady = intent.status === 'planned' && !pending
   const previewing = intent.preview
   const chainIndex = intent.chainIndex ?? 0
   const previousDiff = intent.chain[chainIndex - 1]
@@ -665,10 +837,6 @@ function SessionPanel({
     intent.step && intent.steps?.length > 0
       ? `Step ${intent.step} of ${intent.steps.length}`
       : 'Patch'
-  const lastStep =
-    typeof intent.step === 'number' &&
-    intent.steps.length > 0 &&
-    intent.step >= intent.steps.length
   const stepByStep = intent.stepByStep !== false
   const addedFunctions = intent.addedFunctions ?? []
   const addedVariables = intent.addedVariables ?? []
@@ -679,25 +847,27 @@ function SessionPanel({
     intent.status === 'finished'
       ? intent.steps.map((step) => step.index)
       : intent.chain
-          .filter(
-            (entry) =>
-              entry.status === 'applied' || entry.status === 'extended',
-          )
+          .filter((entry) => entry.status === 'applied')
           .map((entry) => entry.step),
   )
   if (intent.status === 'approved' && typeof intent.step === 'number') {
     acceptedSteps.add(intent.step)
   }
-  const proposalStep =
-    pending && typeof intent.step === 'number' ? intent.step : null
+  const proposalStep = pending
+    ? (latestEntry?.status === 'pending' ? latestEntry.step : intent.step)
+    : null
   const processingStep =
     working && typeof intent.step === 'number' ? intent.step : null
   const invokeStep =
-    planReady && !working
+    planReady && !working && proposalStep === null
       ? (intent.steps.find((step) => !acceptedSteps.has(step.index)) ?? null)
       : null
   const canRunNext = stepByStep && Boolean(invokeStep)
   const canAcceptProposal = proposalStep !== null
+  const lastStep =
+    typeof proposalStep === 'number' &&
+    intent.steps.length > 0 &&
+    proposalStep >= intent.steps.length
   const panelDone =
     intent.status === 'finished' ||
     intent.status === 'approved' ||
@@ -710,8 +880,15 @@ function SessionPanel({
 
   useEffect(() => {
     setInitialInstruction(intent.initialInstruction ?? '')
+    setContextFiles(intent.contextFiles ?? [])
+    setContextError(null)
   }, [sessionId])
 
+  useEffect(() => {
+    if (contextBusy) return
+    setContextFiles(intent.contextFiles ?? [])
+  }, [contextBusy, intent.contextFiles])
+
   if (!sessionId || !isReviewingIntent(intent.status)) return null
 
   const updateInitialInstruction = (value: string) => {
@@ -719,6 +896,43 @@ function SessionPanel({
     persistInitialInstruction(sessionId, value)
   }
 
+  const addContextFiles = (files: File[]) => {
+    setContextBusy(true)
+    setContextError(null)
+    void Promise.all(
+      files.map(async (file) => ({
+        name: file.name,
+        mimeType: file.type || 'application/octet-stream',
+        contentBase64: await fileToBase64(file),
+      })),
+    )
+      .then((payload) => persistAddContextFiles(sessionId, payload))
+      .then((next) => {
+        setContextFiles(next.contextFiles ?? [])
+      })
+      .catch((caught) => {
+        setContextError(
+          caught instanceof Error ? caught.message : 'Could not attach files',
+        )
+      })
+      .finally(() => setContextBusy(false))
+  }
+
+  const removeContextFile = (fileId: string) => {
+    setContextBusy(true)
+    setContextError(null)
+    void persistRemoveContextFile(sessionId, fileId)
+      .then((next) => {
+        setContextFiles(next.contextFiles ?? [])
+      })
+      .catch((caught) => {
+        setContextError(
+          caught instanceof Error ? caught.message : 'Could not remove file',
+        )
+      })
+      .finally(() => setContextBusy(false))
+  }
+
   const showInitialInstruction =
     Boolean(intent.awaitingAttach) &&
     (askingBlueprint || sendingBlueprint || preparing)
@@ -800,6 +1014,11 @@ function SessionPanel({
             <HandshakeSetup
               instruction={initialInstruction}
               onInstructionChange={updateInitialInstruction}
+              contextFiles={contextFiles}
+              contextBusy={contextBusy}
+              contextError={contextError}
+              onAddContextFiles={addContextFiles}
+              onRemoveContextFile={removeContextFile}
               blueprintDefined={blueprintIsDefined(intent)}
               awaitingAttach={Boolean(intent.awaitingAttach)}
               nextAttachLabel={queuedBehind}
@@ -875,7 +1094,7 @@ function SessionPanel({
                   {intent.steps.map((step) => {
                     const proposed = proposalStep === step.index
                     const processing = processingStep === step.index
-                    const accepted = acceptedSteps.has(step.index)
+                    const accepted = acceptedSteps.has(step.index) && !proposed
                     const creating = processing && !proposed
                     const showStepAction =
                       creating ||
@@ -1074,7 +1293,7 @@ function SessionPanel({
                       value={instruction}
                       maxLength={4000}
                       rows={3}
-                      placeholder="Describe what should change in the next diff…"
+                      placeholder="Describe what should change in this proposal…"
                       onChange={(event) => setInstruction(event.target.value)}
                       onKeyDown={(event) => event.stopPropagation()}
                     />
@@ -1350,6 +1569,11 @@ function explorerInstructions({
           ? [
               { id: 'space', keys: ['Space'], label: 'Place file' },
               { id: 'b-island', keys: ['B'], label: 'Place island' },
+              {
+                id: 'point-to',
+                keys: ['Point to'],
+                label: 'Keep a file, folder, or function in mind',
+              },
             ]
           : []),
         ...backspace,
@@ -1433,11 +1657,10 @@ function explorerInstructions({
               {
                 id: 'add-file-folder',
                 keys: ['Right-click'],
-                label: 'Add file or folder',
+                label: 'Add file or folder, or point to a folder',
               },
             ]
           : []),
-        { id: 'click-line', keys: ['Click'], label: 'A line to fly there' },
         {
           id: 'option-click-walk',
           keys: ['Option', 'Click'],
@@ -1544,6 +1767,7 @@ type HUDProps = {
   blueprintVariables?: PatchSymbolAddition[]
   blueprintImports?: PatchImportAddition[]
   blueprintNotes?: BlueprintNote[]
+  blueprintPointers?: BlueprintPointer[]
   onAddBlueprintFunction?: (fileId: string, name: string) => boolean
   onAddBlueprintVariable?: (fileId: string, name: string) => boolean
   onAddBlueprintImport?: (fileId: string, raw: string) => boolean
@@ -1560,6 +1784,11 @@ type HUDProps = {
     name?: string
     note: string
   }) => void
+  onToggleBlueprintPointer?: (next: {
+    kind: BlueprintPointerKind
+    path: string
+    name?: string
+  }) => void
   onMapAddFile?: (folderPath: string) => void
   onMapAddFolder?: (folderPath: string) => void
   onInspectFile?: (fileId: string) => void
@@ -1619,6 +1848,7 @@ export function HUD({
   blueprintVariables = [],
   blueprintImports = [],
   blueprintNotes = [],
+  blueprintPointers = [],
   onAddBlueprintFunction,
   onAddBlueprintVariable,
   onAddBlueprintImport,
@@ -1626,6 +1856,7 @@ export function HUD({
   onRemoveBlueprintVariable,
   onRemoveBlueprintImport,
   onSetBlueprintNote,
+  onToggleBlueprintPointer,
   onMapAddFile,
   onMapAddFolder,
   onInspectFile,
@@ -1755,6 +1986,16 @@ export function HUD({
   const selectedFileNote = selected
     ? findBlueprintNote(blueprintNotes, selected.id, 'file')
     : ''
+  const selectedFilePointed = selected
+    ? findBlueprintPointer(blueprintPointers, 'file', selected.id)
+    : false
+  const selectedFolderPointed = selectedFolderNode
+    ? findBlueprintPointer(
+        blueprintPointers,
+        'folder',
+        selectedFolderNode.path,
+      )
+    : false
   const openFileNote = () => {
     if (!selected || !onSetBlueprintNote) return
     setInstructionsOpen(false)
@@ -2087,6 +2328,20 @@ export function HUD({
               Inspect file
             </button>
           )}
+          {canEditBlueprint && onToggleBlueprintPointer && (
+            <button
+              className="hud-button hud-inspect hud-point"
+              type="button"
+              data-pointed={selectedFilePointed ? 'true' : 'false'}
+              aria-pressed={selectedFilePointed}
+              onClick={() =>
+                onToggleBlueprintPointer({ kind: 'file', path: selected.id })
+              }
+            >
+              <EyeIcon size={15} />
+              {selectedFilePointed ? 'Stop pointing' : 'Point to file'}
+            </button>
+          )}
           {canEditBlueprint && onSetBlueprintNote && (
             <button
               className="hud-button hud-inspect"
@@ -2178,10 +2433,26 @@ export function HUD({
                   }
                   canEdit={Boolean(canEditBlueprint && onSetBlueprintNote)}
                   canRemove={Boolean(canEditBlueprint && symbol.intended)}
+                  pointed={findBlueprintPointer(
+                    blueprintPointers,
+                    'function',
+                    selected.id,
+                    symbol.name,
+                  )}
                   onRemove={() =>
                     onRemoveBlueprintFunction?.(selected.id, symbol.name)
                   }
                   onOpenNote={() => openSymbolNote('function', symbol.name)}
+                  onTogglePoint={
+                    onToggleBlueprintPointer
+                      ? () =>
+                          onToggleBlueprintPointer({
+                            kind: 'function',
+                            path: selected.id,
+                            name: symbol.name,
+                          })
+                      : undefined
+                  }
                 />
               ))}
               {extraAddedFunctions.map((item) => (
@@ -2203,7 +2474,23 @@ export function HUD({
                     noteEditor.name === item.name
                   }
                   canEdit={Boolean(canEditBlueprint && onSetBlueprintNote)}
+                  pointed={findBlueprintPointer(
+                    blueprintPointers,
+                    'function',
+                    selected.id,
+                    item.name,
+                  )}
                   onOpenNote={() => openSymbolNote('function', item.name)}
+                  onTogglePoint={
+                    onToggleBlueprintPointer
+                      ? () =>
+                          onToggleBlueprintPointer({
+                            kind: 'function',
+                            path: selected.id,
+                            name: item.name,
+                          })
+                      : undefined
+                  }
                 />
               ))}
             </ul>
@@ -2244,10 +2531,26 @@ export function HUD({
                   }
                   canEdit={Boolean(canEditBlueprint && onSetBlueprintNote)}
                   canRemove={Boolean(canEditBlueprint && symbol.intended)}
+                  pointed={findBlueprintPointer(
+                    blueprintPointers,
+                    'variable',
+                    selected.id,
+                    symbol.name,
+                  )}
                   onRemove={() =>
                     onRemoveBlueprintVariable?.(selected.id, symbol.name)
                   }
                   onOpenNote={() => openSymbolNote('variable', symbol.name)}
+                  onTogglePoint={
+                    onToggleBlueprintPointer
+                      ? () =>
+                          onToggleBlueprintPointer({
+                            kind: 'variable',
+                            path: selected.id,
+                            name: symbol.name,
+                          })
+                      : undefined
+                  }
                 />
               ))}
               {extraAddedVariables.map((item) => (
@@ -2269,7 +2572,23 @@ export function HUD({
                     noteEditor.name === item.name
                   }
                   canEdit={Boolean(canEditBlueprint && onSetBlueprintNote)}
+                  pointed={findBlueprintPointer(
+                    blueprintPointers,
+                    'variable',
+                    selected.id,
+                    item.name,
+                  )}
                   onOpenNote={() => openSymbolNote('variable', item.name)}
+                  onTogglePoint={
+                    onToggleBlueprintPointer
+                      ? () =>
+                          onToggleBlueprintPointer({
+                            kind: 'variable',
+                            path: selected.id,
+                            name: item.name,
+                          })
+                      : undefined
+                  }
                 />
               ))}
             </ul>
@@ -2413,6 +2732,24 @@ export function HUD({
               ))}
             </ul>
           )}
+          {canPlace && onToggleBlueprintPointer && (
+            <button
+              className="hud-button hud-inspect hud-point"
+              type="button"
+              data-pointed={selectedFolderPointed ? 'true' : 'false'}
+              aria-pressed={selectedFolderPointed}
+              disabled={naming || selectedFolderNode.path.startsWith('draft:')}
+              onClick={() =>
+                onToggleBlueprintPointer({
+                  kind: 'folder',
+                  path: selectedFolderNode.path,
+                })
+              }
+            >
+              <EyeIcon size={15} />
+              {selectedFolderPointed ? 'Stop pointing' : 'Point to folder'}
+            </button>
+          )}
           {canPlace && mapping && onMapAddFile && onMapAddFolder && (
             <div className="hud-decide hud-map-blueprint">
               <button
@@ -2451,6 +2788,20 @@ export function HUD({
           plannedIds={plannedIds}
           createdIds={createdIds}
           deletedIds={deletedIds}
+          pointedFileIds={
+            blueprintHidden
+              ? []
+              : blueprintPointers.flatMap((item) =>
+                  item.kind === 'folder' ? [] : [item.path],
+                )
+          }
+          pointedFolderPaths={
+            blueprintHidden
+              ? []
+              : blueprintPointers.flatMap((item) =>
+                  item.kind === 'folder' ? [item.path] : [],
+                )
+          }
           onMinimize={() => {
             setThumbnailMaximized(false)
             setThumbnailMinimized((current) => !current)