Public: anyone can read this; the crew can change it.
A long diff's "N more files not shown" is one plain muted line, not a boxed card #9993
Check · Review · Land · Live done — Landed and live in production.
mason/forge:mason/9988-a-long-diff-s-n-more-files-not-shown-is → main 3 commits fork 1 thread · 1 unresolved
4 files
changed +20
−3
docs/design/areas/diff.md +1 −1
| @@ -10,7 +10,7 @@ file. | ||
| 10 | 10 | - `.diff-stat` — a file's `+`/`−` line counts, in the head and in a stub. |
| 11 | 11 | - `.diff-body` — the file's contents under its head: scrolls sideways for long lines, hidden once the file is marked viewed. |
| 12 | 12 | - `.diff-table` — the table of hunks and rows inside the body, monospace at 12.5px. |
| 13 | - `.diff-note` — a centred muted line in place of rows: a binary file, no content changes, or files past the cap not shown. | |
| 13 | - `.diff-note` — a centred muted line in place of rows: a binary file or no content changes. Files past the cap are not a `.diff-note`: the cut is a plain `p.muted.small` line under the last file, with its own 12px top margin. | |
| 14 | 14 | - `.diff-stub` — a `.diff-note` for a file too large or generated to draw: why, its real counts and a View file button. |
| 15 | 15 | - `.dn-comment` — a line number in the gutter that links to commenting on that line, when the diff is reviewable. |
| 16 | 16 | - `.nonl` — the `↵` mark after a line that has no newline at the end of the file. |
src/web/diff-view.ts +2 −2
| @@ -587,10 +587,10 @@ export function renderDiff( | ||
| 587 | 587 | ${when( |
| 588 | 588 | hidden > 0, |
| 589 | 589 | () => |
| 590 | html`<div class="card diff-note"> | |
| 590 | html`<p class="muted small"> | |
| 591 | 591 | ${hidden.toLocaleString()} more ${hidden === 1 ? "file" : "files"} not |
| 592 | 592 | shown. |
| 593 | </div>`, | |
| 593 | </p>`, | |
| 594 | 594 | )} |
| 595 | 595 | </div>`; |
| 596 | 596 | } |
src/web/style/content.ts +1
| @@ -562,6 +562,7 @@ form.inline { display: inline; margin-left: auto; } | ||
| 562 | 562 | } |
| 563 | 563 | .diff-stat .add { color: var(--add-fg); } |
| 564 | 564 | .diff-stat .del { color: var(--del-fg); } |
| 565 | .diff > p.muted { margin: 12px 0 0; padding: 0 4px; } | |
| 565 | 566 | .diff-note { padding: 20px 16px; text-align: center; color: var(--muted-fg); font-size: 13px; } |
| 566 | 567 | .diff-stub p { margin: 0 0 10px; } |
| 567 | 568 | .diff-stub .diff-stat { display: inline-flex; } |
test/diff.test.ts +16
| @@ -16,6 +16,7 @@ import { initBareRepo, repoDir } from "../src/git/repos.ts"; | ||
| 16 | 16 | import { unwrap } from "../src/kernel/result.ts"; |
| 17 | 17 | import { anchorKey, type ReviewComment } from "../src/core/reviews.ts"; |
| 18 | 18 | import { |
| 19 | MAX_DIFF_FILES, | |
| 19 | 20 | MAX_FILE_BYTES, |
| 20 | 21 | MAX_LINE_WIDTH, |
| 21 | 22 | renderDiff, |
| @@ -252,6 +253,21 @@ describe("renderDiff stub budget (the view, not the engine)", () => { | ||
| 252 | 253 | return { files: [f], additions: f.additions, deletions: f.deletions }; |
| 253 | 254 | } |
| 254 | 255 | |
| 256 | function many(n: number): Diff { | |
| 257 | const files = Array.from({ length: n }, (_, i) => file(`f${i}.txt`, [])); | |
| 258 | return { files, additions: 0, deletions: 0 }; | |
| 259 | } | |
| 260 | ||
| 261 | test("a cut diff says so in one muted line, not a card", () => { | |
| 262 | const out = renderDiff(many(MAX_DIFF_FILES + 1200)).toString(); | |
| 263 | expect(out).toMatch( | |
| 264 | /<p class="muted small">\s*1,200 more files not\s+shown\./, | |
| 265 | ); | |
| 266 | expect(out).not.toContain("card diff-note"); | |
| 267 | const one = renderDiff(many(MAX_DIFF_FILES + 1)).toString(); | |
| 268 | expect(one).toMatch(/1 more file not\s+shown\./); | |
| 269 | }); | |
| 270 | ||
| 255 | 271 | test("a normal small file renders its hunk, not a stub", () => { |
| 256 | 272 | const f = file("small.txt", [ |
| 257 | 273 | hunk([ |
Principles 3 and 7: fine as a plain line, but give it breathing room under the last file (a margin) and update docs/design/areas/diff.md line 13, which still says .diff-note covers files past the cap.