{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin user")}}
	<div class="admin-setting-content">
		<h4 class="ui top attached header">
			{{ctx.Locale.Tr "admin.emails.email_manage_panel"}} ({{ctx.Locale.Tr "admin.total" .Total}})
		</h4>
		<div class="ui attached segment">
			<div class="ui secondary filter menu tw-items-center tw-mx-0">
				<form class="ui form ignore-dirty tw-flex-1">
					{{template "shared/search/combo" dict "Value" .Keyword}}
				</form>
				<!-- Sort -->
				<div class="ui dropdown type jump item tw-mr-0">
					<span class="text">
						{{ctx.Locale.Tr "repo.issues.filter_sort"}}
					</span>
					{{svg "octicon-triangle-down" 14 "dropdown icon"}}
					<div class="menu">
						<a class="{{if or (eq .SortType "email") (not .SortType)}}active {{end}}item" href="?sort=email&q={{$.Keyword}}">{{ctx.Locale.Tr "admin.emails.filter_sort.email"}}</a>
						<a class="{{if eq .SortType "reverseemail"}}active {{end}}item" href="?sort=reverseemail&q={{$.Keyword}}">{{ctx.Locale.Tr "admin.emails.filter_sort.email_reverse"}}</a>
						<a class="{{if eq .SortType "username"}}active {{end}}item" href="?sort=username&q={{$.Keyword}}">{{ctx.Locale.Tr "admin.emails.filter_sort.name"}}</a>
						<a class="{{if eq .SortType "reverseusername"}}active {{end}}item" href="?sort=reverseusername&q={{$.Keyword}}">{{ctx.Locale.Tr "admin.emails.filter_sort.name_reverse"}}</a>
					</div>
				</div>
			</div>
		</div>
		<div class="ui attached table segment">
			<table class="ui very basic striped table unstackable">
				<thead>
					<tr>
						<th data-sortt-asc="username" data-sortt-desc="reverseusername">
							{{ctx.Locale.Tr "admin.users.name"}}
							{{SortArrow "username" "reverseusername" $.SortType false}}
						</th>
						<th>{{ctx.Locale.Tr "admin.users.full_name"}}</th>
						<th data-sortt-asc="email" data-sortt-desc="reverseemail" data-sortt-default="true">
							{{ctx.Locale.Tr "email"}}
							{{SortArrow "email" "reverseemail" $.SortType true}}
						</th>
						<th>{{ctx.Locale.Tr "admin.emails.primary"}}</th>
						<th>{{ctx.Locale.Tr "admin.emails.activated"}}</th>
						<th></th>
					</tr>
				</thead>
				<tbody>
					{{range .Emails}}
						<tr>
							<td><a href="{{AppSubUrl}}/{{.Name | PathEscape}}">{{.Name}}</a></td>
							<td class="gt-ellipsis tw-max-w-48">{{.FullName}}</td>
							<td class="gt-ellipsis tw-max-w-48">{{.Email}}</td>
							<td>{{if .IsPrimary}}{{svg "octicon-check"}}{{else}}{{svg "octicon-x"}}{{end}}</td>
							<td>
								{{if .CanChange}}
									<a class="link-email-action" href data-uid="{{.UID}}"
										data-email="{{.Email}}"
										data-primary="{{if .IsPrimary}}1{{else}}0{{end}}"
										data-activate="{{if .IsActivated}}0{{else}}1{{end}}">
										{{if .IsActivated}}{{svg "octicon-check"}}{{else}}{{svg "octicon-x"}}{{end}}
									</a>
								{{else}}
									{{if .IsActivated}}{{svg "octicon-check"}}{{else}}{{svg "octicon-x"}}{{end}}
								{{end}}
							</td>
							<td>
								<div class="tw-flex tw-gap-2">
									<a class="delete-button" href="" data-url="{{$.Link}}/delete" data-id="{{.ID}}" data-data-uid="{{.UID}}" data-modal-id="delete-email">{{svg "octicon-trash"}}</a>
								</div>
							</td>
						</tr>
					{{else}}
						<tr><td class="tw-text-center" colspan="6">{{ctx.Locale.Tr "repo.pulls.no_results"}}</td></tr>
					{{end}}
				</tbody>
			</table>
		</div>

		{{template "base/paginate" .}}

		<dialog id="change-email-modal">
			<article>
				<header>{{ctx.Locale.Tr "admin.emails.change_email_header"}}</header>
				<div class="content">
					<p class="center">{{ctx.Locale.Tr "admin.emails.change_email_text"}}</p>
				</div>
				<form class="ui form" id="email-action-form" action="{{AppSubUrl}}/admin/emails/activate" method="post">
					{{$.CsrfTokenHtml}}

					<input type="hidden" id="query-sort" name="sort" value="{{.SortType}}">
					<input type="hidden" id="query-keyword" name="q" value="{{.Keyword}}">
					<input type="hidden" id="query-primary" name="is_primary" value="{{.IsPrimary}}" required>
					<input type="hidden" id="query-activated" name="is_activated" value="{{.IsActivated}}" required>

					<input type="hidden" id="form-uid" name="uid" value="" required>
					<input type="hidden" id="form-email" name="email" value="" required>
					<input type="hidden" id="form-primary" name="primary" value="" required>
					<input type="hidden" id="form-activate" name="activate" value="" required>

					<div class="center">
						{{template "base/modal_actions_confirm" .}}
					</div>
				</form>
			</article>
		</dialog>
	</div>

<div class="ui g-modal-confirm delete modal" id="delete-email">
	<div class="header">
		{{svg "octicon-trash"}}
		{{ctx.Locale.Tr "admin.emails.delete"}}
	</div>
	<div class="content">
		{{ctx.Locale.Tr "admin.emails.delete_desc"}}
	</div>
	{{template "base/modal_actions_confirm" .}}
</div>

{{template "admin/layout_footer" .}}