@young1lin/dsh-ui-gitworkbench 0.1.6 → 0.1.8

package/lib/index.js

@@ -100,8 +100,6 @@ import { bindingsPath, findRegisteredWorktree, isRefName, loadBindings, parseWor
 const DIFF_CHAR_CAP = 400_000;
 /** Untracked files larger than this are listed + counted but never diffed. */
 const UNTRACKED_FILE_BYTE_CAP = 1_000_000;
-/** At most this many bytes of synthesized untracked diff ride along in `stats`. */
-const UNTRACKED_TOTAL_CHAR_CAP = 160_000;
 /** Files with a NUL byte in the first 8k are treated as binary. */
 const BINARY_SNIFF_BYTES = 8_000;
 /** Context radius that makes `git diff` emit ONE hunk covering the whole file —
@@ -391,13 +389,21 @@ let GitWorkbenchService = (() => {
         /** Working-tree change stats for a worktree (plain-identifier params; signal last — SRC requirements). */
         async stats(worktreePath, signal) {
             const cwd = typeof worktreePath === 'string' && worktreePath.length > 0 ? worktreePath : process.cwd();
-            // Four independent reads of the same worktree. Running them together is
+            // Three independent reads of the same worktree. Running them together is
             // safe: git takes .git/index.lock only to write back a refreshed index and
             // skips that write when it cannot get the lock, so the reports stay correct.
-            const [statusInfo, numstat, diff, revInfo] = await Promise.all([
+            //
+            // `git diff HEAD` is NOT among them any more. This call is polled — every
+            // 3 seconds while an agent is running — and the full patch is the most
+            // expensive thing in it by a wide margin: measured on a worktree with
+            // 90,000 changed lines it took 595ms and produced 7.43MB, of which the
+            // 400,000-character clip below then discarded 94.6% before it ever reached
+            // the browser. The tree and the counters need only `status` and
+            // `--numstat`, both of which stay around 110-140ms at that size, and the
+            // pane already fetches the file it is actually showing through `fileDiff`.
+            const [statusInfo, numstat, revInfo] = await Promise.all([
                 this.git(cwd, ['status', '--porcelain=v1', '--branch', '--untracked-files=all'], signal),
                 this.git(cwd, ['diff', 'HEAD', '--numstat'], signal),
-                this.git(cwd, ['diff', 'HEAD'], signal),
                 this.git(cwd, ['rev-parse', '--abbrev-ref', 'HEAD'], signal),
             ]);
             if (statusInfo.exitCode !== 0) {
@@ -406,26 +412,17 @@ let GitWorkbenchService = (() => {
             }
             const counts = parseNumstat(numstat.stdout);
             const files = parseStatus(statusInfo.stdout, counts);
-            // Untracked files in two passes, because the two halves cost wildly
-            // different amounts. EVERY untracked file needs a line count and a binary
-            // flag, which come off the raw buffer with no utf8 decode; only the handful
-            // that fit the payload budget pay for a decode and a synthesized segment.
+            // Every untracked file needs a line count and a binary flag for the tree,
+            // and both come off the raw buffer with no utf8 decode. The second pass
+            // that used to follow — decoding some of them and synthesizing new-file
+            // segments into the payload — is gone with the payload itself; `fileDiff`
+            // synthesizes the one segment the reader has actually opened.
             const untracked = files.filter(file => file.status === 'untracked');
             const measured = await mapPooled(untracked, UNTRACKED_READ_CONCURRENCY, file => measureUntracked(cwd, file.path));
-            let budget = UNTRACKED_TOTAL_CHAR_CAP;
-            let untrackedDiff = '';
             for (const [index, file] of untracked.entries()) {
                 const measure = measured[index];
                 file.addedLines = measure.lineCount;
                 file.binary = measure.binary;
-                if (budget <= 0 || !measure.diffable)
-                    continue;
-                const segment = await untrackedSegment(cwd, file.path);
-                if (segment === null)
-                    continue;
-                const text = clipDiff(segment, budget, '…[untracked diff truncated]');
-                untrackedDiff += `${text}\n`;
-                budget -= text.length;
             }
             let addedLines = 0;
             let deletedLines = 0;
@@ -459,28 +456,51 @@ let GitWorkbenchService = (() => {
                 }
             }
             const { ahead, behind } = parseBranch(statusInfo.stdout);
-            let combined = diff.stdout;
-            if (untrackedDiff.length > 0)
-                combined += `\n${untrackedDiff}`;
-            combined = clipDiff(combined, DIFF_CHAR_CAP, '…[diff truncated]');
             return {
                 worktreePath: cwd, branch, ahead, behind, detached,
                 addedLines, deletedLines, addedFiles, deletedFiles, modifiedFiles,
-                files, diff: combined,
+                // No bundled patch: every per-file diff is fetched on demand. See the
+                // reads above for what that saves and why it is affordable.
+                files, diff: '',
                 // No log here: this call is polled every 15s, and the history list follows
                 // a ref this one knows nothing about. `commits` serves it instead.
                 commits: [],
             };
         }
         /**
-         * One file's diff on demand. With `commit` the diff is that commit's change to
-         * the file; without it, the working tree against HEAD (plain-identifier params;
-         * signal last).
+         * One file's diff on demand, for whichever view is asking.
+         *
+         * Three questions, because the drawer's three tabs are asking three different
+         * things about the same path and only the caller knows which:
+         *
+         *   - with `commit`, that commit's change to the file;
+         *   - with `base` and `head`, what differs between two refs — the Compare
+         *     tab, which until now had no way to ask at all and showed a file with no
+         *     detail whenever the bundled payload did not carry it;
+         *   - with neither, the working tree against HEAD.
+         *
+         * The range answer is deliberately NOT cached, for the same reason
+         * `compareRefs` is not: a ref name is a moving pointer, unlike a commit hash.
+         *
+         * Plain-identifier params, signal last.
          */
-        async fileDiff(worktreePath, path, commit, signal) {
+        async fileDiff(worktreePath, path, commit, base, head, signal) {
             const cwd = typeof worktreePath === 'string' && worktreePath.length > 0 ? worktreePath : process.cwd();
             if (typeof path !== 'string' || path.length === 0)
                 return { diff: '' };
+            if (typeof base === 'string' && base.length > 0 && typeof head === 'string' && head.length > 0) {
+                if (!isRefName(base) || !isRefName(head))
+                    return { diff: '' };
+                const ranged = await this.git(cwd, ['diff', '--no-renames', `${base}...${head}`, '--', path], signal);
+                if (ranged.exitCode === 0)
+                    return { diff: ranged.stdout };
+                // Unrelated histories have no merge base for `A...B` to diff from; the
+                // two-tip diff still answers what differs, exactly as `compareRefs` does.
+                if (!isNoMergeBaseError(ranged.stderr))
+                    return { diff: '' };
+                const tips = await this.git(cwd, ['diff', '--no-renames', base, head, '--', path], signal);
+                return { diff: tips.exitCode === 0 ? tips.stdout : '' };
+            }
             if (typeof commit === 'string' && commit.length > 0) {
                 if (!COMMIT_HASH.test(commit))
                     return { diff: '' };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@young1lin/dsh-ui-gitworkbench",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "description": "Out-of-tree dsh web UI plugin: a session-header git workbench chip opening a drawer with the file tree, per-file diff, history, compare, staging, commit, and sync (fetch/pull/push).",
   "type": "module",
   "main": "lib/index.js",

package/src/client/GitWorkbenchPanel.module.css

@@ -1278,7 +1278,11 @@
    the compact control it hosts, so a pane with tools and a pane without one
    still line up across the divider. */
 .paneHead {
-  display: flex; align-items: center; gap: 8px;
+  /* Wraps rather than overflows. Dragged narrow the pane cannot hold a title,
+     a funnel and a search box on one line, and what it used to do was clip the
+     search box at the pane's edge — a control half off the screen, with no
+     sign that the rest of it existed. */
+  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
   flex: none;
   min-height: 37px; box-sizing: border-box;
   padding: 6px var(--gs-gutter-pane);
@@ -1320,10 +1324,12 @@
 .commitLine {
   display: flex; align-items: stretch;
   flex: none;
-  /* Must equal GRAPH_ROW_H in GitWorkbenchPanel.tsx, or the lanes drawn per
-     row stop meeting across the seam between rows. Guarded by
-     tests/commit-row-height.test.ts. */
-  height: 28px;
+  /* Published by the panel from `COMMIT_ROW_H`, which the lane graph also draws
+     each row's segment at — one source, because a row and its segment that
+     disagree leave the lanes short of the seam between rows. The two
+     arrangements want different rows, which is why this is a property and not
+     a number. Guarded by tests/commit-row-height.test.ts. */
+  height: var(--gs-commit-row);
 }
 .graphCell { flex: none; display: block; }
 /* An inset row, like dsh's own session rows: 12px radius, filled when active. */
@@ -1343,6 +1349,20 @@
   overflow: hidden;
   transition: background 120ms ease, border-color 120ms ease;
 }
+/* Beside the diff the row turns into two lines: a pane of about 340px has no
+   width for the hash, the author, the date AND the subject on one, and the
+   subject is the part that would have given way. Above the diff it stays one
+   line — see the row's two shapes in `CommitRow`. */
+.commitsPane[data-layout="columns"] .commit {
+  flex-direction: column; align-items: stretch; justify-content: center; gap: 2px;
+}
+/* The subject line must not absorb the row's spare height, or the two lines
+   stop sitting together in the middle of the row. */
+.commitsPane[data-layout="columns"] .commitSubjectRow { flex: none; }
+.commitTop {
+  display: flex; align-items: center; justify-content: space-between; gap: 8px;
+  min-width: 0;
+}
 .commit:hover { background: var(--gs-raise); }
 .commitActive { border-color: var(--gs-accent-border); background: var(--gs-accent-bg); }
 /* Pushed to the right end of the row, and never squeezed: the subject is what
@@ -1786,6 +1806,10 @@
 .sideNumAdd { background: var(--gs-add-num, var(--gs-add-line)); }
 .sideNumDel { background: var(--gs-del-num, var(--gs-del-line)); }
 .sideCode { white-space: pre; padding: 0 16px 0 10px; min-height: 20px; }
+/* Stands in for the rows outside the window, so the scrollbar is the length of
+   the FILE rather than of whatever is currently rendered. Spans every column,
+   including the blame gutter's. */
+.sideSpacer { grid-column: 1 / -1; }
 .sideCodeSame { color: var(--gs-fg-muted); }
 .sideCodeAdd { background: var(--gs-add-line); }
 .sideCodeDel { background: var(--gs-del-line); }
@@ -2093,7 +2117,7 @@
  * its own padding, radius and font-size, and the same "small secondary button"
  * had drifted to four heights and three radii across one screen.
  */
-.btn, .miniBtn, .treeIcon, .commitCopy, .scopeBtn, .refButton, .funnelButton, .funnelPreset {
+.btn, .miniBtn, .treeIcon, .commitCopy, .scopeBtn, .refButton, .funnelButton, .funnelPreset, .layoutButton {
   display: inline-flex; align-items: center; justify-content: center; gap: 6px;
   box-sizing: border-box;
   flex: none;
@@ -2111,14 +2135,14 @@
   transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
 }
 .btn:hover, .miniBtn:hover, .treeIcon:hover, .commitCopy:hover,
-.scopeBtn:hover, .refButton:hover, .funnelButton:hover, .funnelPreset:hover {
+.scopeBtn:hover, .refButton:hover, .funnelButton:hover, .funnelPreset:hover, .layoutButton:hover {
   background: var(--gs-raise);
   color: var(--gs-fg);
   border-color: var(--gs-fg-fainter);
 }
 .btn:focus-visible, .miniBtn:focus-visible, .treeIcon:focus-visible,
 .commitCopy:focus-visible, .scopeBtn:focus-visible, .refButton:focus-visible,
-.funnelPreset:focus-visible {
+.funnelPreset:focus-visible, .layoutButton:focus-visible {
   outline: 2px solid var(--gs-accent);
   outline-offset: 1px;
 }
@@ -2131,7 +2155,7 @@
 
 /* Pane tools give their vertical space back to the diff; the date presets sit
    inside a 320px popover, so they take the compact height too. */
-.treeIcon, .commitCopy, .funnelPreset {
+.treeIcon, .commitCopy, .funnelPreset, .layoutButton {
   height: var(--gs-h-compact);
   padding: var(--gs-pad-compact);
   font-size: var(--gs-t-dense);
@@ -2141,6 +2165,19 @@
    the pane drags down to, two more text buttons cannot share a row with the
    count — and these two are the pair a tree header always carries. */
 .treeIcon { width: var(--gs-h-compact); padding: 0; }
+/* The arrangement switch: two square icon buttons at the end of the commit
+   list's head, side by side with no gap so they read as one control. Icon-only
+   for the same reason the tree's are — the head already carries a title, a
+   funnel and a search box, and at the 190px the pane drags down to there is no
+   room for two more words. */
+/* Pushed to the far end of History's toolbar row, away from the ref picker:
+   one changes WHAT is listed, the other only where it is drawn. */
+.layoutSwitch { display: inline-flex; flex: none; gap: 2px; margin-left: auto; }
+.layoutButton { width: var(--gs-h-compact); padding: 0; }
+/* Qualified, like `.treeIconOn`: the shared vocabulary sets `color` at the
+   same specificity a few rules above. */
+.layoutButton.layoutButtonOn { color: var(--gs-accent); border-color: var(--gs-accent); }
+.layoutGlyph { display: block; }
 /* Qualified, like `.funnelButtonActive`: this sits inside the shared button
    vocabulary, which sets `color` at the same specificity a few lines above. */
 .treeIcon.treeIconOn { color: var(--gs-accent); border-color: var(--gs-accent); }