From efebe4dd35f17ed5987377fa941b7a799bb857bb Mon Sep 17 00:00:00 2001 From: darshanr0107 Date: Fri, 21 Nov 2025 17:08:06 +0530 Subject: [PATCH] feat: add showCommitHashLabel config to hide auto-generated commit hash labels on-behalf-of: @Mermaid-Chart --- .../integration/rendering/gitGraph.spec.js | 89 +++++++++++++++ docs/syntax/gitgraph.md | 102 ++++++++++++++++++ packages/mermaid/src/config.type.ts | 1 + .../src/diagrams/git/gitGraphRenderer.ts | 10 +- packages/mermaid/src/docs/syntax/gitgraph.md | 62 +++++++++++ .../mermaid/src/schemas/config.schema.yaml | 3 + 6 files changed, 264 insertions(+), 3 deletions(-) diff --git a/cypress/integration/rendering/gitGraph.spec.js b/cypress/integration/rendering/gitGraph.spec.js index 42dc57439..aee326845 100644 --- a/cypress/integration/rendering/gitGraph.spec.js +++ b/cypress/integration/rendering/gitGraph.spec.js @@ -1569,4 +1569,93 @@ gitGraph TB: {} ); }); + it('77: should hide commit hash labels when showCommitHashLabel is false', () => { + imgSnapshotTest( + `%%{init: { 'gitGraph': { 'showCommitHashLabel': false } } }%% + gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit + `, + {} + ); + }); + it('78: should show all commit labels when showCommitHashLabel is true', () => { + imgSnapshotTest( + `%%{init: { 'gitGraph': { 'showCommitHashLabel': true } } }%% + gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit + `, + {} + ); + }); + it('79: should hide commit hash labels with mixed custom and auto-generated IDs', () => { + imgSnapshotTest( + `%%{init: { 'gitGraph': { 'showCommitHashLabel': false } } }%% + gitGraph + commit id: "1-abcdefg" + commit + branch feature + commit id: "Custom Feature" + commit + checkout main + commit id: "2-abcdefg" + merge feature id: "Merge Feature" + commit + `, + {} + ); + }); + it('80: should hide commit hash labels in vertical orientation (TB)', () => { + imgSnapshotTest( + `%%{init: { 'gitGraph': { 'showCommitHashLabel': false } } }%% + gitGraph TB: + commit id: "Alpha" + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + merge develop + commit + `, + {} + ); + }); + it('81: should hide commit hash labels in bottom-to-top orientation (BT)', () => { + imgSnapshotTest( + `%%{init: { 'gitGraph': { 'showCommitHashLabel': false } } }%% + gitGraph BT: + commit id: "Alpha" + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + merge develop + commit + `, + {} + ); + }); }); diff --git a/docs/syntax/gitgraph.md b/docs/syntax/gitgraph.md index ffd8df3c3..fe7587b19 100644 --- a/docs/syntax/gitgraph.md +++ b/docs/syntax/gitgraph.md @@ -651,6 +651,8 @@ gitGraph Sometimes you may want to hide the commit labels from the diagram. You can do this by using the `showCommitLabel` keyword. By default its value is `true`. You can set it to `false` using directives. +### Hiding all commit labels + Usage example: ```mermaid-example @@ -759,6 +761,106 @@ config: merge release ``` +### Hiding only auto-generated commit hash labels + +In many cases, you may want to show labels only for commits with custom IDs (like "Alpha", "v1.0", "Feature-X") while hiding the auto-generated hash labels (like "0-a1b2c3d", "1-x9y8z7w"). This is useful when you want to emphasize important commits while keeping the diagram clean. + +You can achieve this by using the `showCommitHashLabel` keyword. By default its value is `true`. When set to `false`, only commits with custom IDs will show their labels, while commits with auto-generated hash IDs will be hidden. + +**How it works:** + +- **Auto-generated IDs**: Commits without a custom `id` are automatically assigned IDs in the format `seq-hash` (e.g., `0-a1b2c3d`, `1-x9y8z7w`). These follow the pattern of a number, a dash, and a random hash. +- **Custom IDs**: Commits with explicitly defined IDs using `commit id: "YourID"` are considered custom IDs. +- When `showCommitHashLabel: false`, only custom IDs are displayed. + +Usage example - Hiding auto-generated hash labels: + +```mermaid-example +--- +config: + gitGraph: + showCommitHashLabel: false +--- +gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit +``` + +```mermaid +--- +config: + gitGraph: + showCommitHashLabel: false +--- +gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit +``` + +In this example, only the commits with custom IDs ("Alpha", "Beta", "Gamma", "Delta") will show their labels. The commits without custom IDs (created with just `commit`) will not display their auto-generated hash labels. + +Usage example - Showing all labels (default behavior): + +```mermaid-example +--- +config: + gitGraph: + showCommitHashLabel: true +--- +gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit +``` + +```mermaid +--- +config: + gitGraph: + showCommitHashLabel: true +--- +gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit +``` + +In this example, all commits will show their labels, including both custom IDs and auto-generated hash IDs. + ## Customizing main branch name Sometimes you may want to customize the name of the main/default branch. You can do this by using the `mainBranchName` keyword. By default its value is `main`. You can set it to any string using directives. diff --git a/packages/mermaid/src/config.type.ts b/packages/mermaid/src/config.type.ts index 79fadd195..8602c665a 100644 --- a/packages/mermaid/src/config.type.ts +++ b/packages/mermaid/src/config.type.ts @@ -1108,6 +1108,7 @@ export interface GitGraphDiagramConfig extends BaseDiagramConfig { showBranches?: boolean; rotateCommitLabel?: boolean; parallelCommits?: boolean; + showCommitHashLabel?: boolean; /** * Controls whether or arrow markers in html code are absolute paths or anchors. * This matters if you are using base tag settings. diff --git a/packages/mermaid/src/diagrams/git/gitGraphRenderer.ts b/packages/mermaid/src/diagrams/git/gitGraphRenderer.ts index 39a64a623..5e7b6bb19 100644 --- a/packages/mermaid/src/diagrams/git/gitGraphRenderer.ts +++ b/packages/mermaid/src/diagrams/git/gitGraphRenderer.ts @@ -289,11 +289,15 @@ const drawCommitLabel = ( commitPosition: CommitPositionOffset, pos: number ) => { - if ( + const hasCustomId = commit.customId || !/^\d+-[\dA-Za-z]+$/.exec(commit.id); + + const shouldShowLabel = commit.type !== commitType.CHERRY_PICK && ((commit.customId && commit.type === commitType.MERGE) || commit.type !== commitType.MERGE) && - DEFAULT_GITGRAPH_CONFIG?.showCommitLabel - ) { + DEFAULT_GITGRAPH_CONFIG?.showCommitLabel && + (DEFAULT_GITGRAPH_CONFIG?.showCommitHashLabel || hasCustomId); + + if (shouldShowLabel) { const wrapper = gLabels.append('g'); const labelBkg = wrapper.insert('rect').attr('class', 'commit-label-bkg'); const text = wrapper diff --git a/packages/mermaid/src/docs/syntax/gitgraph.md b/packages/mermaid/src/docs/syntax/gitgraph.md index 66bb2de41..84da835cc 100644 --- a/packages/mermaid/src/docs/syntax/gitgraph.md +++ b/packages/mermaid/src/docs/syntax/gitgraph.md @@ -407,6 +407,8 @@ gitGraph Sometimes you may want to hide the commit labels from the diagram. You can do this by using the `showCommitLabel` keyword. By default its value is `true`. You can set it to `false` using directives. +### Hiding all commit labels + Usage example: ```mermaid-example @@ -462,6 +464,66 @@ config: merge release ``` +### Hiding only auto-generated commit hash labels + +In many cases, you may want to show labels only for commits with custom IDs (like "Alpha", "v1.0", "Feature-X") while hiding the auto-generated hash labels (like "0-a1b2c3d", "1-x9y8z7w"). This is useful when you want to emphasize important commits while keeping the diagram clean. + +You can achieve this by using the `showCommitHashLabel` keyword. By default its value is `true`. When set to `false`, only commits with custom IDs will show their labels, while commits with auto-generated hash IDs will be hidden. + +**How it works:** + +- **Auto-generated IDs**: Commits without a custom `id` are automatically assigned IDs in the format `seq-hash` (e.g., `0-a1b2c3d`, `1-x9y8z7w`). These follow the pattern of a number, a dash, and a random hash. +- **Custom IDs**: Commits with explicitly defined IDs using `commit id: "YourID"` are considered custom IDs. +- When `showCommitHashLabel: false`, only custom IDs are displayed. + +Usage example - Hiding auto-generated hash labels: + +```mermaid-example +--- +config: + gitGraph: + showCommitHashLabel: false +--- +gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit +``` + +In this example, only the commits with custom IDs ("Alpha", "Beta", "Gamma", "Delta") will show their labels. The commits without custom IDs (created with just `commit`) will not display their auto-generated hash labels. + +Usage example - Showing all labels (default behavior): + +```mermaid-example +--- +config: + gitGraph: + showCommitHashLabel: true +--- +gitGraph + commit id: "Alpha" + commit + commit + branch develop + commit id: "Beta" + commit + checkout main + commit id: "Gamma" + commit + merge develop id: "Delta" + commit +``` + +In this example, all commits will show their labels, including both custom IDs and auto-generated hash IDs. + ## Customizing main branch name Sometimes you may want to customize the name of the main/default branch. You can do this by using the `mainBranchName` keyword. By default its value is `main`. You can set it to any string using directives. diff --git a/packages/mermaid/src/schemas/config.schema.yaml b/packages/mermaid/src/schemas/config.schema.yaml index 4b75c9704..73b2618ad 100644 --- a/packages/mermaid/src/schemas/config.schema.yaml +++ b/packages/mermaid/src/schemas/config.schema.yaml @@ -892,6 +892,9 @@ $defs: # JSON Schema definition (maybe we should move these to a separate file) parallelCommits: type: boolean default: false + showCommitHashLabel: + type: boolean + default: true # YAML anchor reference, don't use $ref since ajv doesn't load defaults arrowMarkerAbsolute: *arrowMarkerAbsolute