feat: go to line by typing its number (#9)

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

Author: ymansurozer

src/ui/cursor.ts

@@ -157,22 +157,56 @@ function ensureCursor(): Row | undefined {
   return r;
 }
 
-// Land the cursor on a specific rendered line (display space) and center it — used by the
-// blockers jump list. Retries once across two frames so a just-triggered collapsed-region
-// expansion (which rerenders) has laid out its rows.
+// Land the cursor on a specific rendered line (display space) and center it. Context rows merge
+// to a single entry (additions primary, deletions twin in `alt`), so fall back to a line-only
+// match before giving up.
+function landAt(side: Side, line: number): boolean {
+  const list = rows();
+  const r = list.find((x) => matches(x, side, line)) ?? list.find((x) => x.line === line);
+  if (!r) return false;
+  cur = { side: r.side, line: r.line };
+  paint(r);
+  r.el.scrollIntoView({ block: "center" });
+  return true;
+}
+
+// Jump used by the blockers list. Retries once across two frames so a just-triggered
+// collapsed-region expansion (which rerenders) has laid out its rows.
 export function cursorJumpTo(side: Side, line: number) {
-  const land = () => {
-    const list = rows();
-    // Context rows merge to a single entry (additions primary, deletions twin in `alt`), so
-    // fall back to a line-only match before giving up.
-    const r = list.find((x) => matches(x, side, line)) ?? list.find((x) => x.line === line);
-    if (!r) return false;
-    cur = { side: r.side, line: r.line };
-    paint(r);
-    r.el.scrollIntoView({ block: "center" });
-    return true;
-  };
-  if (!land()) requestAnimationFrame(() => requestAnimationFrame(() => land()));
+  if (!landAt(side, line))
+    requestAnimationFrame(() => requestAnimationFrame(() => landAt(side, line)));
+}
+
+// ── Go to line ───────────────────────────────────────────────────────────────
+// Typing digits in the diff accumulates a line number (shown as the goline pill); ↵ or a short
+// idle pause commits the jump, Esc cancels. Commit only moves the cursor — the existing ↵ /
+// ⇧Y / r bindings take over from the landed line, so the jump composes with every verb.
+
+let golineTimer: ReturnType<typeof setTimeout> | undefined;
+
+export function golineActive(): boolean {
+  return !!S.golineBuffer;
+}
+
+export function golineDigit(d: string) {
+  if (!S.golineBuffer && d === "0") return; // a leading 0 can't start a real line number
+  S.golineBuffer += d;
+  clearTimeout(golineTimer);
+  golineTimer = setTimeout(golineCommit, 800);
+}
+
+export function golineCancel() {
+  S.golineBuffer = "";
+  clearTimeout(golineTimer);
+}
+
+export function golineCommit() {
+  const n = parseInt(S.golineBuffer, 10);
+  golineCancel();
+  if (!Number.isFinite(n)) return;
+  // Prefer the additions/new side — the number a reviewer reads off the gutter. No retry:
+  // goline never triggers an expansion, so a miss means the line isn't rendered.
+  if (!landAt("additions", n)) toast(`Line ${n} isn't visible in this diff`);
 }
 
 export function cursorMoveLine(dir: 1 | -1) {

src/ui/index.html

@@ -2192,6 +2192,39 @@
       display: block
     }
 
+    /* Go-to-line pill: mode indicator for pending typed digits (neutral, unlike the green toast). */
+    .goline {
+      position: absolute;
+      left: 50%;
+      bottom: 46px;
+      transform: translateX(-50%);
+      border: 1px solid var(--line-strong);
+      background: var(--panel);
+      color: var(--ink);
+      border-radius: var(--radius-pill);
+      padding: 7px 12px;
+      font-size: var(--text-sm);
+      display: none;
+      align-items: center;
+      gap: 6px
+    }
+
+    .goline.show {
+      display: flex
+    }
+
+    .goline b {
+      color: var(--ink-bright)
+    }
+
+    .goline .goline-hint {
+      color: var(--muted);
+      display: flex;
+      align-items: center;
+      gap: 4px;
+      margin-left: 4px
+    }
+
     @media(max-width:1100px) {
       body {
         overflow: auto
@@ -2436,6 +2469,9 @@
         </div>
       </div>
       <div class="toast" id="toast" :class="{show: $store.g.toastMsg}" x-text="$store.g.toastMsg">saved</div>
+      <div class="goline" :class="{show: $store.g.golineBuffer}">Go to line&nbsp;<b
+          x-text="$store.g.golineBuffer"></b><span class="goline-hint"><kbd>↵</kbd> Jump · <kbd>esc</kbd>
+          Cancel</span></div>
     </main>
   </div>
   <script type="module" src="/ui.js"></script>

src/ui/keys.ts

@@ -7,6 +7,10 @@ import {
   cursorComment,
   cursorVerdict,
   cursorResolve,
+  golineActive,
+  golineDigit,
+  golineCommit,
+  golineCancel,
 } from "./cursor";
 
 // ── Central keyboard map ─────────────────────────────────────────────────────
@@ -20,10 +24,11 @@ type Hotkey = {
   desc: string;
   group: Group;
   test: (e: KeyboardEvent) => boolean;
-  run: () => void;
+  run: (e: KeyboardEvent) => void;
   when?: () => boolean; // scope guard (default: anywhere not typing)
   typing?: boolean; // also fires while typing in the composer
   hide?: boolean; // omit from the help overlay
+  goline?: boolean; // part of the go-to-line gesture — doesn't cancel a pending digit buffer
 };
 
 // Scopes
@@ -48,6 +53,10 @@ const cmdShift = (key: string) => (e: KeyboardEvent) =>
 
 // Esc cascade: close the topmost transient surface.
 function escape() {
+  if (golineActive()) {
+    golineCancel();
+    return;
+  }
   if (S.confirmMsg) {
     S.confirmMsg = "";
     return;
@@ -175,6 +184,15 @@ const HOTKEYS: Hotkey[] = [
     run: () => cursorMoveHunk(-1),
     hide: true,
   },
+  {
+    combo: "1–9",
+    desc: "Go to line (↵ jump, esc cancel)",
+    group: "Navigate",
+    test: (e) => /^[0-9]$/.test(e.key) && !e.metaKey && !e.ctrlKey && !e.altKey,
+    when: inDiff,
+    run: (e) => golineDigit(e.key),
+    goline: true,
+  },
   {
     combo: "o",
     desc: "Overview",
@@ -191,6 +209,17 @@ const HOTKEYS: Hotkey[] = [
     when: inOverview,
     run: () => S.startGuided?.(),
   },
+  // Goline commit must outrank "comment on line" while digits are pending — same key, same scope.
+  {
+    combo: "↵",
+    desc: "Jump to typed line",
+    group: "Navigate",
+    test: enter,
+    when: () => inDiff() && golineActive(),
+    run: () => golineCommit(),
+    goline: true,
+    hide: true,
+  },
   // Comment
   {
     combo: "↵",
@@ -320,7 +349,8 @@ const HOTKEYS: Hotkey[] = [
     group: "App",
     test: (e) => e.key === "Escape",
     typing: true,
-    run: escape,
+    run: escape, // cancels pending goline digits first (see escape()), so no dispatcher pre-cancel
+    goline: true,
   },
 ];
 
@@ -336,8 +366,11 @@ export function installKeys() {
       if (!h.test(e)) continue;
       if (typing && !h.typing) continue;
       if (h.when && !h.when()) continue;
+      // Any other action abandons pending goline digits — otherwise the idle timer would
+      // yank the cursor away ~800ms after e.g. a j/⇧Y that already moved on.
+      if (!h.goline) golineCancel();
       e.preventDefault();
-      h.run();
+      h.run(e);
       return;
     }
   });

src/ui/store.ts

@@ -24,6 +24,7 @@ export const S: Store = Alpine.reactive<Store>({
   composerOpen: false,
   popoverOpen: false,
   toastMsg: "",
+  golineBuffer: "",
   composerTitle: "New line",
   composerBody: "",
   editingCommentId: null,

src/ui/types.ts

@@ -164,6 +164,9 @@ export interface Store {
   composerOpen: boolean;
   popoverOpen: boolean;
   toastMsg: string;
+  // Pending "go to line" digits typed in the diff ("" = inactive). Drives the goline pill;
+  // ↵ / idle timeout commits the jump, Esc cancels (see cursor.ts goline section).
+  golineBuffer: string;
   composerTitle: string;
   composerBody: string;
   editingCommentId: string | null;