From 729849a2fd026adbb91e3ff3259290f61bd919f0 Mon Sep 17 00:00:00 2001
From: HEREYUA <37935145+HEREYUA@users.noreply.github.com>
Date: Fri, 15 Mar 2024 11:43:10 +0800
Subject: [PATCH] Improve branch select list ui in go templates (#29729)

Relate:[#27417](https://github.com/go-gitea/gitea/issues/27471)
Reference:  [#26631](https://github.com/go-gitea/gitea/pull/26631)

Before

![image](https://github.com/go-gitea/gitea/assets/37935145/88ca8da5-25dd-4f60-bea8-a80107f19cc5)

After

![image](https://github.com/go-gitea/gitea/assets/37935145/3cb180dc-1331-43e9-8633-be5e288401e8)

---------

Co-authored-by: silverwind <me@silverwind.io>

(cherry picked from commit 2eb7c564df950fb96a1970559719003e979ff30a)
---
 options/locale/locale_en-US.ini               |  3 +-
 templates/repo/branch_dropdown.tmpl           |  2 +-
 templates/repo/diff/compare.tmpl              |  2 +-
 .../repo/issue/branch_selector_field.tmpl     | 13 +++++---
 templates/repo/issue/view_title.tmpl          |  2 +-
 templates/repo/wiki/view.tmpl                 |  2 +-
 web_src/css/repo.css                          | 30 +++++++++++++++++++
 7 files changed, 45 insertions(+), 9 deletions(-)

diff --git a/options/locale/locale_en-US.ini b/options/locale/locale_en-US.ini
index 50871be86d..d046b247b9 100644
--- a/options/locale/locale_en-US.ini
+++ b/options/locale/locale_en-US.ini
@@ -156,6 +156,8 @@ filter.not_template = Not Template
 filter.public = Public
 filter.private = Private
 
+no_results_found = No results found.
+
 [aria]
 navbar = Navigation Bar
 footer = Footer
@@ -1774,7 +1776,6 @@ pulls.compare_compare = pull from
 pulls.switch_comparison_type = Switch comparison type
 pulls.switch_head_and_base = Switch head and base
 pulls.filter_branch = Filter branch
-pulls.no_results = No results found.
 pulls.show_all_commits = Show all commits
 pulls.show_changes_since_your_last_review = Show changes since your last review
 pulls.showing_only_single_commit = Showing only changes of commit %[1]s
diff --git a/templates/repo/branch_dropdown.tmpl b/templates/repo/branch_dropdown.tmpl
index 8a5cdc7cc7..367c6aab98 100644
--- a/templates/repo/branch_dropdown.tmpl
+++ b/templates/repo/branch_dropdown.tmpl
@@ -56,7 +56,7 @@
 		'repoLink': {{.root.RepoLink}},
 		'treePath': {{.root.TreePath}},
 		'branchNameSubURL': {{.root.BranchNameSubURL}},
-		'noResults': {{ctx.Locale.Tr "repo.pulls.no_results"}},
+		'noResults': {{ctx.Locale.Tr "no_results_found"}},
 	};
 	{{if .release}}
 	data.release = {
diff --git a/templates/repo/diff/compare.tmpl b/templates/repo/diff/compare.tmpl
index cd56ebfcb2..32d0dc9858 100644
--- a/templates/repo/diff/compare.tmpl
+++ b/templates/repo/diff/compare.tmpl
@@ -29,7 +29,7 @@
 	{{- end -}}
 	<div class="ui segment choose branch">
 		<a class="gt-mr-3" href="{{$.HeadRepo.Link}}/compare/{{PathEscapeSegments $.HeadBranch}}{{$.CompareSeparator}}{{if not $.PullRequestCtx.SameRepo}}{{PathEscape $.BaseName}}/{{PathEscape $.Repository.Name}}:{{end}}{{PathEscapeSegments $.BaseBranch}}" title="{{ctx.Locale.Tr "repo.pulls.switch_head_and_base"}}">{{svg "octicon-git-compare"}}</a>
-		<div class="ui floating filter dropdown" data-no-results="{{ctx.Locale.Tr "repo.pulls.no_results"}}">
+		<div class="ui floating filter dropdown" data-no-results="{{ctx.Locale.Tr "no_results_found"}}">
 			<div class="ui basic small button">
 				<span class="text">{{if $.PageIsComparePull}}{{ctx.Locale.Tr "repo.pulls.compare_base"}}{{else}}{{ctx.Locale.Tr "repo.compare.compare_base"}}{{end}}: {{$BaseCompareName}}:{{$.BaseBranch}}</span>
 				{{svg "octicon-triangle-down" 14 "dropdown icon"}}
diff --git a/templates/repo/issue/branch_selector_field.tmpl b/templates/repo/issue/branch_selector_field.tmpl
index 9b7a05ce35..4160e47465 100644
--- a/templates/repo/issue/branch_selector_field.tmpl
+++ b/templates/repo/issue/branch_selector_field.tmpl
@@ -4,8 +4,8 @@
 <form method="post" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/ref" id="update_issueref_form">
 	{{$.CsrfTokenHtml}}
 </form>
-
-<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating filter select-branch dropdown" data-no-results="{{ctx.Locale.Tr "repo.pulls.no_results"}}">
+{{/* TODO: share this branch selector dropdown with the same in repo page */}}
+<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating filter select-branch dropdown" data-no-results="{{ctx.Locale.Tr "no_results_found"}}">
 	<div class="ui basic small button">
 		<span class="text branch-name">{{if .Reference}}{{$.RefEndName}}{{else}}{{ctx.Locale.Tr "repo.issues.no_ref"}}{{end}}</span>
 		{{if .HasIssuesOrPullsWritePermission}}{{svg "octicon-triangle-down" 14 "dropdown icon"}}{{end}}
@@ -18,12 +18,12 @@
 		<div class="header">
 			<div class="ui grid">
 				<div class="two column row">
-					<a class="reference column" href="#" data-target="#branch-list">
+					<a class="reference column muted" href="#" data-target="#branch-list">
 						<span class="text black">
 							{{svg "octicon-git-branch" 16 "gt-mr-2"}}{{ctx.Locale.Tr "repo.branches"}}
 						</span>
 					</a>
-					<a class="reference column" href="#" data-target="#tag-list">
+					<a class="reference column muted" href="#" data-target="#tag-list">
 						<span class="text">
 							{{svg "octicon-tag" 16 "gt-mr-2"}}{{ctx.Locale.Tr "repo.tags"}}
 						</span>
@@ -31,12 +31,15 @@
 				</div>
 			</div>
 		</div>
+		<div class="branch-tag-divider"></div>
 		<div id="branch-list" class="scrolling menu reference-list-menu {{if not .Issue}}new-issue{{end}}">
 			{{if .Reference}}
 				<div class="item text small" data-id="" data-id-selector="#ref_selector"><strong><a href="#">{{ctx.Locale.Tr "repo.clear_ref"}}</a></strong></div>
 			{{end}}
 			{{range .Branches}}
 				<div class="item" data-id="refs/heads/{{.}}" data-name="{{.}}" data-id-selector="#ref_selector">{{.}}</div>
+			{{else}}
+				<div class="item">{{ctx.Locale.Tr "no_results_found"}}</div>
 			{{end}}
 		</div>
 		<div id="tag-list" class="scrolling menu reference-list-menu {{if not .Issue}}new-issue{{end}} gt-hidden">
@@ -45,6 +48,8 @@
 			{{end}}
 			{{range .Tags}}
 				<div class="item" data-id="refs/tags/{{.}}" data-name="tags/{{.}}" data-id-selector="#ref_selector">{{.}}</div>
+			{{else}}
+				<div class="item">{{ctx.Locale.Tr "no_results_found"}}</div>
 			{{end}}
 		</div>
 	</div>
diff --git a/templates/repo/issue/view_title.tmpl b/templates/repo/issue/view_title.tmpl
index 764a8b01ab..5a9fcb014a 100644
--- a/templates/repo/issue/view_title.tmpl
+++ b/templates/repo/issue/view_title.tmpl
@@ -88,7 +88,7 @@
 							</div>
 						</div>
 						{{svg "octicon-arrow-right"}}
-						<div class="ui floating filter dropdown" data-no-results="{{ctx.Locale.Tr "repo.pulls.no_results"}}">
+						<div class="ui floating filter dropdown" data-no-results="{{ctx.Locale.Tr "no_results_found"}}">
 							<div class="ui basic small button">
 								<span class="text" id="pull-target-branch" data-basename="{{$.BaseName}}" data-branch="{{$.BaseBranch}}">{{ctx.Locale.Tr "repo.pulls.compare_base"}}: {{$.BaseName}}:{{$.BaseBranch}}</span>
 								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
diff --git a/templates/repo/wiki/view.tmpl b/templates/repo/wiki/view.tmpl
index 541b1e9b42..19da3fd199 100644
--- a/templates/repo/wiki/view.tmpl
+++ b/templates/repo/wiki/view.tmpl
@@ -5,7 +5,7 @@
 	<div class="ui container">
 		<div class="repo-button-row">
 			<div class="gt-df gt-ac">
-				<div class="ui floating filter dropdown" data-no-results="{{ctx.Locale.Tr "repo.pulls.no_results"}}">
+				<div class="ui floating filter dropdown" data-no-results="{{ctx.Locale.Tr "no_results_found"}}">
 					<div class="ui basic small button">
 						<span class="text">
 							{{ctx.Locale.Tr "repo.wiki.page"}}:
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index 3a1f39d2ce..0eba77dbfe 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -3004,3 +3004,33 @@ tbody.commit-list {
 #cherry-pick-modal .scrolling.menu {
   max-height: 200px;
 }
+
+/* Branch tag selector - TODO: Merge this into the same selector on repo page */
+.repository .issue-content .issue-content-right  .ui.grid .column.row {
+  padding: 10px;
+  padding-bottom: 0;
+}
+.repository .issue-content .issue-content-right  .ui.grid .column.muted {
+  padding: 0;
+}
+.repository .issue-content .issue-content-right  .ui.grid .column.muted .text {
+  display: inline-block;
+  padding: 10px;
+  width: 100%;
+  text-align: center;
+  border: 1px solid transparent;
+  border-bottom: none;
+}
+.repository .issue-content .issue-content-right .ui.grid .column.muted .text.black {
+  border-color: var(--color-secondary);
+  background: var(--color-menu);
+  border-top-left-radius: var(--border-radius);
+  border-top-right-radius: var(--border-radius);
+}
+.repository .issue-content .issue-content-right .ui.dropdown  .scrolling.menu {
+  border-top: none;
+}
+.repository .issue-content .issue-content-right .branch-tag-divider {
+  margin-top: -1px;
+  border-top: 1px solid var(--color-secondary);
+}