moontide-mcp 2.0.2 → 2.2.0

package/page/ask-view.js

@@ -1,12 +1,13 @@
 // The Ask Claude box's DOM: the small box a right-click opens near the pointer, its
-// chips, its field, its message line, the top-bar request status and the top-bar page-requests
+// chips, its field, its message line and the top-bar page-requests
 // status (whether page requests reach Claude live) with its (i) button and the
 // short popover the (i) opens, and a refused page token on the top-bar error line as soon as the
 // server says so. Every text reaches the page through
 // textContent, title, placeholder or setAttribute, never as markup: the chips carry names and code
 // written by a person or by Claude. No DOM access at import time: main.js calls createAskView() with
-// its document and a send function. The pure rules (copy, limits, placement, status timing) live in
-// page/ask.js.
+// its document and a send function. The pure rules (copy, limits, placement) live in page/ask.js. What became of
+// each request is the Requests list's business (page/request-status-view.js): this module hands every request and
+// every answer to the request tracker, and shows only the line under the Parts button.
 
 import {
   ASK_COPY,
@@ -16,9 +17,9 @@ import {
   pageRequestsText,
   askMessage,
   askTextProblem,
-  createAskStatus,
   cutText,
   describeContext,
+  fitGestureToLine,
   fitMomentToLine,
   newAskId,
   partsAskState,
@@ -31,21 +32,17 @@ import {
  * Creates the box controller. `document` is the page's document (named so on purpose: every element
  * lookup below reads `document.getElementById`, the shape test/page-hidden.test.js scans); `send`
  * sends one JSON-able message to the server; `reportError` and `clearError` write and clear the
- * top-bar error line; `setTimer`, `clearTimer` and `now` are the page's clock; `fit` is the top bar's fit step, run
- * after the status changes because a new text changes the bar's width (a ResizeObserver does not fire for content
- * growing inside a full bar).
+ * top-bar error line; `setTimer`, `clearTimer` and `now` are the page's clock. `requests` is the per-request tracker
+ * of page/request-status.js: every request sent is handed to it, and so is every server answer to one. The tracker
+ * tells the page (main.js) when a request was never confirmed; the page then calls `notConfirmed(id)` here.
  */
-export function createAskView({ document, send, reportError, clearError, setTimer, clearTimer, now, fit }) {
+export function createAskView({ document, send, reportError, clearError, setTimer, clearTimer, now, requests }) {
   const askBox = document.getElementById('ask-box');
   const askContextChip = document.getElementById('ask-context-chip');
   const askCurrentChip = document.getElementById('ask-current-chip');
   const askField = document.getElementById('ask-field');
   const askMessageEl = document.getElementById('ask-message');
   const askHint = document.getElementById('ask-hint');
-  const askStatus = document.getElementById('ask-status');
-  // The status holds its long sentence and a short form (shown at fit step 3, aria-hidden).
-  const askLong = askStatus === null ? null : askStatus.querySelector('.ask-long');
-  const askShort = askStatus === null ? null : askStatus.querySelector('.ask-short');
   const partsAsk = document.getElementById('parts-ask');
   const partsAskStatus = document.getElementById('parts-ask-status');
   const pageRequests = document.getElementById('page-requests');
@@ -59,9 +56,6 @@ export function createAskView({ document, send, reportError, clearError, setTime
     !askField ||
     !askMessageEl ||
     !askHint ||
-    !askStatus ||
-    !askLong ||
-    !askShort ||
     !partsAsk ||
     !partsAskStatus ||
     !pageRequests ||
@@ -71,8 +65,8 @@ export function createAskView({ document, send, reportError, clearError, setTime
   ) {
     throw new Error('Moontide: the Ask Claude markup is missing from the page.');
   }
-  if (typeof fit !== 'function') {
-    throw new Error('Moontide: createAskView needs the top bar\'s fit function.');
+  if (requests === undefined || typeof requests.sent !== 'function' || typeof requests.serverMessage !== 'function') {
+    throw new Error('Moontide: createAskView needs the request tracker.');
   }
 
   // The field's description lists the message line only while it shows, so it is never empty.
@@ -119,7 +113,8 @@ export function createAskView({ document, send, reportError, clearError, setTime
   // The version id the top bar shows, or null before any version.
   let currentVersion = null;
   // What the right-click pointed at, snapshotted when the box opened: { context, chip } and, when the
-  // Timeline showed the music there, the moment captured at the click.
+  // Timeline showed the music there, the moment captured at the click, and, when a gesture on a note opened the box,
+  // that gesture; for a range, the cycles it was cut to when the pointer left the page (`rangeCut`).
   let snapshot = null;
   // The last request sent: { id, text }, so an accepted request clears its own draft.
   let lastSent = null;
@@ -137,36 +132,10 @@ export function createAskView({ document, send, reportError, clearError, setTime
   // The side the box opened on (above the pointer or below), kept while its height changes; null
   // means choose again.
   let placedAbove = null;
-  // The Parts view's button: whether the code has no sections (so the button shows), the id of its
-  // request while it waits for Claude to take it, and the top-bar status text now on screen.
+  // The Parts view's button: whether the code has no sections (so the button shows) and the id of its
+  // request while it waits for Claude to take it.
   let partsAvailable = false;
   let partsPendingId = null;
-  let statusText = null;
-
-  const status = createAskStatus({
-    render: (text, short) => {
-      statusText = text;
-      askLong.textContent = text ?? '';
-      askShort.textContent = short ?? '';
-      askStatus.hidden = text === null;
-      fit();
-      renderPartsAsk();
-    },
-    onTimeout: (id) => {
-      reportError(ASK_COPY.didNotConfirm);
-      if (id === partsPendingId) {
-        // The canned request needs no draft: the button just comes back.
-        partsPendingId = null;
-        renderPartsAsk();
-        return;
-      }
-      notSent = true;
-      renderMessage();
-    },
-    setTimer,
-    clearTimer,
-    now,
-  });
 
   /** The fields of the request the box would send for `text` (trimmed), the id measured with the next one's shape. */
   function requestFields(text) {
@@ -177,6 +146,7 @@ export function createAskView({ document, send, reportError, clearError, setTime
       chip: snapshot.chip,
       current: currentVersion,
       moment: snapshot.moment,
+      gesture: snapshot.gesture,
     };
   }
 
@@ -189,7 +159,7 @@ export function createAskView({ document, send, reportError, clearError, setTime
   function renderMessage() {
     const length = askField.value.trim().length;
     const tooLongLine = lineTooLong();
-    const text = askMessage({ connected, length, notSent, tokenRefused, lineTooLong: tooLongLine });
+    const text = askMessage({ connected, length, notSent, tokenRefused, lineTooLong: tooLongLine, rangeCut: snapshot === null ? null : (snapshot.rangeCut ?? null) });
     askMessageEl.textContent = text ?? '';
     askMessageEl.hidden = text === null;
     askField.setAttribute('aria-describedby', askMessageEl.hidden ? DESCRIBED_WITHOUT_MESSAGE : DESCRIBED_WITH_MESSAGE);
@@ -199,6 +169,14 @@ export function createAskView({ document, send, reportError, clearError, setTime
     refit();
   }
 
+  /** The state phrase of the Parts request's row in the Requests list, or null when it has no row. */
+  function partsRowPhrase() {
+    if (partsPendingId === null) return null;
+    const model = requests.model();
+    const row = [...model.rows, ...model.recent].find((candidate) => candidate.id === partsPendingId);
+    return row === undefined ? null : row.phrase;
+  }
+
   /** The Parts button and the line under it, from partsAskState. */
   function renderPartsAsk() {
     partsAsk.hidden = !partsAvailable;
@@ -207,7 +185,7 @@ export function createAskView({ document, send, reportError, clearError, setTime
       partsAskStatus.hidden = true;
       return;
     }
-    const state = partsAskState({ connected, pending: partsPendingId !== null, statusText });
+    const state = partsAskState({ connected, pending: partsPendingId !== null, statusText: partsRowPhrase() });
     partsAsk.disabled = state.disabled;
     partsAskStatus.textContent = state.line ?? '';
     partsAskStatus.hidden = state.line === null;
@@ -264,13 +242,17 @@ export function createAskView({ document, send, reportError, clearError, setTime
   /**
    * Puts a prefill in the field (a failed change sent to Claude). An empty field is simply filled. A field that
    * already holds a draft keeps it: the prefill follows after a blank line, cut so the whole field stays within
-   * MAX_ASK_TEXT_LENGTH. The caret goes to the end so the user types the question after it. When the draft leaves no
-   * room at all, the draft stays as it is (the chip still names the error).
+   * MAX_ASK_TEXT_LENGTH, and is not added again when the draft already ends with it. The caret goes to the end so the
+   * user types the question after it. When the draft leaves no room at all, the draft stays as it is (the chip still
+   * names the error).
    */
   function applyPrefill(prefill) {
     const draft = askField.value;
     if (draft === '') {
       askField.value = prefill;
+    } else if (draft.endsWith(prefill)) {
+      // The request is already there (the same target was asked about twice, or the browser raised a right-click after
+      // a key press that had already opened the box): it is not added a second time.
     } else {
       const room = MAX_ASK_TEXT_LENGTH - draft.length - 2;
       if (room < 1) return;
@@ -284,8 +266,8 @@ export function createAskView({ document, send, reportError, clearError, setTime
    * `{ prefill }` the field also receives that text (see applyPrefill); without it nothing about the field changes.
    */
   function open(descriptor, point, { prefill } = {}) {
-    const { context, chip, moment } = describeContext(descriptor);
-    snapshot = moment === undefined ? { context, chip } : { context, chip, moment };
+    const { context, chip, moment, gesture, rangeCut } = describeContext(descriptor);
+    snapshot = { context, chip, ...(moment === undefined ? {} : { moment }), ...(gesture === undefined ? {} : { gesture }), ...(rangeCut === undefined ? {} : { rangeCut }) };
     askContextChip.textContent = chip;
     askContextChip.setAttribute('title', chip);
     const wasHidden = askBox.hidden;
@@ -327,12 +309,17 @@ export function createAskView({ document, send, reportError, clearError, setTime
     const frame = { type: 'ask', id, text, context: describedContext.context, chip: describedContext.chip, current: currentVersion };
     // The moment rides after `current`, and only when there is one: a frame without it is as it always was.
     // Notes come off its end until the whole line fits what the server takes (the rest counts in `more`).
-    const moment = fitMomentToLine({ ...frame, moment: describedContext.moment });
+    const fields = { ...frame, moment: describedContext.moment, gesture: describedContext.gesture };
+    const moment = fitMomentToLine(fields);
     if (moment !== undefined) frame.moment = moment;
+    // The gesture follows the moment, and only when the box was opened by one. The notes of a range gesture come off its end the
+    // same way; any other gesture is sent as it is.
+    const gesture = fitGestureToLine({ ...fields, moment });
+    if (gesture !== undefined) frame.gesture = gesture;
     send(frame);
     // While the token is refused the line stays: the server's 'token' refusal writes it again, so it never blinks off.
     if (!authRefused) clearError();
-    status.sent(id);
+    requests.sent(id, { text, chip: describedContext.chip });
     return id;
   }
 
@@ -358,6 +345,8 @@ export function createAskView({ document, send, reportError, clearError, setTime
       // The History view must never see this Enter, even after focus moves back to a row.
       event.preventDefault();
       event.stopPropagation();
+      // A held key that opened the box (the auto-repeat lands here once focus has moved) must not also send what is in it.
+      if (event.repeat) return;
       submit();
     } else if (event.key === 'Escape') {
       // Esc closes the box only, never an open view.
@@ -464,13 +453,13 @@ export function createAskView({ document, send, reportError, clearError, setTime
       return;
     }
     if (msg.type === 'ask-received') {
-      status.handedOver(msg.ids);
+      requests.serverMessage(msg);
       if (partsPendingId !== null && msg.ids.includes(partsPendingId)) partsPendingId = null;
       renderPartsAsk();
       return;
     }
     if (msg.type !== 'ask-result') return;
-    status.answered(msg);
+    requests.serverMessage(msg);
     const fromParts = msg.id === partsPendingId;
     if (msg.status === 'refused') {
       reportError(refusalText(msg.reason, msg.detail));
@@ -491,10 +480,25 @@ export function createAskView({ document, send, reportError, clearError, setTime
     renderPartsAsk();
   }
 
+  /**
+   * The tracker gave up on request `id`: the server never confirmed it, or the connection closed first. The error line
+   * says so, and the draft comes back (or, for the Parts button's canned request, the button is released).
+   */
+  function notConfirmed(id) {
+    reportError(ASK_COPY.didNotConfirm);
+    if (id === partsPendingId) {
+      // The canned request needs no draft: the button just comes back.
+      partsPendingId = null;
+      renderPartsAsk();
+      return;
+    }
+    notSent = true;
+    renderMessage();
+  }
+
   function setConnected(state) {
     connected = state === 'connected';
     if (state === 'disconnected') {
-      status.dropAll();
       partsPendingId = null;
       // The state is unknown once the socket is gone (the page does not reconnect by itself).
       pageRequests.hidden = true;
@@ -529,5 +533,8 @@ export function createAskView({ document, send, reportError, clearError, setTime
     setCurrentVersion,
     setPartsAvailable,
     onServerMessage,
+    notConfirmed,
+    /** Draws the line under the Parts button again from its request's row; the page calls it after every tracker change. */
+    refreshPartsLine: () => renderPartsAsk(),
   };
 }