@andespindola/brainlink 0.1.0-beta.15 → 0.1.0-beta.151

package/dist/application/frontend/client-render-worker-js.js

@@ -0,0 +1,569 @@
+export const createClientRenderWorkerJs = () => `let canvas = null
+let gl = null
+let viewportWidth = 320
+let viewportHeight = 320
+let devicePixelRatio = 1
+const camera = { x: 0, y: 0, scale: 1 }
+const state = {
+  nodeCount: 0,
+  edgeCount: 0,
+  ids: [],
+  titles: [],
+  kinds: [],
+  x: new Float32Array(0),
+  y: new Float32Array(0),
+  relevance: new Float32Array(0),
+  radius: new Float32Array(0),
+  visible: new Uint8Array(0),
+  highlighted: new Uint8Array(0),
+  selected: new Uint8Array(0),
+  edgeSource: new Uint32Array(0),
+  edgeTarget: new Uint32Array(0),
+  edgeWeight: new Float32Array(0)
+}
+const nodeIndexById = new Map()
+const highlightedIds = new Set()
+let selectedNodeId = null
+let dirty = true
+let renderScheduled = false
+let hoverX = null
+let hoverY = null
+let lastFrameAt = 0
+let lastVisibleEdges = 0
+let edgePositionsBuffer = new Float32Array(0)
+let pointPositionsBuffer = new Float32Array(0)
+let pointSizesBuffer = new Float32Array(0)
+
+const defaultTheme = {
+  node: [0.68, 0.72, 0.78, 1],
+  nodeCluster: [0.42, 0.76, 0.92, 1],
+  nodeHighlight: [0.95, 0.76, 0.22, 1],
+  nodeSelected: [0.99, 0.99, 1, 1],
+  edge: [0.58, 0.64, 0.74, 0.24],
+  edgeHeavy: [0.78, 0.84, 0.92, 0.44],
+  clear: [0.05, 0.06, 0.08, 1]
+}
+
+const theme = { ...defaultTheme }
+
+const createShader = (type, source) => {
+  const shader = gl.createShader(type)
+  if (!shader) return null
+  gl.shaderSource(shader, source)
+  gl.compileShader(shader)
+  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+    gl.deleteShader(shader)
+    return null
+  }
+  return shader
+}
+
+const createProgram = (vertexSource, fragmentSource) => {
+  const vertexShader = createShader(gl.VERTEX_SHADER, vertexSource)
+  const fragmentShader = createShader(gl.FRAGMENT_SHADER, fragmentSource)
+  if (!vertexShader || !fragmentShader) return null
+  const program = gl.createProgram()
+  if (!program) return null
+  gl.attachShader(program, vertexShader)
+  gl.attachShader(program, fragmentShader)
+  gl.linkProgram(program)
+  gl.deleteShader(vertexShader)
+  gl.deleteShader(fragmentShader)
+  if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+    gl.deleteProgram(program)
+    return null
+  }
+  return program
+}
+
+let lineProgram = null
+let pointProgram = null
+let lineBuffer = null
+let pointPositionBuffer = null
+let pointSizeBuffer = null
+let linePositionLocation = -1
+let lineResolutionLocation = null
+let lineColorLocation = null
+let pointPositionLocation = -1
+let pointSizeLocation = -1
+let pointResolutionLocation = null
+let pointColorLocation = null
+
+const initWebGl = () => {
+  if (!canvas) {
+    return false
+  }
+
+  gl = canvas.getContext('webgl2', { alpha: false, antialias: true, depth: false, stencil: false }) ||
+    canvas.getContext('webgl', { alpha: false, antialias: true, depth: false, stencil: false })
+
+  if (!gl) {
+    return false
+  }
+
+  lineProgram = createProgram(
+    'attribute vec2 a_position; uniform vec2 u_resolution; void main() { vec2 zeroToOne = a_position / u_resolution; vec2 clip = zeroToOne * 2.0 - 1.0; gl_Position = vec4(clip.x, -clip.y, 0.0, 1.0); }',
+    'precision mediump float; uniform vec4 u_color; void main() { gl_FragColor = u_color; }'
+  )
+
+  pointProgram = createProgram(
+    'attribute vec2 a_position; attribute float a_size; uniform vec2 u_resolution; void main() { vec2 zeroToOne = a_position / u_resolution; vec2 clip = zeroToOne * 2.0 - 1.0; gl_Position = vec4(clip.x, -clip.y, 0.0, 1.0); gl_PointSize = a_size; }',
+    'precision mediump float; uniform vec4 u_color; void main() { vec2 center = gl_PointCoord - vec2(0.5); float distanceFromCenter = length(center); if (distanceFromCenter > 0.5) discard; float alpha = smoothstep(0.5, 0.38, distanceFromCenter); gl_FragColor = vec4(u_color.rgb, u_color.a * alpha); }'
+  )
+
+  if (!lineProgram || !pointProgram) {
+    return false
+  }
+
+  lineBuffer = gl.createBuffer()
+  pointPositionBuffer = gl.createBuffer()
+  pointSizeBuffer = gl.createBuffer()
+  if (!lineBuffer || !pointPositionBuffer || !pointSizeBuffer) {
+    return false
+  }
+
+  linePositionLocation = gl.getAttribLocation(lineProgram, 'a_position')
+  lineResolutionLocation = gl.getUniformLocation(lineProgram, 'u_resolution')
+  lineColorLocation = gl.getUniformLocation(lineProgram, 'u_color')
+  pointPositionLocation = gl.getAttribLocation(pointProgram, 'a_position')
+  pointSizeLocation = gl.getAttribLocation(pointProgram, 'a_size')
+  pointResolutionLocation = gl.getUniformLocation(pointProgram, 'u_resolution')
+  pointColorLocation = gl.getUniformLocation(pointProgram, 'u_color')
+
+  gl.enable(gl.BLEND)
+  gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA)
+  gl.disable(gl.DEPTH_TEST)
+
+  return true
+}
+
+const ensureFloat32Capacity = (buffer, neededLength) => {
+  if (buffer.length >= neededLength) {
+    return buffer
+  }
+  const next = Math.max(neededLength, Math.ceil(buffer.length * 1.6), 1024)
+  return new Float32Array(next)
+}
+
+const resizeCanvas = (width, height, ratio) => {
+  viewportWidth = Math.max(320, Number.isFinite(width) ? width : viewportWidth)
+  viewportHeight = Math.max(320, Number.isFinite(height) ? height : viewportHeight)
+  devicePixelRatio = Math.max(1, Number.isFinite(ratio) ? ratio : devicePixelRatio)
+
+  if (!canvas) return
+
+  canvas.width = Math.floor(viewportWidth * devicePixelRatio)
+  canvas.height = Math.floor(viewportHeight * devicePixelRatio)
+  if (gl) {
+    gl.viewport(0, 0, canvas.width, canvas.height)
+  }
+  dirty = true
+  requestRender()
+}
+
+const toScreenPoint = (x, y) => {
+  const sx = (x * camera.scale + camera.x) * devicePixelRatio
+  const sy = (y * camera.scale + camera.y) * devicePixelRatio
+  return [sx, sy]
+}
+
+const ensureNodeCapacity = (count) => {
+  if (state.x.length >= count) {
+    return
+  }
+
+  const nextCapacity = Math.max(count, Math.ceil(state.x.length * 1.5), 512)
+  state.x = new Float32Array(nextCapacity)
+  state.y = new Float32Array(nextCapacity)
+  state.relevance = new Float32Array(nextCapacity)
+  state.radius = new Float32Array(nextCapacity)
+  state.visible = new Uint8Array(nextCapacity)
+  state.highlighted = new Uint8Array(nextCapacity)
+  state.selected = new Uint8Array(nextCapacity)
+}
+
+const ensureEdgeCapacity = (count) => {
+  if (state.edgeSource.length >= count) {
+    return
+  }
+
+  const nextCapacity = Math.max(count, Math.ceil(state.edgeSource.length * 1.5), 1024)
+  state.edgeSource = new Uint32Array(nextCapacity)
+  state.edgeTarget = new Uint32Array(nextCapacity)
+  state.edgeWeight = new Float32Array(nextCapacity)
+}
+
+const nodeRadius = (relevance, kind) => {
+  const base = kind === 'cluster' ? 7.8 : 4.6
+  const modifier = Math.min(4.8, Math.max(0, relevance * 0.55))
+  return base + modifier
+}
+
+const loadChunk = (chunk) => {
+  const nodes = Array.isArray(chunk?.nodes) ? chunk.nodes : []
+  const edges = Array.isArray(chunk?.edges) ? chunk.edges : []
+
+  ensureNodeCapacity(nodes.length)
+  nodeIndexById.clear()
+  state.ids = new Array(nodes.length)
+  state.titles = new Array(nodes.length)
+  state.kinds = new Array(nodes.length)
+
+  for (let index = 0; index < nodes.length; index += 1) {
+    const row = nodes[index]
+    const id = typeof row?.[0] === 'string' ? row[0] : ''
+    if (!id) {
+      continue
+    }
+    const title = typeof row?.[1] === 'string' ? row[1] : id
+    const x = Number.isFinite(row?.[2]) ? Number(row[2]) : 0
+    const y = Number.isFinite(row?.[3]) ? Number(row[3]) : 0
+    const kind = row?.[6] === 'cluster' ? 'cluster' : 'node'
+    const relevance = Number.isFinite(row?.[7]) ? Number(row[7]) : 0
+
+    state.ids[index] = id
+    state.titles[index] = title
+    state.kinds[index] = kind
+    state.x[index] = x
+    state.y[index] = y
+    state.relevance[index] = relevance
+    state.radius[index] = nodeRadius(relevance, kind)
+    state.visible[index] = 0
+    state.highlighted[index] = highlightedIds.has(id) ? 1 : 0
+    state.selected[index] = selectedNodeId === id ? 1 : 0
+    nodeIndexById.set(id, index)
+  }
+
+  state.nodeCount = nodes.length
+
+  ensureEdgeCapacity(edges.length)
+  let edgeCount = 0
+  for (let index = 0; index < edges.length; index += 1) {
+    const row = edges[index]
+    const sourceId = typeof row?.[0] === 'string' ? row[0] : ''
+    const targetId = typeof row?.[1] === 'string' ? row[1] : ''
+    const source = nodeIndexById.get(sourceId)
+    const target = nodeIndexById.get(targetId)
+    if (source === undefined || target === undefined || source === target) {
+      continue
+    }
+    state.edgeSource[edgeCount] = source
+    state.edgeTarget[edgeCount] = target
+    state.edgeWeight[edgeCount] = Number.isFinite(row?.[2]) ? Number(row[2]) : 1
+    edgeCount += 1
+  }
+
+  state.edgeCount = edgeCount
+  dirty = true
+}
+
+const cullVisibleNodes = () => {
+  const minX = -280
+  const minY = -280
+  const maxX = viewportWidth + 280
+  const maxY = viewportHeight + 280
+
+  for (let index = 0; index < state.nodeCount; index += 1) {
+    const radius = state.radius[index] * camera.scale
+    const [sx, sy] = toScreenPoint(state.x[index], state.y[index])
+    const screenX = sx / devicePixelRatio
+    const screenY = sy / devicePixelRatio
+    state.visible[index] = screenX + radius >= minX && screenX - radius <= maxX && screenY + radius >= minY && screenY - radius <= maxY ? 1 : 0
+  }
+}
+
+const drawEdges = () => {
+  if (!gl || state.edgeCount === 0) return
+
+  edgePositionsBuffer = ensureFloat32Capacity(edgePositionsBuffer, state.edgeCount * 4)
+  let cursor = 0
+  let visibleEdges = 0
+  for (let index = 0; index < state.edgeCount; index += 1) {
+    const source = state.edgeSource[index]
+    const target = state.edgeTarget[index]
+    if (state.visible[source] === 0 && state.visible[target] === 0) {
+      continue
+    }
+    const [sx, sy] = toScreenPoint(state.x[source], state.y[source])
+    const [tx, ty] = toScreenPoint(state.x[target], state.y[target])
+    edgePositionsBuffer[cursor] = sx
+    edgePositionsBuffer[cursor + 1] = sy
+    edgePositionsBuffer[cursor + 2] = tx
+    edgePositionsBuffer[cursor + 3] = ty
+    cursor += 4
+    visibleEdges += 1
+  }
+
+  lastVisibleEdges = visibleEdges
+  if (cursor === 0) return
+
+  gl.useProgram(lineProgram)
+  gl.bindBuffer(gl.ARRAY_BUFFER, lineBuffer)
+  gl.bufferData(gl.ARRAY_BUFFER, edgePositionsBuffer.subarray(0, cursor), gl.STREAM_DRAW)
+  gl.enableVertexAttribArray(linePositionLocation)
+  gl.vertexAttribPointer(linePositionLocation, 2, gl.FLOAT, false, 0, 0)
+  gl.uniform2f(lineResolutionLocation, canvas.width, canvas.height)
+  gl.uniform4fv(lineColorLocation, state.nodeCount > 4000 ? theme.edge : theme.edgeHeavy)
+  gl.lineWidth(1)
+  gl.drawArrays(gl.LINES, 0, cursor / 2)
+}
+
+const drawNodeLayer = (predicate, color, radiusBoost = 1) => {
+  if (!gl || state.nodeCount === 0) return
+
+  pointPositionsBuffer = ensureFloat32Capacity(pointPositionsBuffer, state.nodeCount * 2)
+  pointSizesBuffer = ensureFloat32Capacity(pointSizesBuffer, state.nodeCount)
+  let positionCursor = 0
+  let sizeCursor = 0
+  for (let index = 0; index < state.nodeCount; index += 1) {
+    if (!predicate(index)) continue
+    const [sx, sy] = toScreenPoint(state.x[index], state.y[index])
+    pointPositionsBuffer[positionCursor] = sx
+    pointPositionsBuffer[positionCursor + 1] = sy
+    pointSizesBuffer[sizeCursor] = Math.max(1.2, state.radius[index] * camera.scale * devicePixelRatio * radiusBoost)
+    positionCursor += 2
+    sizeCursor += 1
+  }
+
+  if (positionCursor === 0) return
+
+  gl.useProgram(pointProgram)
+  gl.bindBuffer(gl.ARRAY_BUFFER, pointPositionBuffer)
+  gl.bufferData(gl.ARRAY_BUFFER, pointPositionsBuffer.subarray(0, positionCursor), gl.STREAM_DRAW)
+  gl.enableVertexAttribArray(pointPositionLocation)
+  gl.vertexAttribPointer(pointPositionLocation, 2, gl.FLOAT, false, 0, 0)
+
+  gl.bindBuffer(gl.ARRAY_BUFFER, pointSizeBuffer)
+  gl.bufferData(gl.ARRAY_BUFFER, pointSizesBuffer.subarray(0, sizeCursor), gl.STREAM_DRAW)
+  gl.enableVertexAttribArray(pointSizeLocation)
+  gl.vertexAttribPointer(pointSizeLocation, 1, gl.FLOAT, false, 0, 0)
+
+  gl.uniform2f(pointResolutionLocation, canvas.width, canvas.height)
+  gl.uniform4fv(pointColorLocation, color)
+  gl.drawArrays(gl.POINTS, 0, positionCursor / 2)
+}
+
+const clear = () => {
+  if (!gl || !canvas) return
+  gl.viewport(0, 0, canvas.width, canvas.height)
+  gl.clearColor(theme.clear[0], theme.clear[1], theme.clear[2], theme.clear[3])
+  gl.clear(gl.COLOR_BUFFER_BIT)
+}
+
+const renderFrame = (now) => {
+  renderScheduled = false
+  if (!dirty) {
+    return
+  }
+
+  const delta = now - lastFrameAt
+  const minInterval = state.nodeCount > 20000 ? 22 : 16
+  if (delta < minInterval) {
+    requestRender()
+    return
+  }
+  lastFrameAt = now
+
+  if (!gl) {
+    return
+  }
+
+  cullVisibleNodes()
+  clear()
+  drawEdges()
+
+  drawNodeLayer(
+    (index) => state.visible[index] === 1 && state.selected[index] === 0 && state.highlighted[index] === 0,
+    theme.node,
+    1
+  )
+
+  drawNodeLayer(
+    (index) => state.visible[index] === 1 && state.kinds[index] === 'cluster' && state.selected[index] === 0,
+    theme.nodeCluster,
+    1.15
+  )
+
+  drawNodeLayer(
+    (index) => state.visible[index] === 1 && state.highlighted[index] === 1,
+    theme.nodeHighlight,
+    1.22
+  )
+
+  drawNodeLayer(
+    (index) => state.visible[index] === 1 && state.selected[index] === 1,
+    theme.nodeSelected,
+    1.32
+  )
+
+  if (dirty) {
+    postMessage({
+      type: 'frame-stats',
+      visibleNodes: (() => {
+        let count = 0
+        for (let index = 0; index < state.nodeCount; index += 1) {
+          if (state.visible[index] === 1) count += 1
+        }
+        return count
+      })(),
+      visibleEdges: lastVisibleEdges
+    })
+    dirty = false
+  }
+}
+
+const requestRender = () => {
+  if (renderScheduled) {
+    return
+  }
+  renderScheduled = true
+  const raf = self.requestAnimationFrame
+  if (typeof raf === 'function') {
+    raf.call(self, renderFrame)
+    return
+  }
+  setTimeout(() => renderFrame(performance.now()), 16)
+}
+
+const setCamera = (nextCamera) => {
+  if (!nextCamera || typeof nextCamera !== 'object') {
+    return
+  }
+  camera.x = Number.isFinite(nextCamera.x) ? Number(nextCamera.x) : camera.x
+  camera.y = Number.isFinite(nextCamera.y) ? Number(nextCamera.y) : camera.y
+  camera.scale = Number.isFinite(nextCamera.scale) ? Math.max(0.0002, Math.min(8, Number(nextCamera.scale))) : camera.scale
+  dirty = true
+  requestRender()
+}
+
+const worldAtScreen = (screenX, screenY) => {
+  const x = (screenX - camera.x) / camera.scale
+  const y = (screenY - camera.y) / camera.scale
+  return [x, y]
+}
+
+const pickNode = (screenX, screenY) => {
+  const [worldX, worldY] = worldAtScreen(screenX, screenY)
+  let bestIndex = -1
+  let bestDistance = Infinity
+
+  for (let index = 0; index < state.nodeCount; index += 1) {
+    if (state.visible[index] === 0) continue
+    const dx = state.x[index] - worldX
+    const dy = state.y[index] - worldY
+    const distance = Math.hypot(dx, dy)
+    const maxDistance = state.radius[index] * 1.2
+    if (distance <= maxDistance && distance < bestDistance) {
+      bestDistance = distance
+      bestIndex = index
+    }
+  }
+
+  if (bestIndex < 0) {
+    return null
+  }
+
+  return {
+    id: state.ids[bestIndex],
+    title: state.titles[bestIndex],
+    kind: state.kinds[bestIndex],
+    x: state.x[bestIndex],
+    y: state.y[bestIndex]
+  }
+}
+
+const setHighlights = (ids) => {
+  highlightedIds.clear()
+  const list = Array.isArray(ids) ? ids : []
+  for (let index = 0; index < list.length; index += 1) {
+    const id = list[index]
+    if (typeof id === 'string' && id.length > 0) {
+      highlightedIds.add(id)
+    }
+  }
+
+  for (let index = 0; index < state.nodeCount; index += 1) {
+    state.highlighted[index] = highlightedIds.has(state.ids[index]) ? 1 : 0
+  }
+  dirty = true
+  requestRender()
+}
+
+const setSelected = (id) => {
+  selectedNodeId = typeof id === 'string' && id.length > 0 ? id : null
+  for (let index = 0; index < state.nodeCount; index += 1) {
+    state.selected[index] = selectedNodeId === state.ids[index] ? 1 : 0
+  }
+  dirty = true
+  requestRender()
+}
+
+self.onmessage = (event) => {
+  const payload = event.data
+  if (!payload || typeof payload !== 'object') {
+    return
+  }
+
+  if (payload.type === 'init') {
+    canvas = payload.canvas
+    if (payload.theme && typeof payload.theme === 'object') {
+      Object.assign(theme, payload.theme)
+    }
+    const initialized = initWebGl()
+    if (!initialized) {
+      postMessage({ type: 'fatal', message: 'WebGL is not available in render worker.' })
+      return
+    }
+    resizeCanvas(payload.width, payload.height, payload.devicePixelRatio)
+    setCamera(payload.camera)
+    requestRender()
+    postMessage({ type: 'ready' })
+    return
+  }
+
+  if (payload.type === 'resize') {
+    resizeCanvas(payload.width, payload.height, payload.devicePixelRatio)
+    return
+  }
+
+  if (payload.type === 'camera') {
+    setCamera(payload.camera)
+    return
+  }
+
+  if (payload.type === 'chunk') {
+    loadChunk(payload.chunk)
+    requestRender()
+    return
+  }
+
+  if (payload.type === 'highlight') {
+    setHighlights(payload.ids)
+    return
+  }
+
+  if (payload.type === 'select') {
+    setSelected(payload.id)
+    return
+  }
+
+  if (payload.type === 'pick') {
+    const node = pickNode(
+      Number.isFinite(payload.x) ? Number(payload.x) : 0,
+      Number.isFinite(payload.y) ? Number(payload.y) : 0
+    )
+    postMessage({
+      type: 'pick-result',
+      requestId: payload.requestId,
+      node
+    })
+    return
+  }
+
+  if (payload.type === 'pointer') {
+    hoverX = Number.isFinite(payload.x) ? Number(payload.x) : null
+    hoverY = Number.isFinite(payload.y) ? Number(payload.y) : null
+    return
+  }
+}
+`;

package/dist/application/frontend/client-worker-js.js

@@ -0,0 +1,66 @@
+export const createClientWorkerJs = () => `const normalize = value => String(value || '')
+  .normalize('NFKD')
+  .replace(/\\p{Diacritic}/gu, '')
+  .toLowerCase()
+
+let nodeIndex = []
+
+const toNodeIndex = nodes =>
+  (Array.isArray(nodes) ? nodes : [])
+    .map(node => {
+      const id = typeof node.id === 'string' ? node.id : ''
+      if (!id) {
+        return null
+      }
+      const title = normalize(node.title)
+      const path = normalize(node.path)
+      const tags = Array.isArray(node.tags) ? node.tags.map(tag => normalize(tag)) : []
+      return {
+        id,
+        text: [title, path, ...tags].join(' ')
+      }
+    })
+    .filter(Boolean)
+
+const scoreText = (text, query) => {
+  if (!query) return 0
+  if (!text.includes(query)) return 0
+  if (text.startsWith(query)) return 4
+  return 1
+}
+
+const filterIds = (query, limit) => {
+  const normalizedQuery = normalize(query).trim()
+  if (!normalizedQuery) {
+    return []
+  }
+  const rows = []
+  for (let index = 0; index < nodeIndex.length; index += 1) {
+    const row = nodeIndex[index]
+    const score = scoreText(row.text, normalizedQuery)
+    if (score > 0) {
+      rows.push({ id: row.id, score })
+    }
+  }
+  rows.sort((left, right) => right.score - left.score || left.id.localeCompare(right.id))
+  return rows.slice(0, Math.max(1, Number.isFinite(limit) ? limit : rows.length)).map(row => row.id)
+}
+
+self.onmessage = event => {
+  const payload = event.data
+  if (!payload || typeof payload !== 'object') {
+    return
+  }
+  if (payload.type === 'load-nodes') {
+    nodeIndex = toNodeIndex(payload.nodes)
+    return
+  }
+  if (payload.type === 'filter') {
+    const token = payload.token
+    const ids = filterIds(payload.query, payload.limit)
+    self.postMessage({ type: 'filter-result', token, ids })
+  }
+}
+
+self.postMessage({ type: 'ready' })
+`;

package/dist/application/get-graph-layout.js

@@ -1,9 +1,28 @@
 import { createHash } from 'node:crypto';
-import { stat } from 'node:fs/promises';
-import { createCauliflowerGraphLayout } from '../domain/graph-layout.js';
+import { mkdir, readFile, rename, stat, writeFile } from 'node:fs/promises';
+import { dirname, join } from 'node:path';
+import { createStarGraphLayout } from '../domain/graph-layout.js';
 import { indexStoragePath } from '../infrastructure/file-index.js';
 import { getGraphSummary } from './get-graph-summary.js';
+const graphLayoutVersion = 3;
 const graphLayoutCache = new Map();
+const graphLayoutStoragePath = (vaultPath, agentId) => join(vaultPath, '.brainlink', `graph-layout-${agentId?.replace(/[^a-zA-Z0-9_-]/g, '_') ?? 'all'}.json`);
+const readPersistedLayout = async (vaultPath, databaseSignature, agentId) => {
+    try {
+        const parsed = JSON.parse(await readFile(graphLayoutStoragePath(vaultPath, agentId), 'utf8'));
+        return parsed.databaseSignature === databaseSignature && parsed.layoutVersion === graphLayoutVersion ? parsed : null;
+    }
+    catch {
+        return null;
+    }
+};
+const writePersistedLayout = async (vaultPath, agentId, cached) => {
+    const target = graphLayoutStoragePath(vaultPath, agentId);
+    const temp = `${target}.tmp`;
+    await mkdir(dirname(target), { recursive: true, mode: 0o700 });
+    await writeFile(temp, `${JSON.stringify(cached)}\n`, { encoding: 'utf8', mode: 0o600 });
+    await rename(temp, target);
+};
 const readDatabaseSignature = async (vaultPath) => {
     try {
         const info = await stat(indexStoragePath(vaultPath));
@@ -26,16 +45,30 @@ export const getGraphLayout = async (vaultPath, agentId) => {
     const databaseSignature = await readDatabaseSignature(vaultPath);
     const cacheKey = `${vaultPath}:${agentId ?? ''}`;
     const cached = graphLayoutCache.get(cacheKey);
-    if (cached?.databaseSignature === databaseSignature) {
+    if (cached?.databaseSignature === databaseSignature && cached.layoutVersion === graphLayoutVersion) {
         return {
             signature: cached.signature,
             layout: cached.layout
         };
     }
+    const persisted = await readPersistedLayout(vaultPath, databaseSignature, agentId);
+    if (persisted) {
+        graphLayoutCache.set(cacheKey, persisted);
+        return {
+            signature: persisted.signature,
+            layout: persisted.layout
+        };
+    }
     const graph = await getGraphSummary(vaultPath, agentId);
     const signature = createGraphSignature(graph);
-    const layout = createCauliflowerGraphLayout(graph);
-    graphLayoutCache.set(cacheKey, { databaseSignature, signature, layout });
+    const rawLayout = createStarGraphLayout(graph);
+    const layout = {
+        ...rawLayout,
+        nodes: rawLayout.nodes.map((node) => ({ ...node, content: '' }))
+    };
+    const nextCache = { layoutVersion: graphLayoutVersion, databaseSignature, signature, layout };
+    graphLayoutCache.set(cacheKey, nextCache);
+    await writePersistedLayout(vaultPath, agentId, nextCache);
     return {
         signature,
         layout