Improve interface when comparing a branch which has created a pull request (#17911)

* Improve interface when comparing a branch which has created a pull request

* Take the note back

options/locale/locale_en-US.ini

@@ -1429,6 +1429,7 @@ compare.compare_head = compare
 
 pulls.desc = Enable pull requests and code reviews.
 pulls.new = New Pull Request
+pulls.view = View Pull Request
 pulls.compare_changes = New Pull Request
 pulls.compare_changes_desc = Select the branch to merge into and the branch to pull from.
 pulls.compare_base = merge into

routers/web/repo/compare.go

@@ -735,6 +735,10 @@ func CompareDiff(ctx *context.Context) {
 			}
 		} else {
 			ctx.Data["HasPullRequest"] = true
+			if err := pr.LoadIssue(); err != nil {
+				ctx.ServerError("LoadIssue", err)
+				return
+			}
 			ctx.Data["PullRequest"] = pr
 			ctx.HTML(http.StatusOK, tplCompareDiff)
 			return

templates/repo/diff/compare.tmpl

@@ -187,8 +187,22 @@
 		{{end}}
 	{{else if and .PageIsComparePull (gt .CommitCount 0)}}
 		{{if .HasPullRequest}}
-			<div class="ui segment">
+			<div class="ui segment grid title">
+				<div class="twelve wide column issue-title">
 					{{.i18n.Tr "repo.pulls.has_pull_request" (Escape $.RepoLink) (Escape $.RepoRelPath) .PullRequest.Index | Safe}}
+					<h1>
+						<span id="issue-title">{{RenderIssueTitle .PullRequest.Issue.Title $.RepoLink $.Repository.ComposeMetas}}</span>
+						<span class="index">#{{.PullRequest.Issue.Index}}</span>
+					</h1>
+				</div>
+				<div class="four wide right middle aligned column">
+				{{- if .PullRequest.HasMerged -}}
+				<a href="{{Escape $.RepoLink}}/pulls/{{.PullRequest.Issue.Index}}" class="ui button purple show-form">{{svg "octicon-git-merge" 16}} {{.i18n.Tr "repo.pulls.view"}}</a>
+				{{else if .Issue.IsClosed}}
+				<a href="{{Escape $.RepoLink}}/pulls/{{.PullRequest.Issue.Index}}" class="ui button red show-form">{{svg "octicon-issue-closed" 16}} {{.i18n.Tr "repo.pulls.view"}}</a>
+				{{else}}
+				<a href="{{Escape $.RepoLink}}/pulls/{{.PullRequest.Issue.Index}}" class="ui button green show-form">{{svg "octicon-git-pull-request" 16}} {{.i18n.Tr "repo.pulls.view"}}</a>
+				{{end}}</div>
 			</div>
 		{{else}}
 			{{if and $.IsSigned (not .Repository.IsArchived)}}

web_src/less/_repository.less

@@ -1298,6 +1298,15 @@
     .markup {
       font-size: 14px;
     }
+
+    .title {
+      .issue-title {
+        margin-bottom: .5rem;
+        .index {
+          color: var(--color-text-light-2);
+        }
+      }
+    }
   }
 
   .filter.dropdown .menu {