@theia/scm 1.75.0-next.8 → 1.75.0

package/src/browser/scm-history-graph-lanes.spec.ts

@@ -37,9 +37,14 @@ describe('computeGraphRows', () => {
             expect(lanes(commits)).to.deep.equal([0, 0, 0]);
         });
 
-        it('colors are all 0', () => {
+        it('colors default to the first rotation color (foreground1 = index 3)', () => {
             const rows = computeGraphRows(commits);
-            expect(rows.map(r => r.color)).to.deep.equal([0, 0, 0]);
+            expect(rows.map(r => r.color)).to.deep.equal([3, 3, 3]);
+        });
+
+        it('topColor equals color when no ref color overrides the lane', () => {
+            const rows = computeGraphRows(commits);
+            rows.forEach(r => expect(r.topColor).to.equal(r.color));
         });
 
         it('first parent same-lane continuation emits no separate edge (handled by commit line)', () => {
@@ -201,9 +206,13 @@ describe('computeGraphRows', () => {
             expect(mergeIn.length).to.equal(0);
         });
 
-        it('lane colors are correct modulo 8', () => {
+        it('lane colors rotate through the default registry (indices 3-7)', () => {
             const rows = computeGraphRows(commits);
-            rows.forEach(r => expect(r.color).to.equal(r.lane % 8));
+            // O and P1 share lane 0 → first rotation color; P2/P3 opened new lanes
+            expect(rows[0].color).to.equal(3);
+            expect(rows[1].color).to.equal(3);
+            expect(rows[2].color).to.not.equal(rows[3].color);
+            rows.forEach(r => expect(r.color).to.be.within(3, 7));
         });
     });
 
@@ -387,25 +396,14 @@ describe('computeGraphRows', () => {
     });
 
     // -------------------------------------------------------------------------
-    // Lane color wraps at 8
+    // Default color rotation (VS Code cycles scmGraph.foreground1-5)
     // -------------------------------------------------------------------------
-    describe('color wrapping', () => {
-        it('lane color is always lane % 8', () => {
-            // 4 parallel chains so we have lanes 0, 1, 2, 3 occupied at once.
-            // Chain structure: X0→X1→X2, Y0→Y1→Y2, etc., interleaved.
-            const commits = [
-                { id: 'X0', parentIds: ['X1'] },
-                { id: 'Y0', parentIds: ['Y1'] },
-                { id: 'Z0', parentIds: ['Z1'] },
-                { id: 'W0', parentIds: ['W1'] },
-                { id: 'X1', parentIds: [] },
-                { id: 'Y1', parentIds: [] },
-                { id: 'Z1', parentIds: [] },
-                { id: 'W1', parentIds: [] },
-            ];
+    describe('default color rotation', () => {
+        it('cycles through indices 3-7 and wraps', () => {
+            // 6 independent tips → 6 lanes; the sixth wraps back to the first color
+            const commits = ['A', 'B', 'C', 'D', 'E', 'F'].map(id => ({ id, parentIds: [id.toLowerCase()] }));
             const rows = computeGraphRows(commits);
-            // Every row's color must equal lane % 8
-            rows.forEach(r => expect(r.color).to.equal(r.lane % 8));
+            expect(rows.map(r => r.color)).to.deep.equal([3, 4, 5, 6, 7, 3]);
         });
 
         it('assigns distinct lanes to 8 simultaneous branches', () => {
@@ -423,10 +421,57 @@ describe('computeGraphRows', () => {
             const rows = computeGraphRows(commits);
             const laneSet = new Set(rows.map(r => r.lane));
             expect(laneSet.size).to.equal(8); // all distinct lanes
-            // Color of lane 7 is 7, lane 0 is 0
-            const lane7 = rows.find(r => r.lane === 7);
-            expect(lane7).to.not.be.undefined;
-            expect(lane7!.color).to.equal(7);
+            // Default colors never use the reserved ref color indices 0-2
+            rows.forEach(r => expect(r.color).to.be.within(3, 7));
+        });
+    });
+
+    // -------------------------------------------------------------------------
+    // Ref-based colors (VS Code colorMap: current=0, remote=1, base=2)
+    // -------------------------------------------------------------------------
+    describe('ref-based colors', () => {
+        // Remote is one commit ahead: R (origin/main) → L (main = HEAD) → A
+        const behindCommits = [
+            { id: 'R', parentIds: ['L'], colorIndex: 1 },
+            { id: 'L', parentIds: ['A'], colorIndex: 0 },
+            { id: 'A', parentIds: [] },
+        ];
+
+        it('a tip with a color index colors its row', () => {
+            const rows = computeGraphRows(behindCommits);
+            expect(rows[0].color).to.equal(1);
+        });
+
+        it('an overriding commit recolors the chain from its row downward', () => {
+            const rows = computeGraphRows(behindCommits);
+            expect(rows[1].color).to.equal(0);
+            expect(rows[2].color).to.equal(0);
+        });
+
+        it('topColor keeps the inherited color for the segment above an overriding commit', () => {
+            const rows = computeGraphRows(behindCommits);
+            expect(rows[0].topColor).to.equal(1);
+            expect(rows[1].topColor).to.equal(1);
+            expect(rows[2].topColor).to.equal(0);
+        });
+
+        // Diverged: L (main = HEAD) and R (origin/main) both branched off A
+        const divergedCommits = [
+            { id: 'L', parentIds: ['A'], colorIndex: 0 },
+            { id: 'R', parentIds: ['A'], colorIndex: 1 },
+            { id: 'A', parentIds: [] },
+        ];
+
+        it('pass-through edges use the propagated ref color', () => {
+            const rows = computeGraphRows(divergedCommits);
+            const pass = rows[1].edges.find(e => e.type === 'pass-through');
+            expect(pass?.color).to.equal(0);
+        });
+
+        it('merge-in edges from a ref-colored lane keep that color', () => {
+            const rows = computeGraphRows(divergedCommits);
+            const mergeIn = rows[2].edges.find(e => e.type === 'merge-in');
+            expect(mergeIn?.color).to.equal(1);
         });
     });
 

package/src/browser/scm-history-graph-lanes.ts

@@ -47,8 +47,14 @@ export interface GraphEdge {
 export interface GraphRow {
     /** Lane index where the commit node is rendered. */
     readonly lane: number;
-    /** Color index for the commit node dot. */
+    /** Color index for the commit node dot and the lane segment below it. */
     readonly color: number;
+    /**
+     * Color index for the lane segment above the commit node. Differs from
+     * `color` when this commit's ref color overrides the color inherited from
+     * the chain above (e.g. the current branch tip below remote-only commits).
+     */
+    readonly topColor: number;
     /** Edges crossing or originating on this row. */
     readonly edges: readonly GraphEdge[];
     /**
@@ -71,11 +77,29 @@ export interface GraphRow {
 interface MutableGraphRow {
     lane: number;
     color: number;
+    topColor: number;
     edges: GraphEdge[];
     hasContinuation: boolean;
     hasTopLine: boolean;
 }
 
+export interface GraphCommitInput {
+    id: string;
+    parentIds?: readonly string[];
+    /**
+     * Ref-based color index resolved from the commit's references
+     * (0 = current ref, 1 = remote ref, 2 = base ref). When set, it colors
+     * this row and propagates down the first-parent chain, mirroring
+     * VS Code's scm graph color map.
+     */
+    colorIndex?: number;
+}
+
+/** First color index of the default rotation (`scmGraph.foreground1`). */
+const DEFAULT_COLOR_FIRST = 3;
+/** Number of default rotation colors (`scmGraph.foreground1-5`). */
+const DEFAULT_COLOR_COUNT = 5;
+
 /**
  * Compute graph rows for an ordered list of commits (topological order,
  * newest first). Each commit must supply its own `id` and `parentIds`.
@@ -84,14 +108,22 @@ interface MutableGraphRow {
  * @returns One `GraphRow` per commit in the same order.
  */
 export function computeGraphRows(
-    commits: ReadonlyArray<{ id: string; parentIds?: readonly string[] }>
+    commits: ReadonlyArray<GraphCommitInput>
 ): GraphRow[] {
     // lanes[i] = id of commit that "owns" lane i (i.e. we are waiting for this
     // commit to appear in the list so we can close the lane).
     const lanes: (string | undefined)[] = [];
-    // laneColors[i] = the color index permanently assigned to lane i
+    // laneColors[i] = the color index currently assigned to lane i
     const laneColors: (number | undefined)[] = [];
 
+    // Default lane colors rotate through foreground1-5, like VS Code's
+    // color registry; indices 0-2 are reserved for ref-based colors.
+    let rotation = -1;
+    const nextDefaultColor = (): number => {
+        rotation = (rotation + 1) % DEFAULT_COLOR_COUNT;
+        return DEFAULT_COLOR_FIRST + rotation;
+    };
+
     const rows: MutableGraphRow[] = [];
 
     for (const commit of commits) {
@@ -106,10 +138,15 @@ export function computeGraphRows(
             // Not yet tracked → open a new lane
             myLane = firstFreeLane(lanes);
             lanes[myLane] = commit.id;
-            laneColors[myLane] = myLane % 8;
+            laneColors[myLane] = commit.colorIndex ?? nextDefaultColor();
         }
 
-        const myColor = laneColors[myLane] ?? myLane % 8;
+        // The segment above the commit keeps the color inherited from the
+        // chain above; the commit's own ref color (if any) takes over from
+        // this row downward.
+        const topColor = laneColors[myLane] ?? DEFAULT_COLOR_FIRST;
+        const myColor = commit.colorIndex ?? topColor;
+        laneColors[myLane] = myColor;
 
         // Collect any duplicate lane occupants: other lanes that were kept
         // alive pointing at this same commit (sibling branch tips whose lane
@@ -120,7 +157,7 @@ export function computeGraphRows(
         if (hasTopLine) {
             for (let li = 0; li < lanes.length; li++) {
                 if (lanes[li] === commit.id && li !== myLane) {
-                    duplicateLanes.push({ lane: li, color: laneColors[li] ?? li % 8 });
+                    duplicateLanes.push({ lane: li, color: laneColors[li] ?? DEFAULT_COLOR_FIRST });
                     lanes[li] = undefined;
                     laneColors[li] = undefined;
                 }
@@ -170,7 +207,7 @@ export function computeGraphRows(
                     // Additional parents get new lanes — branch-out
                     const newLane = firstFreeLane(lanes);
                     lanes[newLane] = pid;
-                    laneColors[newLane] = newLane % 8;
+                    laneColors[newLane] = nextDefaultColor();
                     parentLanes.push(newLane);
                     parentIsExisting.push(false);
                 }
@@ -206,7 +243,7 @@ export function computeGraphRows(
             if (!occupant || occupant === commit.id) {
                 continue;
             }
-            const color = laneColors[li] ?? li % 8;
+            const color = laneColors[li] ?? DEFAULT_COLOR_FIRST;
             edges.push({ fromLane: li, toLane: li, color, type: 'pass-through' });
         }
 
@@ -225,11 +262,11 @@ export function computeGraphRows(
             if (isExisting) {
                 // Merge-in: an existing lane at the top of the row curves into
                 // the commit position at mid-row.
-                const color = laneColors[toLane] ?? toLane % 8;
+                const color = laneColors[toLane] ?? DEFAULT_COLOR_FIRST;
                 edges.push({ fromLane: toLane, toLane: myLane, color, type: 'merge-in' });
             } else {
                 // Branch-out: the commit spawns a new lane below mid-row.
-                const color = laneColors[toLane] ?? toLane % 8;
+                const color = laneColors[toLane] ?? DEFAULT_COLOR_FIRST;
                 edges.push({ fromLane: myLane, toLane, color, type: 'branch-out' });
             }
         }
@@ -245,7 +282,7 @@ export function computeGraphRows(
         // at the parent) so it persists as a pass-through to the parent row.
         const hasContinuation = parentIds.length > 0 && (parentLanes[0] === myLane || lanes[myLane] === parentIds[0]);
 
-        rows.push({ lane: myLane, color: myColor, edges, hasContinuation, hasTopLine });
+        rows.push({ lane: myLane, color: myColor, topColor, edges, hasContinuation, hasTopLine });
     }
 
     return rows;