improve protected branch to add whitelist support (#2451)

* improve protected branch to add whitelist support

* fix lint

* fix style check

* fix tests

* fix description on UI and import

* fix test

* bug fixed

* fix tests and languages

* move isSliceInt64Eq to util pkg; improve function names & typo

2 files changed, 79 insertions, 9 deletions

diff --git a/templates/repo/settings/branches.tmpl b/templates/repo/settings/branches.tmpl
index 7008e2e530..b685217c87 100644
--- a/templates/repo/settings/branches.tmpl
+++ b/templates/repo/settings/branches.tmpl
@@ -39,20 +39,16 @@
 		<h4 class="ui top attached header">
 			{{.i18n.Tr "repo.settings.protected_branch"}}
 		</h4>
+
 		<div class="ui attached table segment">
 			<div class="ui grid padded">
 				<div class="eight wide column">
 					<div class="ui fluid dropdown selection" tabindex="0">
-						<select id="protectedBranch" name="branch" data-url="{{.Repository.Link}}/settings/branches?action=protected_branch">
-							{{range .LeftBranches}}
-								<option value="">{{$.i18n.Tr "repo.settings.choose_branch"}}</option>
-								<option value="{{.}}">{{.}}</option>
-							{{end}}
-						</select><i class="dropdown icon"></i>
+						<i class="dropdown icon"></i>
 						<div class="default text">{{.i18n.Tr "repo.settings.choose_branch"}}</div>
 						<div class="menu transition hidden" tabindex="-1" style="display: block !important;">
 							{{range .LeftBranches}}
-								<div class="item" data-value="{{.}}">{{.}}</div>
+								<a class="item" href="{{$.Repository.Link}}/settings/branches/{{.}}">{{.}}</a>
 							{{end}}
 						</div>
 					</div>
@@ -65,8 +61,8 @@
 						<tbody>
 							{{range .ProtectedBranches}}
 								<tr>
-									<td><div class="ui large label">{{.BranchName}}</div></td>
-									<td class="right aligned"><button class="rm ui red button" data-url="{{$.Repository.Link}}/settings/branches?action=protected_branch&id={{.ID}}" data-val="{{.BranchName}}">Delete</button></td>
+									<td><div class="ui basic label blue">{{.BranchName}}</div></td>
+									<td class="right aligned"><a class="rm ui button" href="{{$.Repository.Link}}/settings/branches/{{.BranchName}}">Edit</a></td>
 								</tr>
 							{{else}}
 								<tr class="center aligned"><td>{{.i18n.Tr "repo.settings.no_protected_branch"}}</td></tr>
diff --git a/templates/repo/settings/protected_branch.tmpl b/templates/repo/settings/protected_branch.tmpl
new file mode 100644
index 0000000000..a3a153eb3f
--- /dev/null
+++ b/templates/repo/settings/protected_branch.tmpl
@@ -0,0 +1,74 @@
+{{template "base/head" .}}
+<div class="repository settings branches">
+	{{template "repo/header" .}}
+	{{template "repo/settings/navbar" .}}
+	<div class="ui container">
+		{{template "base/alert" .}}
+		<h4 class="ui top attached header">
+			{{.i18n.Tr "repo.settings.branch_protection" .Branch.BranchName | Str2html}}
+		</h4>
+		<div class="ui attached segment branch-protection">
+			<form class="ui form" action="{{.Link}}" method="post">
+				{{.CsrfTokenHtml}}
+				<div class="inline field">
+					<div class="ui checkbox">
+						<input class="enable-protection" name="protected" type="checkbox" data-target="#protection_box" {{if .Branch.IsProtected}}checked{{end}}>
+						<label>{{.i18n.Tr "repo.settings.protect_this_branch"}}</label>
+						<p class="help">{{.i18n.Tr "repo.settings.protect_this_branch_desc"}}</p>
+					</div>
+				</div>
+				<div id="protection_box" class="fields {{if not .Branch.IsProtected}}disabled{{end}}">
+					<div class="field">
+						<div class="ui checkbox">
+							<input class="enable-whitelist" name="enable_whitelist" type="checkbox" data-target="#whitelist_box" {{if .Branch.EnableWhitelist}}checked{{end}}>
+							<label>{{.i18n.Tr "repo.settings.protect_whitelist_committers"}}</label>
+							<p class="help">{{.i18n.Tr "repo.settings.protect_whitelist_committers_desc"}}</p>
+						</div>
+					</div>
+					<div id="whitelist_box" class="fields {{if not .Branch.EnableWhitelist}}disabled{{end}}">
+						<div class="whitelist field">
+							<label>{{.i18n.Tr "repo.settings.protect_whitelist_users"}}</label>
+							<div class="ui multiple search selection dropdown">
+								<input type="hidden" name="whitelist_users" value="{{.whitelist_users}}">
+								<div class="default text">{{.i18n.Tr "repo.settings.protect_whitelist_search_users"}}</div>
+								<div class="menu">
+									{{range .Users}}
+										<div class="item" data-value="{{.ID}}">
+											<img class="ui mini image" src="{{.RelAvatarLink}}">
+											{{.Name}}
+										</div>
+									{{end}}
+								</div>
+							</div>
+						</div>
+						{{if .Owner.IsOrganization}}
+							<br>
+							<div class="whitelist field">
+								<label>{{.i18n.Tr "repo.settings.protect_whitelist_teams"}}</label>
+								<div class="ui multiple search selection dropdown">
+									<input type="hidden" name="whitelist_teams" value="{{.whitelist_teams}}">
+									<div class="default text">{{.i18n.Tr "repo.settings.protect_whitelist_search_teams"}}</div>
+									<div class="menu">
+										{{range .Teams}}
+											<div class="item" data-value="{{.ID}}">
+												<i class="octicon octicon-jersey"></i>
+												{{.Name}}
+											</div>
+										{{end}}
+									</div>
+								</div>
+							</div>
+						{{end}}
+					</div>
+				</div>
+
+				<div class="ui divider"></div>
+
+				<div class="field">
+					<button class="ui green button">{{$.i18n.Tr "repo.settings.update_settings"}}</button>
+				</div>
+			</form>
+		</div>
+	</div>
+</div>
+{{template "base/footer" .}}
\ No newline at end of file