Add View Diff button to comment context
Add a view diff button to comment context that navigates to the
original comment in the diff view.
Screenshot: https://imgur.com/a/RfI41La
Change-Id: I8cc162f01ac7428726f59907434aab33ec9c1e63
diff --git a/plugins/singleusergroup b/plugins/singleusergroup
index 3548ec8..09623b9 160000
--- a/plugins/singleusergroup
+++ b/plugins/singleusergroup
@@ -1 +1 @@
-Subproject commit 3548ec83c0c271a8768a6b03b0c28711521ed6cf
+Subproject commit 09623b9432d360060f88ae48fb3386e374ca29c0
diff --git a/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts b/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts
index ec7be4a..13ce69a 100644
--- a/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts
+++ b/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts
@@ -60,6 +60,7 @@
import {KnownExperimentId} from '../../../services/flags/flags';
import {DiffInfo, DiffPreferencesInfo} from '../../../types/diff';
import {RenderPreferences} from '../../../api/diff';
+import {check, checkProperty} from '../../../utils/common-util';
const UNRESOLVED_EXPAND_COUNT = 5;
const NEWLINE_PATTERN = /\n/g;
@@ -321,6 +322,17 @@
return this.comments?.[0]?.range;
}
+ _getUrlForViewDiff(comments: UIComment[]) {
+ checkProperty(!!this.changeNum, 'changeNum');
+ checkProperty(!!this.projectName, 'projectName');
+ check(comments.length > 0, 'comment not found');
+ return GerritNav.getUrlForComment(
+ this.changeNum,
+ this.projectName,
+ comments[0].id!
+ );
+ }
+
_getDiffUrlForComment(
projectName?: RepoName,
changeNum?: NumericChangeId,
diff --git a/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread_html.ts b/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread_html.ts
index dfb0d45..76bbd67 100644
--- a/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread_html.ts
+++ b/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread_html.ts
@@ -29,9 +29,6 @@
* and hides our diff behind context control buttons.
* */
--dark-add-highlight-color: white;
- --diff-container-styles: {
- border: 1px solid var(--border-color);
- }
}
gr-button {
margin-left: var(--spacing-m);
@@ -89,8 +86,15 @@
.fileName {
padding: var(--spacing-m) var(--spacing-s) var(--spacing-m);
}
- gr-diff {
+ .diff-container {
margin-left: var(--spacing-l);
+ border: 1px solid var(--border-color);
+ }
+ .view-diff-container {
+ text-align: end;
+ }
+ .view-diff-button {
+ margin: var(--spacing-m);
}
</style>
@@ -184,16 +188,25 @@
</div>
</div>
<template is="dom-if" if="[[_shouldShowCommentContext(_diff)]]">
- <gr-diff
- id="diff"
- change-num="[[changeNum]]"
- diff="[[_diff]]"
- path="[[path]]"
- prefs="[[_prefs]]"
- render-prefs="[[_renderPrefs]]"
- highlight-range="[[getHighlightRange(comments)]]"
- >
- </gr-diff>
+ <div class="diff-container">
+ <gr-diff
+ id="diff"
+ change-num="[[changeNum]]"
+ diff="[[_diff]]"
+ path="[[path]]"
+ prefs="[[_prefs]]"
+ render-prefs="[[_renderPrefs]]"
+ highlight-range="[[getHighlightRange(comments)]]"
+ >
+ </gr-diff>
+ <div class="view-diff-container">
+ <a href="[[_getUrlForViewDiff(comments)]]">
+ <gr-button link class="view-diff-button" on-click="_handleViewDiff">
+ View Diff
+ </gr-button>
+ </a>
+ </div>
+ </div>
</template>
</div>
`;
