synabun 2.0.0 → 2.0.5

package/neural-interface/public/shared/editor/editor-minimap.js

@@ -0,0 +1,371 @@
+// ═══════════════════════════════════════════
+// SynaBun Neural Interface — Code editor: the minimap
+// ═══════════════════════════════════════════
+//
+// An overview of the document at the right edge of the editor: every line a
+// row of small blocks in the colours of its tokens, a box over the part that
+// is in view, and marks for what the editor knows about a line: changed
+// against the last commit (a strip on the left), a search match and a problem
+// (a tick on the right). A click goes to a line; dragging scrolls.
+//
+// It draws only the rows that fit in it, from the editor's own syntax tree, at
+// most once per frame: nothing here is done per document on a keystroke. Of a
+// line it looks at the characters it can draw and no further, so a line of a
+// megabyte (a minified file) costs what any line costs. It is a part of the
+// scroller (so the text is laid out beside it, never under it) that stays in
+// view while the text scrolls.
+// Takes the vendored bundle as an argument: no imports. The helpers at the top
+// need no page: `node --test` loads them as they are.
+
+/** Sizes in CSS pixels: the whole width, a row, the block in it, a character, the git strip, the gap after it, a tick. */
+export const MINIMAP = Object.freeze({ width: 64, row: 3, block: 2, char: 0.75, strip: 3, gap: 3, tick: 4 });
+/** Characters of a line that are looked at, at most: what lies beyond is outside the minimap anyway. */
+const LINE_SCAN = 400;
+// @lezer/common's IterMode.IncludeAnonymous: a walk that sees the nodes a parser adds to keep a long run of
+// siblings balanced. Through them a place in the tree is found by its position, not by passing every sibling.
+const INCLUDE_ANONYMOUS = 2;
+/** Search matches marked at most, and how long after an edit they are looked for again. */
+export const MATCH_CAP = 5000;
+const MATCH_DELAY_MS = 200;
+
+/**
+ * Which lines the minimap shows.
+ * @param {{ lines: number, height: number, row?: number, scrollTop: number, scrollMax: number }} o `height`: the
+ *   minimap's; `scrollTop` / `scrollMax`: where the editor is scrolled to, and the furthest it can be
+ * @returns {{ first: number, count: number }} the first line (1-based) and how many: all of them when they fit,
+ *   else the stretch that is as far through the document as the editor is scrolled
+ */
+export function minimapWindow({ lines, height, row = MINIMAP.row, scrollTop, scrollMax }) {
+  const total = Math.max(1, Math.floor(lines) || 1);
+  const fit = Math.max(1, Math.floor(height / row));
+  if (total <= fit) return { first: 1, count: total };
+  const ratio = scrollMax > 0 ? Math.min(1, Math.max(0, scrollTop / scrollMax)) : 0;
+  return { first: 1 + Math.round(ratio * (total - fit)), count: fit };
+}
+
+/**
+ * The box over the lines that are in view.
+ * @param {{ first: number, count: number, topLine: number, bottomLine: number, row?: number }} o `first` / `count`:
+ *   what minimapWindow() returned; `topLine` / `bottomLine`: the first and the last line in view
+ * @returns {{ top: number, height: number }} in pixels from the minimap's top; never outside the rows it shows
+ */
+export function minimapBox({ first, count, topLine, bottomLine, row = MINIMAP.row }) {
+  const last = first + count - 1;
+  const from = Math.min(Math.max(topLine, first), last);
+  const to = Math.min(Math.max(bottomLine, from), last);
+  return { top: (from - first) * row, height: (to - from + 1) * row };
+}
+
+/** The line under a point of the minimap, `y` pixels from its top. */
+export function minimapLineAt({ y, first, count, row = MINIMAP.row }) {
+  return first + Math.min(count - 1, Math.max(0, Math.floor(y / row)));
+}
+
+/**
+ * The blocks of one line: each run of characters that are not blank and share a colour.
+ * @param {string} text the line (or its start)
+ * @param {{ tabSize?: number, maxColumns?: number, colorAt?: (index: number) => any }} [o] `colorAt`: the colour
+ *   of the character at an index of `text`
+ * @returns {{ column: number, width: number, color: any }[]} `column`: where the run starts, tabs counted as
+ *   the columns they take
+ */
+export function lineRuns(text, { tabSize = 4, maxColumns = Infinity, colorAt = () => null } = {}) {
+  const runs = [];
+  let column = 0;
+  let open = null;
+  for (let i = 0; i < text.length && column < maxColumns; i++) {
+    const c = text.charCodeAt(i);
+    if (c === 32 || c === 9) {
+      open = null;
+      column += c === 9 ? tabSize - (column % tabSize) : 1;
+      continue;
+    }
+    const color = colorAt(i);
+    if (open && open.color === color) open.width++;
+    else { open = { column, width: 1, color }; runs.push(open); }
+    column++;
+  }
+  return runs;
+}
+
+/**
+ * The stretches of the document a redraw needs the colours of: from each line shown, the characters that can be
+ * drawn. Lines that are no longer than `limit` are joined into one stretch; of a longer line only its start is
+ * taken, and the next stretch begins on the line after it.
+ * @param {{ from: number, lengths: number[], limit: number }} o `from`: where the first line shown starts;
+ *   `lengths`: the length of each line shown, in order; `limit`: how many characters of a line are looked at
+ * @returns {number[]} pairs of document positions: start, end, start, end, …, in order, none of them empty
+ */
+export function highlightRanges({ from, lengths, limit }) {
+  const ranges = [];
+  let at = from;       // where the line being looked at starts
+  let start = from;    // where the stretch that is open starts
+  for (const length of lengths) {
+    if (length > limit) {
+      if (at + limit > start) ranges.push(start, at + limit);
+      start = at + length + 1;
+    }
+    at += length + 1;
+  }
+  const end = at - 1;  // the end of the last line
+  if (end > start) ranges.push(start, end);
+  return ranges;
+}
+
+/**
+ * The token colours of what a redraw shows: `[start, end, colour, start, end, colour, …]` in document order.
+ * Asked stretch by stretch (highlightRanges), each found in the tree by its position: the cost follows what is
+ * drawn, whatever the length of the lines and wherever in the document they are.
+ * @param {object} cm the vendored CodeMirror bundle
+ * @param {{ tree: object, highlighter: object, ranges: number[], colorOf: (name: string) => any }} o `tree`: the
+ *   document's syntax tree; `highlighter`: a tag highlighter whose classes `colorOf` turns into colours
+ */
+export function tokenSpans(cm, { tree, highlighter, ranges, colorOf }) {
+  const spans = [];
+  const byPosition = { cursor: () => tree.cursor(INCLUDE_ANONYMOUS), length: tree.length };
+  const put = (start, stop, cls) => {
+    const name = cls.indexOf(' ') < 0 ? cls : cls.slice(0, cls.indexOf(' '));
+    spans.push(start, stop, colorOf(name));
+  };
+  for (let i = 0; i < ranges.length; i += 2) cm.highlightTree(byPosition, highlighter, put, ranges[i], ranges[i + 1]);
+  return spans;
+}
+
+/**
+ * @param {object} cm the vendored CodeMirror bundle (editor-loader.js)
+ * @param {object} o
+ * @param {{ tag: any, color?: string }[]} o.highlight the theme's tag → colour table (editor-theme.js: highlightSpecs)
+ * @param {{ between: (state: object, from: number, to: number, use: (at: number, kind: string) => void) => void }} [o.git]
+ *   editor-git.js: the marks of a stretch of the document
+ * @param {{ each: (state: object, use: (from: number, to: number) => void) => void }} [o.problems] editor-lint.js
+ */
+export function editorMinimap(cm, { highlight, git = null, problems = null }) {
+  const { EditorView, ViewPlugin } = cm;
+  // The theme's colours are variables: a token's class here is the name of its variable, read off the editor once.
+  const variable = (color) => /var\((--[\w-]+)/.exec(String(color || ''))?.[1] || null;
+  const highlighter = cm.tagHighlighter(highlight.filter((spec) => variable(spec.color)).map((spec) => ({ tag: spec.tag, class: variable(spec.color) })));
+
+  const plugin = ViewPlugin.fromClass(class {
+    constructor(view) {
+      this.view = view;
+      this.colors = new Map();
+      this.window = { first: 1, count: 1 };
+      this.box = { top: 0, height: 0, shown: false };
+      this.matches = [];
+      this.matchTimer = 0;
+      this.drag = null;
+
+      this.dom = document.createElement('div');
+      this.dom.className = 'cm-minimap';
+      // An overview for the pointer: everything it shows is in the text, where the keyboard and a screen reader are.
+      this.dom.setAttribute('aria-hidden', 'true');
+      this.canvas = document.createElement('canvas');
+      this.slider = document.createElement('div');
+      this.slider.className = 'cm-minimap-box';
+      this.dom.append(this.canvas, this.slider);
+      view.scrollDOM.insertBefore(this.dom, view.contentDOM.nextSibling);
+
+      this.onScroll = () => this.schedule();
+      view.scrollDOM.addEventListener('scroll', this.onScroll, { passive: true });
+      this.onDown = (event) => this.pointerDown(event);
+      this.onMove = (event) => this.pointerMove(event);
+      this.onUp = (event) => this.pointerUp(event);
+      this.dom.addEventListener('pointerdown', this.onDown);
+      this.dom.addEventListener('pointermove', this.onMove);
+      this.dom.addEventListener('pointerup', this.onUp);
+      this.dom.addEventListener('pointercancel', this.onUp);
+
+      this.measure = { key: this, read: (v) => this.read(v), write: (geometry) => this.draw(geometry) };
+      this.findMatches();
+      this.schedule();
+    }
+
+    schedule() { this.view.requestMeasure(this.measure); }
+
+    update(update) {
+      const searching = cm.searchPanelOpen(update.state);
+      const queryChanged = searching !== cm.searchPanelOpen(update.startState)
+        || update.transactions.some((tr) => tr.effects.some((effect) => effect.is(cm.setSearchQuery)));
+      if (queryChanged || (update.docChanged && searching)) {
+        clearTimeout(this.matchTimer);
+        this.matchTimer = setTimeout(() => { this.findMatches(); this.schedule(); }, queryChanged ? 0 : MATCH_DELAY_MS);
+      }
+      // A caret that only moves changes nothing here. Anything else may: text, size, the parse reaching further,
+      // marks that arrived with an effect.
+      if (update.docChanged || update.geometryChanged || update.viewportChanged || update.transactions.some((tr) => tr.effects.length)
+        || cm.syntaxTree(update.state) !== cm.syntaxTree(update.startState)) this.schedule();
+    }
+
+    // The lines that hold a match of the find bar's query, in order.
+    findMatches() {
+      this.matchTimer = 0;
+      const { state } = this.view;
+      const lines = [];
+      if (cm.searchPanelOpen(state)) {
+        const query = cm.getSearchQuery(state);
+        if (query.search && query.valid) {
+          const cursor = query.getCursor(state);
+          let seen = 0; let last = 0;
+          for (let step = cursor.next(); !step.done && seen < MATCH_CAP; step = cursor.next(), seen++) {
+            const line = state.doc.lineAt(step.value.from).number;
+            if (line !== last) { lines.push(line); last = line; }
+          }
+        }
+      }
+      this.matches = lines;
+    }
+
+    color(name) {
+      if (!this.colors.has(name)) this.colors.set(name, getComputedStyle(this.view.dom).getPropertyValue(name).trim() || '#888');
+      return this.colors.get(name);
+    }
+
+    read(view) {
+      const scroller = view.scrollDOM;
+      const { doc } = view.state;
+      const top = scroller.getBoundingClientRect().top - view.documentTop;
+      return {
+        height: this.dom.clientHeight,
+        scrollTop: scroller.scrollTop,
+        scrollMax: scroller.scrollHeight - scroller.clientHeight,
+        topLine: doc.lineAt(view.lineBlockAtHeight(top).from).number,
+        bottomLine: doc.lineAt(view.lineBlockAtHeight(top + scroller.clientHeight).from).number,
+      };
+    }
+
+    draw(geometry) {
+      const { view, canvas } = this;
+      const { state } = view;
+      const { doc } = state;
+      const { width, row, block, char, strip, gap, tick } = MINIMAP;
+      const height = geometry.height;
+      if (height <= 0) return;
+      const ratio = Math.max(1, window.devicePixelRatio || 1);
+      const w = Math.round(width * ratio); const h = Math.round(height * ratio);
+      if (canvas.width !== w || canvas.height !== h) { canvas.width = w; canvas.height = h; }
+      const ctx = canvas.getContext('2d');
+      if (!ctx) return;
+      ctx.setTransform(ratio, 0, 0, ratio, 0, 0);
+      ctx.clearRect(0, 0, width, height);
+
+      const shown = minimapWindow({ lines: doc.lines, height, scrollTop: geometry.scrollTop, scrollMax: geometry.scrollMax });
+      this.window = shown;
+      const end = shown.first + shown.count;   // not included
+      const from = doc.line(shown.first).from;
+      const to = doc.line(end - 1).to;
+
+      const left = strip + gap;
+      const maxColumns = Math.floor((width - left - tick) / char);
+      // A character takes a column at least: no more of a line than there are columns is ever drawn.
+      const scan = Math.min(LINE_SCAN, maxColumns);
+      const texts = [];
+      const lengths = [];
+      for (const text of doc.iterLines(shown.first, end)) {
+        lengths.push(text.length);
+        texts.push(text.length > scan ? text.slice(0, scan) : text);
+      }
+      // The token colours of what is drawn, from the tree the editor has parsed so far.
+      const spans = tokenSpans(cm, { tree: cm.syntaxTree(state), highlighter, ranges: highlightRanges({ from, lengths, limit: scan }), colorOf: (name) => this.color(name) });
+      const plain = this.color('--ed-fg');
+
+      // What is known about its lines.
+      const changed = new Map();
+      git?.between(state, from, to, (at, kind) => changed.set(doc.lineAt(at).number, kind));
+      const broken = new Set();
+      problems?.each(state, (start, stop) => {
+        if (stop < from || start > to) return;
+        const lastLine = doc.lineAt(Math.min(stop, to)).number;
+        for (let n = doc.lineAt(Math.max(start, from)).number; n <= lastLine; n++) broken.add(n);
+      });
+      const matched = new Set();
+      for (const line of this.matches) { if (line >= end) break; if (line >= shown.first) matched.add(line); }
+
+      const tabSize = state.tabSize;
+      const gitColor = { added: this.color('--ed-add'), modified: this.color('--ed-warn'), deleted: this.color('--ed-del') };
+      let at = from;      // the document position of the line being drawn
+      let span = 0;       // the first span that may reach into it
+      for (let n = shown.first; n < end; n++) {
+        const text = texts[n - shown.first] || '';
+        const y = (n - shown.first) * row;
+        ctx.globalAlpha = 1;
+        const kind = changed.get(n);
+        if (kind) { ctx.fillStyle = gitColor[kind]; ctx.fillRect(0, y, strip, kind === 'deleted' ? 1 : row); }
+        if (broken.has(n)) { ctx.fillStyle = this.color('--ed-error'); ctx.fillRect(width - tick, y, tick, block); }
+        else if (matched.has(n)) { ctx.fillStyle = this.color('--ed-minimap-match'); ctx.fillRect(width - tick, y, tick, block); }
+        if (text) {
+          const start = at;
+          const colorAt = (index) => {
+            const position = start + index;
+            while (span < spans.length && spans[span + 1] <= position) span += 3;
+            return span < spans.length && spans[span] <= position ? spans[span + 2] : plain;
+          };
+          ctx.globalAlpha = 0.65;
+          for (const run of lineRuns(text, { tabSize, maxColumns, colorAt })) {
+            ctx.fillStyle = run.color;
+            ctx.fillRect(left + run.column * char, y, Math.min(run.width, maxColumns - run.column) * char, block);
+          }
+        }
+        at += (lengths[n - shown.first] || 0) + 1;
+      }
+      ctx.globalAlpha = 1;
+
+      // The part that is in view. With nothing to scroll there is no part to point out.
+      const box = minimapBox({ ...shown, topLine: geometry.topLine, bottomLine: geometry.bottomLine });
+      this.box = { ...box, shown: geometry.scrollMax > 0 };
+      this.slider.style.display = this.box.shown ? '' : 'none';
+      this.slider.style.top = `${box.top}px`;
+      this.slider.style.height = `${box.height}px`;
+      this.extent = Math.min(height, shown.count * row);
+    }
+
+    // The pointer `y` pixels down the minimap, the box held `grab` pixels from its top: scroll so it is there.
+    follow(y, grab) {
+      const scroller = this.view.scrollDOM;
+      const room = (this.extent || 0) - this.box.height;
+      const max = scroller.scrollHeight - scroller.clientHeight;
+      if (max <= 0) return;
+      const ratio = room > 0 ? Math.min(1, Math.max(0, (y - grab) / room)) : 0;
+      scroller.scrollTop = ratio * max;
+    }
+
+    pointerDown(event) {
+      if (event.button !== 0) return;
+      event.preventDefault();   // the keyboard stays in the text
+      const y = event.clientY - this.dom.getBoundingClientRect().top;
+      const onBox = this.box.shown && y >= this.box.top && y <= this.box.top + this.box.height;
+      if (!onBox) {
+        // A click beside the box: that line goes to the middle of the view.
+        const line = minimapLineAt({ y, ...this.window });
+        const { doc } = this.view.state;
+        this.view.dispatch({ effects: EditorView.scrollIntoView(doc.line(Math.min(line, doc.lines)).from, { y: 'center' }) });
+      }
+      this.drag = { grab: onBox ? y - this.box.top : this.box.height / 2, moved: false };
+      this.dom.classList.add('cm-minimap-dragging');
+      try { this.dom.setPointerCapture(event.pointerId); } catch { /* the pointer is gone already */ }
+    }
+
+    pointerMove(event) {
+      if (!this.drag) return;
+      this.drag.moved = true;
+      this.follow(event.clientY - this.dom.getBoundingClientRect().top, this.drag.grab);
+    }
+
+    pointerUp(event) {
+      if (!this.drag) return;
+      this.drag = null;
+      this.dom.classList.remove('cm-minimap-dragging');
+      try { this.dom.releasePointerCapture(event.pointerId); } catch { /* not captured */ }
+    }
+
+    destroy() {
+      clearTimeout(this.matchTimer);
+      this.view.scrollDOM.removeEventListener('scroll', this.onScroll);
+      this.dom.remove();
+    }
+  });
+
+  return {
+    /** The minimap, for the view's minimap compartment. */
+    extension: [plugin, EditorView.scrollMargins.of(() => ({ right: MINIMAP.width }))],
+  };
+}

package/neural-interface/public/shared/editor/editor-palette-logic.js

@@ -0,0 +1,192 @@
+// ═══════════════════════════════════════════
+// SynaBun Neural Interface — Code editor: what the palette lists
+// ═══════════════════════════════════════════
+//
+// The decisions behind the command palette and go-to-file (editor-palette.js
+// opens them): which commands are listed, how what was typed is matched
+// against a name, in which order the matches come, and what a file search
+// asks the server and makes of its answer. No DOM and no imports: loaded by
+// `node --test` as it is.
+
+/** Rows a list shows at most. */
+export const PALETTE_LIMIT = 50;
+/** A file search waits this long after the last key before it asks the server. */
+export const FILE_SEARCH_DELAY_MS = 120;
+
+const isUpper = (c) => c >= 65 && c <= 90;
+const isLower = (c) => c >= 97 && c <= 122;
+const isAlnum = (c) => isUpper(c) || isLower(c) || (c >= 48 && c <= 57) || c > 127;
+
+/**
+ * How well `query` matches `text`: its characters in order, anywhere in the text (case does not count). A match
+ * at the start of a word, and characters that follow one another, count for more; so does a text with little
+ * else in it. Null when the characters are not all there.
+ * @returns {number | null}
+ */
+export function fuzzyScore(text, query) {
+  const hay = String(text ?? '');
+  const needle = String(query ?? '').toLowerCase();
+  if (!needle) return 0;
+  const lower = hay.toLowerCase();
+  let score = 0;
+  let from = 0;
+  let previous = -2;
+  for (let i = 0; i < needle.length; i++) {
+    const wanted = needle[i];
+    // The next place this character stands, a word start before any other.
+    let at = -1;
+    for (let j = lower.indexOf(wanted, from); j !== -1; j = lower.indexOf(wanted, j + 1)) {
+      if (j === previous + 1) { at = j; break; }   // straight after the last one: the run goes on
+      const before = j ? hay.charCodeAt(j - 1) : 0;
+      const here = hay.charCodeAt(j);
+      if (j === 0 || !isAlnum(before) || (isLower(before) && isUpper(here))) { at = j; break; }
+      if (at === -1) at = j;
+    }
+    if (at === -1) return null;
+    const before = at ? hay.charCodeAt(at - 1) : 0;
+    const wordStart = at === 0 || !isAlnum(before) || (isLower(before) && isUpper(hay.charCodeAt(at)));
+    score += 10 + (at === previous + 1 ? 14 : 0) + (wordStart ? 12 : 0) - Math.min(8, Math.max(0, at - from));
+    previous = at;
+    from = at + 1;
+  }
+  if (lower.startsWith(needle)) score += 20;
+  return score - Math.min(20, Math.floor((hay.length - needle.length) / 4));
+}
+
+/** The words of what was typed. */
+export const queryTerms = (query) => String(query ?? '').trim().split(/\s+/).filter(Boolean);
+
+/** Every word must match; the scores add up. Null when one does not. */
+function scoreTerms(text, terms) {
+  let total = 0;
+  for (const term of terms) {
+    const score = fuzzyScore(text, term);
+    if (score === null) return null;
+    total += score;
+  }
+  return total;
+}
+
+/**
+ * The commands a palette lists: the ones that can be run from a list (a command with only a mouse gesture, or
+ * one marked `palette: false` because it acts on something a list takes the keyboard from, is not), of the
+ * features this server has.
+ * @param {object[]} commands editor-commands.js
+ * @param {{ features?: string[] }} [o]
+ * @returns {{ id: string, titleKey: string, key: string | null }[]}
+ */
+export function paletteCommands(commands, { features = [] } = {}) {
+  const seen = new Set();
+  const rows = [];
+  for (const command of commands) {
+    if (typeof command.run !== 'function' || command.palette === false) continue;
+    if (command.feature && !features.includes(command.feature)) continue;
+    if (seen.has(command.id)) continue;
+    seen.add(command.id);
+    rows.push({ id: command.id, titleKey: command.titleKey, key: command.keys?.[0] || null });
+  }
+  return rows;
+}
+
+/**
+ * Rows in the order a list shows them for what was typed: the best match first; rows that match equally keep
+ * the order they came in. Nothing typed: every row, as it came.
+ * @param {{ label: string, detail?: string }[]} rows `detail`: more words that may be matched (a folder), for less
+ * @param {string} query
+ * @param {{ limit?: number }} [o]
+ */
+export function rankRows(rows, query, { limit = PALETTE_LIMIT } = {}) {
+  const terms = queryTerms(query);
+  if (!terms.length) return rows.slice(0, limit);
+  const scored = [];
+  rows.forEach((row, index) => {
+    const own = scoreTerms(row.label, terms);
+    const wider = row.detail ? scoreTerms(`${row.detail}/${row.label}`, terms) : null;
+    // A match in the name itself comes before one that needs the folder.
+    const score = own !== null ? own + 1000 : wider;
+    if (score !== null) scored.push({ row, score, index });
+  });
+  scored.sort((a, b) => b.score - a.score || a.index - b.index);
+  return scored.slice(0, limit).map((entry) => entry.row);
+}
+
+/**
+ * What a file search asks GET /api/project-files for. The server looks for one run of characters in a path: the
+ * longest word that was typed is sent, and the other words are matched here.
+ * @param {string} project the project's folder
+ * @param {string} query
+ * @returns {string | null} the query string, or null when nothing was typed (nothing is asked then)
+ */
+export function fileSearchParams(project, query) {
+  const terms = queryTerms(query);
+  if (!project || !terms.length) return null;
+  const longest = terms.reduce((best, term) => (term.length > best.length ? term : best), '');
+  return new URLSearchParams({ path: project, search: longest, recursive: '1', filesOnly: '1' }).toString();
+}
+
+const slashes = (path) => String(path ?? '').replace(/\\/g, '/');
+
+/**
+ * The registered project a file is in: the one whose folder holds it, the innermost when projects are nested.
+ * Go-to-file searches it when no project is selected in the File Explorer (a file opened from a link in a chat).
+ * @param {string} path a file's path
+ * @param {{ path?: string }[]} projects the registered projects, as GET /api/projects lists them
+ * @returns {string | null} the project's folder
+ */
+export function projectFor(path, projects) {
+  const file = slashes(path);
+  let best = null;
+  for (const project of Array.isArray(projects) ? projects : []) {
+    const root = slashes(project?.path).replace(/\/+$/, '');
+    if (root && file.startsWith(`${root}/`) && (!best || root.length > best.length)) best = root;
+  }
+  return best;
+}
+
+/**
+ * The files of a search answer, as rows.
+ * @param {{ path?: string, items?: object[] } | null} body what GET /api/project-files answered
+ * @returns {{ id: string, label: string, detail: string }[]} `id`: the file's full path; `detail`: its folder
+ *   inside the project ('' at the top)
+ */
+export function fileRows(body) {
+  const folder = slashes(body?.path).replace(/\/+$/, '');
+  if (!folder || !Array.isArray(body?.items)) return [];
+  const rows = [];
+  for (const item of body.items) {
+    if (!item || item.type !== 'file' || typeof item.name !== 'string') continue;
+    const inside = slashes(typeof item.relativePath === 'string' && item.relativePath ? item.relativePath : item.name).replace(/^\/+/, '');
+    const cut = inside.lastIndexOf('/');
+    rows.push({ id: `${folder}/${inside}`, label: item.name, detail: cut > 0 ? inside.slice(0, cut) : '' });
+  }
+  return rows;
+}
+
+/**
+ * The open tabs as rows, for a go-to-file list in which nothing was typed yet: the tab used last first.
+ * @param {{ path: string, name: string }[]} tabs in the order they were last used
+ * @param {string | null} project the project's folder: a tab inside it shows its folder from there
+ */
+export function tabRows(tabs, project) {
+  const root = slashes(project).replace(/\/+$/, '');
+  return tabs.filter((tab) => tab?.path).map((tab) => {
+    const path = slashes(tab.path);
+    const inside = root && path.startsWith(`${root}/`) ? path.slice(root.length + 1) : path;
+    const cut = inside.lastIndexOf('/');
+    return { id: path, label: tab.name || inside.slice(cut + 1), detail: cut > 0 ? inside.slice(0, cut) : '' };
+  });
+}
+
+/**
+ * What go-to-file says in place of a list that is empty (an i18n key). An answer that is not in yet is not
+ * "no file": while a search is waiting to be sent or on its way, it says so.
+ * @param {{ rootKnown: boolean, root: string | null, failed: boolean, pending: boolean, typed: string }} s
+ *   `rootKnown`: the folder to search was asked for and answered (`root`: it, or null when there is none);
+ *   `pending`: a search for what is typed has not answered yet; `failed`: the last one did not answer
+ */
+export function fileListEmpty({ rootKnown, root, failed, pending, typed } = {}) {
+  if (rootKnown && !root) return 'editor.palette.noProject';
+  if (!queryTerms(typed).length) return 'editor.palette.typeToSearch';
+  if (pending || !rootKnown) return 'editor.palette.searching';
+  return failed ? 'editor.palette.searchFailed' : 'editor.palette.noFile';
+}