revspec 0.2.1 → 0.3.0

package/src/tui/app.ts

@@ -13,10 +13,10 @@ import { mergeJsonlIntoReview } from "../protocol/live-merge";
 import type { Thread } from "../protocol/types";
 import { ReviewState } from "../state/review-state";
 import { createLiveWatcher, type LiveWatcher } from "./live-watcher";
-import { buildPagerContent, createPager, togglePagerMode, ensureLineMode, type PagerComponents } from "./pager";
+import { buildPagerNodes, createPager, countExtraVisualLines, type PagerComponents } from "./pager";
 import {
-  buildTopBarText,
-  buildBottomBarText,
+  buildTopBar,
+  buildBottomBar,
   createTopBar,
   createBottomBar,
   type TopBarComponents,
@@ -32,7 +32,8 @@ import { createHelp } from "./help";
 export async function runTui(
   specFile: string,
   reviewPath: string,
-  draftPath: string
+  draftPath: string,
+  version?: string
 ): Promise<void> {
   // 1. Read spec file into lines
   const specContent = readFileSync(specFile, "utf8");
@@ -99,21 +100,20 @@ export async function runTui(
     useMouse: false,
   });
 
-  // 6. Build layout: top bar, pager, bottom bar in a column
+  // 6. Build layout (opencode pattern): flex column, scrollbox fills middle
   const rootBox = new BoxRenderable(renderer, {
-    width: "100%",
-    height: "100%",
+    flexGrow: 1,
     flexDirection: "column",
+    width: "100%",
   });
 
   const topBar: TopBarComponents = createTopBar(renderer);
   const pager: PagerComponents = createPager(renderer);
   const bottomBar: BottomBarComponents = createBottomBar(renderer);
 
-  rootBox.add(topBar.bar);
+  rootBox.add(topBar.box);
   rootBox.add(pager.scrollBox);
-  rootBox.add(bottomBar.bar);
-
+  rootBox.add(bottomBar.box);
   renderer.root.add(rootBox);
 
   // 7. Initial render
@@ -126,13 +126,9 @@ export async function runTui(
       }
     } catch {}
 
-    if (pager.mode === "line") {
-      pager.lineNode.content = buildPagerContent(state, searchQuery, state.unreadThreadIds);
-    } else {
-      pager.markdownNode.content = state.specLines.join("\n");
-    }
-    topBar.bar.content = buildTopBarText(specFile, state, state.unreadCount(), specMtimeChanged, pager.mode);
-    bottomBar.bar.content = buildBottomBarText(commandBuffer);
+    buildPagerNodes(pager.lineNode, state, searchQuery, state.unreadThreadIds);
+    buildTopBar(topBar, specFile, state, state.unreadCount(), specMtimeChanged);
+    buildBottomBar(bottomBar, commandBuffer);
     renderer.requestRender();
   }
 
@@ -200,6 +196,8 @@ export async function runTui(
 
   function mergeAndExit(resolve: () => void): void {
     doMerge();
+    // Signal to watch process that session has ended
+    appendEvent(jsonlPath, { type: "session-end", author: "reviewer", ts: Date.now() });
     liveWatcher.stop();
     renderer.destroy();
     resolve();
@@ -207,9 +205,9 @@ export async function runTui(
 
   // Helper: scroll pager to ensure cursor line is visible
   function ensureCursorVisible(): void {
-    // Each line in the pager is 1 row of text.
-    // The cursor line index (0-based) in the pager is (state.cursorLine - 1).
-    const cursorRow = state.cursorLine - 1;
+    // Map spec line to visual row, accounting for table border extra lines
+    const extra = countExtraVisualLines(state.specLines, state.cursorLine - 1);
+    const cursorRow = state.cursorLine - 1 + extra;
     const viewportHeight = Math.max(1, renderer.height - 2); // minus top + bottom bar
 
     const currentScroll = pager.scrollBox.scrollTop;
@@ -231,7 +229,7 @@ export async function runTui(
     if (cmd === "w") {
       // Merge JSONL -> JSON, stay open
       doMerge();
-      bottomBar.bar.content = " \u2714 Merged to review JSON";
+      bottomBar.text.content = " \u2714 Merged to review JSON";
       renderer.requestRender();
       setTimeout(() => { refreshPager(); }, 1200);
       return "stay";
@@ -244,16 +242,18 @@ export async function runTui(
     if (cmd === "q") {
       // Exit only if merged (no pending changes)
       if (hasPendingChanges()) {
-        bottomBar.bar.content = " Unmerged changes. Use :w to save or :q! to discard";
+        bottomBar.text.content = " Unmerged changes. Use :w to save or :q! to discard";
         renderer.requestRender();
         setTimeout(() => { refreshPager(); }, 2000);
         return "stay";
       }
+      appendEvent(jsonlPath, { type: "session-end", author: "reviewer", ts: Date.now() });
       liveWatcher.stop();
       return "exit";
     }
     if (cmd === "q!") {
       // Exit without merging
+      appendEvent(jsonlPath, { type: "session-end", author: "reviewer", ts: Date.now() });
       liveWatcher.stop();
       return "exit";
     }
@@ -263,7 +263,7 @@ export async function runTui(
   // --- Overlay launchers ---
 
   function showCommentInput(): void {
-    const existingThread = state.threadAtLine(state.cursorLine);
+    let existingThread = state.threadAtLine(state.cursorLine);
 
     const overlay = createCommentInput({
       renderer,
@@ -278,13 +278,19 @@ export async function runTui(
           refreshPager();
           // Don't dismiss — overlay stays open, message appended by comment-input
         } else {
-          // New comment — close overlay
+          // New comment — create thread, stay open
           state.addComment(state.cursorLine, text);
           const newThread = state.threadAtLine(state.cursorLine);
           if (newThread) {
             appendEvent(jsonlPath, { type: "comment", threadId: newThread.id, line: state.cursorLine, author: "reviewer", text, ts: Date.now() });
+            // Update overlay to reference the new thread
+            if (activeOverlay) {
+              activeOverlay.threadId = newThread.id;
+              activeOverlay.container.title = ` Thread #${newThread.id} (line ${state.cursorLine}) `;
+            }
+            existingThread = newThread;
           }
-          dismissOverlay();
+          refreshPager();
         }
       },
       onResolve: () => {
@@ -344,6 +350,7 @@ export async function runTui(
   function showHelpOverlay(): void {
     const overlay = createHelp({
       renderer,
+      version: version ?? "?",
       onClose: () => {
         dismissOverlay();
       },
@@ -447,29 +454,19 @@ export async function runTui(
       switch (key.name) {
         case "j":
         case "down": {
-          if (pager.mode === "markdown") {
-            pager.scrollBox.scrollBy(1);
-            renderer.requestRender();
-          } else {
-            if (state.cursorLine < state.lineCount) {
-              state.cursorLine++;
-              ensureCursorVisible();
-              refreshPager();
-            }
+          if (state.cursorLine < state.lineCount) {
+            state.cursorLine++;
+            ensureCursorVisible();
+            refreshPager();
           }
           break;
         }
         case "k":
         case "up": {
-          if (pager.mode === "markdown") {
-            pager.scrollBox.scrollBy(-1);
-            renderer.requestRender();
-          } else {
-            if (state.cursorLine > 1) {
-              state.cursorLine--;
-              ensureCursorVisible();
-              refreshPager();
-            }
+          if (state.cursorLine > 1) {
+            state.cursorLine--;
+            ensureCursorVisible();
+            refreshPager();
           }
           break;
         }
@@ -478,17 +475,11 @@ export async function runTui(
           if (key.ctrl) {
             if (deletePendingTimer) { clearTimeout(deletePendingTimer); deletePendingTimer = null; }
             const half = Math.max(1, Math.floor(pageSize() / 2));
-            if (pager.mode === "markdown") {
-              pager.scrollBox.scrollBy(half);
-              renderer.requestRender();
-            } else {
-              state.cursorLine = Math.min(state.cursorLine + half, state.lineCount);
-              ensureCursorVisible();
-              refreshPager();
-            }
+            state.cursorLine = Math.min(state.cursorLine + half, state.lineCount);
+            ensureCursorVisible();
+            refreshPager();
           } else {
             // d without ctrl — delete draft comment (dd = double-tap within 500ms)
-            ensureLineMode(pager);
             refreshPager();
             const thread = state.threadAtLine(state.cursorLine);
             if (!thread) break;
@@ -501,17 +492,17 @@ export async function runTui(
                 state.deleteLastDraftMessage(thread.id);
                 appendEvent(jsonlPath, { type: "delete", threadId: thread.id, author: "reviewer", ts: Date.now() });
                 refreshPager();
-                bottomBar.bar.content = " \u2714 Deleted draft comment";
+                bottomBar.text.content = " \u2714 Deleted draft comment";
                 renderer.requestRender();
                 setTimeout(() => { refreshPager(); }, 1500);
               } else {
-                bottomBar.bar.content = " No reviewer message to delete";
+                bottomBar.text.content = " No reviewer message to delete";
                 renderer.requestRender();
                 setTimeout(() => { refreshPager(); }, 1500);
               }
             } else {
               // First d — show hint and start timer
-              bottomBar.bar.content = " Press d again to delete";
+              bottomBar.text.content = " Press d again to delete";
               renderer.requestRender();
               deletePendingTimer = setTimeout(() => {
                 deletePendingTimer = null;
@@ -525,14 +516,9 @@ export async function runTui(
           // Ctrl+U — half page up
           if (key.ctrl) {
             const half = Math.max(1, Math.floor(pageSize() / 2));
-            if (pager.mode === "markdown") {
-              pager.scrollBox.scrollBy(-half);
-              renderer.requestRender();
-            } else {
-              state.cursorLine = Math.max(state.cursorLine - half, 1);
-              ensureCursorVisible();
-              refreshPager();
-            }
+            state.cursorLine = Math.max(state.cursorLine - half, 1);
+            ensureCursorVisible();
+            refreshPager();
           }
           break;
         }
@@ -545,7 +531,7 @@ export async function runTui(
                 ensureCursorVisible();
               }
             } else {
-              bottomBar.bar.content = " No active search \u2014 use / to search";
+              bottomBar.text.content = " No active search \u2014 use / to search";
               renderer.requestRender();
               setTimeout(() => { refreshPager(); }, 1500);
             }
@@ -558,7 +544,7 @@ export async function runTui(
                 ensureCursorVisible();
               }
             } else {
-              bottomBar.bar.content = " No active search \u2014 use / to search";
+              bottomBar.text.content = " No active search \u2014 use / to search";
               renderer.requestRender();
               setTimeout(() => { refreshPager(); }, 1500);
             }
@@ -566,40 +552,16 @@ export async function runTui(
           refreshPager();
           break;
         }
-        case "m": {
-          // Toggle markdown / line mode with scroll position sync
-          const wasMarkdown = pager.mode === "markdown";
-          togglePagerMode(pager);
-          if (wasMarkdown) {
-            // Markdown -> Line: sync scroll position to cursor
-            state.cursorLine = Math.max(1, pager.scrollBox.scrollTop + 1);
-            refreshPager();
-            ensureCursorVisible();
-          } else {
-            // Line -> Markdown: approximate scroll to cursor position
-            refreshPager();
-            pager.scrollBox.scrollTo(state.cursorLine - 1);
-            renderer.requestRender();
-          }
-          break;
-        }
         case "c": {
-          // Comment: new or reply — auto-switch to line mode
-          ensureLineMode(pager);
-          refreshPager();
           showCommentInput();
           break;
         }
         case "l": {
           // Thread list
-          ensureLineMode(pager);
-          refreshPager();
           showThreadListOverlay();
           break;
         }
         case "r": {
-          ensureLineMode(pager);
-          refreshPager();
           if (!key.shift) {
             // Resolve thread at cursor
             const thread = state.threadAtLine(state.cursorLine);
@@ -612,7 +574,7 @@ export async function runTui(
               const msg = wasResolved
                 ? ` \u21a9 Reopened thread #${thread.id}`
                 : ` \u2714 Resolved thread #${thread.id}`;
-              bottomBar.bar.content = msg;
+              bottomBar.text.content = msg;
               renderer.requestRender();
               setTimeout(() => { refreshPager(); }, 1500);
             }
@@ -625,7 +587,7 @@ export async function runTui(
               appendEvent(jsonlPath, { type: "resolve", threadId: t.id, author: "reviewer", ts: Date.now() });
             }
             refreshPager();
-            bottomBar.bar.content = ` \u2714 Resolved ${pending} pending thread(s)`;
+            bottomBar.text.content = ` \u2714 Resolved ${pending} pending thread(s)`;
             renderer.requestRender();
             setTimeout(() => { refreshPager(); }, 1500);
           }
@@ -633,29 +595,19 @@ export async function runTui(
         }
         case "g": {
           if (key.shift) {
-            // G (shift+g) — go to last line / scroll to bottom
-            if (pager.mode === "markdown") {
-              pager.scrollBox.scrollTo(pager.scrollBox.scrollHeight);
-              renderer.requestRender();
-            } else {
-              state.cursorLine = state.lineCount;
-              ensureCursorVisible();
-              refreshPager();
-            }
+            // G (shift+g) — go to last line
+            state.cursorLine = state.lineCount;
+            ensureCursorVisible();
+            refreshPager();
           } else {
             // g — first of gg sequence
             if (gPendingTimer) {
-              // Second g within 500ms — go to first line / scroll to top
+              // Second g within 500ms — go to first line
               clearTimeout(gPendingTimer);
               gPendingTimer = null;
-              if (pager.mode === "markdown") {
-                pager.scrollBox.scrollTo(0);
-                renderer.requestRender();
-              } else {
-                state.cursorLine = 1;
-                ensureCursorVisible();
-                refreshPager();
-              }
+              state.cursorLine = 1;
+              ensureCursorVisible();
+              refreshPager();
             } else {
               gPendingTimer = setTimeout(() => {
                 gPendingTimer = null;
@@ -666,8 +618,6 @@ export async function runTui(
         }
         case "a": {
           // Approve
-          ensureLineMode(pager);
-          refreshPager();
           if (state.canApprove()) {
             const confirmOverlay = createConfirm({
               renderer,
@@ -691,7 +641,7 @@ export async function runTui(
               total === 0
                 ? "No threads to approve"
                 : `${total} thread${total !== 1 ? "s" : ""} still open/pending`;
-            bottomBar.bar.content = ` \u26a0  ${msg}`;
+            bottomBar.text.content = ` \u26a0  ${msg}`;
             renderer.requestRender();
             setTimeout(() => {
               refreshPager();
@@ -744,7 +694,7 @@ export async function runTui(
           // Check for "]" or "[" to start bracket sequence
           if (key.sequence === "]") {
             bracketPending = "]";
-            bottomBar.bar.content = " ]...";
+            bottomBar.text.content = " ]...";
             renderer.requestRender();
             bracketPendingTimer = setTimeout(() => {
               bracketPending = null;
@@ -755,7 +705,7 @@ export async function runTui(
           }
           if (key.sequence === "[") {
             bracketPending = "[";
-            bottomBar.bar.content = " [...";
+            bottomBar.text.content = " [...";
             renderer.requestRender();
             bracketPendingTimer = setTimeout(() => {
               bracketPending = null;

package/src/tui/comment-input.ts

@@ -28,89 +28,12 @@ export interface CommentInputOverlay {
 
 export function createCommentInput(opts: CommentInputOptions): CommentInputOverlay {
   const { renderer, line, existingThread, onSubmit, onResolve, onCancel } = opts;
-  const hasThread = existingThread && existingThread.messages.length > 0;
-
-  if (!hasThread) {
-    return createNewComment(renderer, line, onSubmit, onCancel);
-  }
-  return createThreadView(renderer, line, existingThread!, onSubmit, onResolve, onCancel);
-}
-
-// --- New comment: insert-only buffer, Tab submits and closes ---
-function createNewComment(
-  renderer: CliRenderer,
-  line: number,
-  onSubmit: (text: string) => void,
-  onCancel: () => void,
-): CommentInputOverlay {
-  const container = new BoxRenderable(renderer, {
-    position: "absolute",
-    top: "30%",
-    left: "10%",
-    width: "80%",
-    height: 10,
-    zIndex: 100,
-    backgroundColor: theme.base,
-    border: true,
-    borderStyle: "single",
-    borderColor: theme.borderComment,
-    title: ` New comment on line ${line} `,
-    flexDirection: "column",
-    padding: 1,
-  });
-
-  const textarea = new TextareaRenderable(renderer, {
-    width: "100%",
-    flexGrow: 1,
-    backgroundColor: theme.surface0,
-    textColor: theme.text,
-    focusedBackgroundColor: theme.surface0,
-    focusedTextColor: theme.text,
-    wrapMode: "word",
-    placeholder: "Type your comment...",
-    placeholderColor: theme.overlay,
-    initialValue: "",
-  });
-
-  const hint = new TextRenderable(renderer, {
-    content: " [Tab] submit  [Esc] cancel",
-    width: "100%",
-    height: 1,
-    fg: theme.hintFg,
-    bg: theme.hintBg,
-    wrapMode: "none",
-    truncate: true,
-  });
-
-  container.add(textarea);
-  container.add(hint);
-  setTimeout(() => { textarea.focus(); renderer.requestRender(); }, 0);
-
-  let submitted = false;
-  const keyHandler = (key: KeyEvent) => {
-    if (key.name === "escape") {
-      key.preventDefault(); key.stopPropagation(); onCancel(); return;
-    }
-    if (key.name === "tab") {
-      key.preventDefault(); key.stopPropagation();
-      if (submitted) return;
-      submitted = true;
-      const text = textarea.plainText.trim();
-      if (text.length > 0) onSubmit(text); else onCancel();
-      return;
-    }
-  };
-  renderer.keyInput.on("keypress", keyHandler);
-
-  return {
-    container,
-    cleanup() { renderer.keyInput.off("keypress", keyHandler); textarea.destroy(); },
-    addMessage() {},
-    threadId: null,
-  };
+  // Always use thread view — even for new comments (empty history, just the input)
+  const thread = existingThread ?? { id: "", line, status: "open" as const, messages: [] };
+  return createThreadView(renderer, line, thread, onSubmit, onResolve, onCancel);
 }
 
-// --- Thread view: two modes (normal/insert), unified buffer ---
+// --- Unified thread view: works for both new comments and existing threads ---
 function createThreadView(
   renderer: CliRenderer,
   line: number,
@@ -130,7 +53,7 @@ function createThreadView(
     border: true,
     borderStyle: "single",
     borderColor: theme.borderComment,
-    title: ` Thread #${thread.id} (line ${line}) `,
+    title: thread.id ? ` Thread #${thread.id} (line ${line}) ` : ` New comment on line ${line} `,
     flexDirection: "column",
     padding: 1,
   });

package/src/tui/help.ts

@@ -18,11 +18,14 @@ export interface HelpOverlay {
  */
 export function createHelp(opts: {
   renderer: CliRenderer;
+  version: string;
   onClose: () => void;
 }): HelpOverlay {
-  const { renderer, onClose } = opts;
+  const { renderer, version, onClose } = opts;
 
   const helpText = [
+    "",
+    `  revspec v${version}`,
     "",
     "  Navigation",
     "  j/k       Down/up",
@@ -35,10 +38,7 @@ export function createHelp(opts: {
     "  ]t/[t     Next/prev thread",
     "  ]r/[r     Next/prev unread thread",
     "",
-    "  View",
-    "  m         Toggle markdown / line mode",
-    "",
-    "  Review (switches to line mode)",
+    "  Review",
     "  c         Comment / view thread / reply",
     "  r         Resolve thread",
     "  R         Resolve all pending",