Add user status filter to admin user management page (#16770)

It makes Admin's life easier to filter users by various status.

* introduce window.config.PageData to pass template data to javascript module and small refactor

move legacy window.ActivityTopAuthors to window.config.PageData.ActivityTopAuthors
make HTML structure more IDE-friendly in footer.tmpl and head.tmpl
remove incorrect <style class="list-search-style"></style> in head.tmpl
use log.Error instead of log.Critical in admin user search

* use LEFT JOIN instead of SubQuery when admin filters users by 2fa. revert non-en locale.

* use OptionalBool instead of status map

* refactor SearchUserOptions.toConds to SearchUserOptions.toSearchQueryBase

* add unit test for user search

* only allow admin to use filters to search users

4 files changed, 61 insertions, 9 deletions

diff --git a/templates/admin/base/search.tmpl b/templates/admin/base/search.tmpl
index e4e7e2d462..98fd3f4a07 100644
--- a/templates/admin/base/search.tmpl
+++ b/templates/admin/base/search.tmpl
@@ -15,7 +15,7 @@
 		</div>
 	</div>
 </div>
-<form class="ui form ignore-dirty"  style="max-width: 90%">
+<form class="ui form ignore-dirty"  style="max-width: 90%;">
 	<div class="ui fluid action input">
 		<input name="q" value="{{.Keyword}}" placeholder="{{.i18n.Tr "explore.search"}}..." autofocus>
 		<button class="ui blue button">{{.i18n.Tr "explore.search"}}</button>
diff --git a/templates/admin/user/list.tmpl b/templates/admin/user/list.tmpl
index 661d38cb03..ceab7a9b1b 100644
--- a/templates/admin/user/list.tmpl
+++ b/templates/admin/user/list.tmpl
@@ -10,7 +10,55 @@
 			</div>
 		</h4>
 		<div class="ui attached segment">
-			{{template "admin/base/search" .}}
+			<form class="ui form ignore-dirty" id="user-list-search-form">
+
+				<!-- Right Menu -->
+				<div class="ui right floated secondary filter menu">
+					<!-- Status Filter Menu Item -->
+					<div class="ui dropdown type jump item">
+						<span class="text">{{.i18n.Tr "admin.users.list_status_filter.menu_text"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}</span>
+						<div class="menu">
+							<a class="item j-reset-status-filter">{{.i18n.Tr "admin.users.list_status_filter.reset"}}</a>
+							<div class="ui divider"></div>
+							<label class="item"><input type="radio" name="status_filter[is_admin]" value="1"> {{.i18n.Tr "admin.users.list_status_filter.is_admin"}}</label>
+							<label class="item"><input type="radio" name="status_filter[is_admin]" value="0"> {{.i18n.Tr "admin.users.list_status_filter.not_admin"}}</label>
+							<div class="ui divider"></div>
+							<label class="item"><input type="radio" name="status_filter[is_active]" value="1"> {{.i18n.Tr "admin.users.list_status_filter.is_active"}}</label>
+							<label class="item"><input type="radio" name="status_filter[is_active]" value="0"> {{.i18n.Tr "admin.users.list_status_filter.not_active"}}</label>
+							<div class="ui divider"></div>
+							<label class="item"><input type="radio" name="status_filter[is_restricted]" value="0"> {{.i18n.Tr "admin.users.list_status_filter.not_restricted"}}</label>
+							<label class="item"><input type="radio" name="status_filter[is_restricted]" value="1"> {{.i18n.Tr "admin.users.list_status_filter.is_restricted"}}</label>
+							<div class="ui divider"></div>
+							<label class="item"><input type="radio" name="status_filter[is_prohibit_login]" value="0"> {{.i18n.Tr "admin.users.list_status_filter.not_prohibit_login"}}</label>
+							<label class="item"><input type="radio" name="status_filter[is_prohibit_login]" value="1"> {{.i18n.Tr "admin.users.list_status_filter.is_prohibit_login"}}</label>
+							<div class="ui divider"></div>
+							<label class="item"><input type="radio" name="status_filter[is_2fa_enabled]" value="1"> {{.i18n.Tr "admin.users.list_status_filter.is_2fa_enabled"}}</label>
+							<label class="item"><input type="radio" name="status_filter[is_2fa_enabled]" value="0"> {{.i18n.Tr "admin.users.list_status_filter.not_2fa_enabled"}}</label>
+						</div>
+					</div>
+
+					<!-- Sort Menu Item -->
+					<div class="ui dropdown type jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.filter_sort"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<button class="item" name="sort" value="oldest">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</button>
+							<button class="item" name="sort" value="newest">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</button>
+							<button class="item" name="sort" value="alphabetically">{{.i18n.Tr "repo.issues.label.filter_sort.alphabetically"}}</button>
+							<button class="item" name="sort" value="reversealphabetically">{{.i18n.Tr "repo.issues.label.filter_sort.reverse_alphabetically"}}</button>
+							<button class="item" name="sort" value="recentupdate">{{.i18n.Tr "repo.issues.filter_sort.recentupdate"}}</button>
+							<button class="item" name="sort" value="leastupdate">{{.i18n.Tr "repo.issues.filter_sort.leastupdate"}}</button>
+						</div>
+					</div>
+				</div>
+
+				<!-- Search Text -->
+				<div class="ui fluid action input" style="max-width: 70%;">
+					<input name="q" value="{{.Keyword}}" placeholder="{{.i18n.Tr "explore.search"}}..." autofocus>
+					<button class="ui blue button">{{.i18n.Tr "explore.search"}}</button>
+				</div>
+			</form>
 		</div>
 		<div class="ui attached table segment">
 			<table class="ui very basic striped table">
@@ -28,9 +76,9 @@
 						<th>{{.i18n.Tr "admin.users.2fa"}}</th>
 						<th>{{.i18n.Tr "admin.users.repos"}}</th>
 						<th>{{.i18n.Tr "admin.users.created"}}</th>
-						<th data-sortt-asc="recentupdate" data-sortt-desc="leastupdate">
+						<th data-sortt-asc="leastupdate" data-sortt-desc="recentupdate">
 							{{.i18n.Tr "admin.users.last_login"}}
-							{{SortArrow "recentupdate" "leastupdate" $.SortType false}}
+							{{SortArrow "leastupdate" "recentupdate" $.SortType false}}
 						</th>
 						<th>{{.i18n.Tr "admin.users.edit"}}</th>
 					</tr>
diff --git a/templates/base/footer.tmpl b/templates/base/footer.tmpl
index 25e163b19b..ead5630dae 100644
--- a/templates/base/footer.tmpl
+++ b/templates/base/footer.tmpl
@@ -1,8 +1,9 @@
-{{/*
+{{if false}}
+	{{/* to make html structure "likely" complete to prevent IDE warnings */}}
 <html>
 <body>
 	<div>
-*/}}
+{{end}}
 
 	{{template "custom/body_inner_post" .}}
 
diff --git a/templates/base/head.tmpl b/templates/base/head.tmpl
index 15f2826abf..817bdae288 100644
--- a/templates/base/head.tmpl
+++ b/templates/base/head.tmpl
@@ -26,6 +26,7 @@
 	<meta name="go-source" content="{{.GoGetImport}} _ {{.GoDocDirectory}} {{.GoDocFile}}">
 {{end}}
 	<script>
+		<!-- /* eslint-disable */ -->
 		window.config = {
 			AppVer: '{{AppVer}}',
 			AppSubUrl: '{{AppSubUrl}}',
@@ -33,6 +34,7 @@
 			CustomEmojis: {{CustomEmojis}},
 			UseServiceWorker: {{UseServiceWorker}},
 			csrf: '{{.CsrfToken}}',
+			PageData: {{ .PageData }},
 			HighlightJS: {{if .RequireHighlightJS}}true{{else}}false{{end}},
 			SimpleMDE: {{if .RequireSimpleMDE}}true{{else}}false{{end}},
 			Tribute: {{if .RequireTribute}}true{{else}}false{{end}},
@@ -75,7 +77,6 @@
 			.ui.secondary.menu .dropdown.item > .menu { margin-top: 0; }
 		</style>
 	</noscript>
-	<style class="list-search-style"></style>
 {{if .PageIsUserProfile}}
 	<meta property="og:title" content="{{.Owner.Name}}" />
 	<meta property="og:type" content="profile" />
@@ -134,8 +135,10 @@
 				{{template "base/head_navbar" .}}
 			</div><!-- end bar -->
 		{{end}}
-{{/*
+
+{{if false}}
+	{{/* to make html structure "likely" complete to prevent IDE warnings */}}
 	</div>
 </body>
 </html>
-*/}}
+{{end}}