Show dropdown with all statuses for commit (#13977)

* Show dropdown with all statuses for commit

* Use popups

* Remove unnecessary change

* Style popup

* Use divided list

* As per @silverwind

* Refactor GetLastCommitStatus

* Missing dropdown on repo home and commit page

* Fix tests

* Make status icon be a part of a link on PR list

* Fix missing translation call

* Indent fix

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>

7 files changed, 31 insertions, 15 deletions

diff --git a/templates/repo/commit_page.tmpl b/templates/repo/commit_page.tmpl
index 0448c938bd..6260d2e965 100644
--- a/templates/repo/commit_page.tmpl
+++ b/templates/repo/commit_page.tmpl
@@ -23,7 +23,7 @@
 				{{.i18n.Tr "repo.diff.browse_source"}}
 			</a>
 			{{end}}
-			<h3><span class="message-wrapper"><span class="commit-summary" title="{{.Commit.Summary}}">{{RenderCommitMessage .Commit.Message $.RepoLink $.Repository.ComposeMetas}}</span></span>{{template "repo/commit_status" .CommitStatus}}</h3>
+			<h3><span class="message-wrapper"><span class="commit-summary" title="{{.Commit.Summary}}">{{RenderCommitMessage .Commit.Message $.RepoLink $.Repository.ComposeMetas}}</span></span>{{template "repo/commit_statuses" dict "Status" .CommitStatus "Statuses" .CommitStatuses  "root" $}}</h3>
 			{{if IsMultilineCommitMessage .Commit.Message}}
 				<pre class="commit-body">{{RenderCommitBody .Commit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
 			{{end}}
diff --git a/templates/repo/commit_status.tmpl b/templates/repo/commit_status.tmpl
index 638f81ed8f..75ab6b4e1c 100644
--- a/templates/repo/commit_status.tmpl
+++ b/templates/repo/commit_status.tmpl
@@ -1,15 +1,15 @@
 {{if eq .State "pending"}}
-	<a class="commit-status-link" href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer"><i class="commit-status circle icon yellow"></i></a>
+	<i class="commit-status circle icon yellow"></i>
 {{end}}
 {{if eq .State "success"}}
-	<a class="commit-status-link" href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer"><i class="commit-status check icon green"></i></a>
+	<i class="commit-status check icon green"></i>
 {{end}}
 {{if eq .State "error"}}
-	<a class="commit-status-link" href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer"><i class="commit-status warning icon red"></i></a>
+	<i class="commit-status warning icon red"></i>
 {{end}}
 {{if eq .State "failure"}}
-	<a class="commit-status-link" href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer"><i class="commit-status remove icon red"></i></a>
+	<i class="commit-status remove icon red"></i>
 {{end}}
 {{if eq .State "warning"}}
-	<a class="commit-status-link" href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer"><i class="commit-status warning sign icon yellow"></i></a>
+	<i class="commit-status warning sign icon yellow"></i>
 {{end}}
diff --git a/templates/repo/commit_statuses.tmpl b/templates/repo/commit_statuses.tmpl
new file mode 100644
index 0000000000..d2e9f0bd16
--- /dev/null
+++ b/templates/repo/commit_statuses.tmpl
@@ -0,0 +1,14 @@
+<a class="ui link commit-statuses-trigger">{{template "repo/commit_status" .Status}}</a>
+<div class="ui popup very wide fixed basic commit-statuses">
+	<div class="ui relaxed list divided">
+		{{range .Statuses}}
+			<div class="ui item singular-status">
+				<span>{{template "repo/commit_status" .}}</span>
+				<span class="ui">{{.Context}} <span class="text grey">{{.Description}}</span></span>
+				{{if .TargetURL}}
+					<div class="ui right"><a href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer">{{$.root.i18n.Tr "repo.pulls.status_checks_details"}}</a></div>
+				{{end}}
+			</div>
+		{{end}}
+	</div>
+</div>
diff --git a/templates/repo/commits_list.tmpl b/templates/repo/commits_list.tmpl
index e7489bf51d..66138e2138 100644
--- a/templates/repo/commits_list.tmpl
+++ b/templates/repo/commits_list.tmpl
@@ -70,7 +70,7 @@
 							<button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button>
 							{{end}}
 							{{if eq (CommitType .) "SignCommitWithStatuses"}}
-								{{template "repo/commit_status" .Status}}
+								{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses "root" $}}
 							{{end}}
 							{{if IsMultilineCommitMessage .Message}}
 							<pre class="commit-body" style="display: none;">{{RenderCommitBody .Message $.RepoLink $.Repository.ComposeMetas}}</pre>
diff --git a/templates/repo/commits_list_small.tmpl b/templates/repo/commits_list_small.tmpl
index aaf4174bbd..acab040a45 100644
--- a/templates/repo/commits_list_small.tmpl
+++ b/templates/repo/commits_list_small.tmpl
@@ -16,8 +16,8 @@
 
 		<span class="ui float right shabox">
 			{{if eq (CommitType .) "SignCommitWithStatuses"}}
-        		{{template "repo/commit_status" .Status}}
-        	{{end}}
+				{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses "root" $.root}}
+			{{end}}
 			{{$class := "ui sha label"}}
 			{{if .Signature}}
 				{{$class = (printf "%s%s" $class " isSigned")}}
diff --git a/templates/repo/view_list.tmpl b/templates/repo/view_list.tmpl
index a99efab020..fc66fb6b2d 100644
--- a/templates/repo/view_list.tmpl
+++ b/templates/repo/view_list.tmpl
@@ -21,7 +21,7 @@
 						{{template "repo/shabox_badge" dict "root" $ "verification" .LatestCommitVerification}}
 					{{end}}
 				</a>
-				{{template "repo/commit_status" .LatestCommitStatus}}
+				{{template "repo/commit_statuses" dict "Status" .LatestCommitStatus "Statuses" .LatestCommitStatuses "root" $}}
 				{{ $commitLink:= printf "%s/commit/%s" .RepoLink .LatestCommit.ID }}
 				<span class="grey commit-summary" title="{{.LatestCommit.Summary}}"><span class="message-wrapper">{{RenderCommitMessageLinkSubject .LatestCommit.Message $.RepoLink $commitLink $.Repository.ComposeMetas}}</span>
 				{{if IsMultilineCommitMessage .LatestCommit.Message}}
diff --git a/templates/shared/issuelist.tmpl b/templates/shared/issuelist.tmpl
index 62f55f6c40..adb319a644 100644
--- a/templates/shared/issuelist.tmpl
+++ b/templates/shared/issuelist.tmpl
@@ -31,12 +31,14 @@
 			</div>
 			<div class="issue-item-main f1 fc df">
 				<div class="issue-item-top-row df ac fw">
-					<a class="title mr-3" href="{{if .HTMLURL}}{{.HTMLURL}}{{else}}{{$.Link}}/{{.Index}}{{end}}">{{RenderEmoji .Title}}</a>
-					{{if .IsPull }}
-						{{if (index $.CommitStatus .PullRequest.ID)}}
-							{{template "repo/commit_status" (index $.CommitStatus .PullRequest.ID)}}
+					<a class="title mr-3" href="{{if .HTMLURL}}{{.HTMLURL}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
+						{{RenderEmoji .Title}}
+						{{if .IsPull }}
+							{{if (index $.CommitStatus .PullRequest.ID)}}
+								{{template "repo/commit_status" (index $.CommitStatus .PullRequest.ID)}}
+							{{end}}
 						{{end}}
-					{{end}}
+					</a>
 					<span class="labels-list">
 						{{range .Labels}}
 							<a class="ui label" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&state={{$.State}}&labels={{.ID}}{{if ne $.listType "milestone"}}&milestone={{$.MilestoneID}}{{end}}&assignee={{$.AssigneeID}}" style="color: {{.ForegroundColor}}; background-color: {{.Color}}" title="{{.Description | RenderEmojiPlain}}">{{.Name | RenderEmoji}}</a>