{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin")}}
<div class="admin-setting-content">
	<h4 class="ui top attached header">
		{{ctx.Locale.Tr "admin.moderation.reports"}}
	</h4>

	<div class="ui attached segment">
		{{if .Reports}}
		<div class="flex-list">
			<div class="flex-item tw-items-center">
				<div class="flex-item-leading">
					<span class="inline">Type</span>
				</div>
				<div class="flex-item-main">
					<span class="inline">Summary</span>
				</div>
				<div class="flex-item-trailing">
					<span>{{ctx.Locale.Tr "admin.moderation.reports"}}</span>
				</div>
			</div>
			{{range .Reports}}
			{{$reportDivID := print "report-" .ID}}
			{{$reportDivSelector := print "#" $reportDivID}}
			<div class="flex-item report" id="{{$reportDivID}}">
				<div class="flex-item-leading">
					{{svg .ContentTypeIconName 24}}
				</div>
				<div class="flex-item-main">
					<div class="flex-item-title">
						{{if .ContentReference}}
						<a href="{{AppSubUrl}}/{{.ContentURL}}">{{.ContentReference}}</a>
						{{else}}
						<em>{{ctx.Locale.Tr "admin.moderation.deleted_content_ref" .ContentType .ContentID}}</em>
						{{end}}
					</div>
					<div class="flex-items-inline">
						<span class="item tw-mr-2">
							{{svg "octicon-calendar"}}
							{{DateUtils.TimeSince .CreatedUnix}}
						</span>
						<span class="item tw-mr-2">
							{{svg "octicon-report"}}
							{{if .ReporterName}}<a href="{{AppSubUrl}}/{{.ReporterName}}">{{.ReporterName}}</a>{{else}}{{$.GhostUserName}}{{end}}
						</span>
						<span class="item ui label">
							{{svg "octicon-tag" 12}}
							{{ctx.Locale.Tr (index $.AbuseCategories .Category)}}
						</span>
					</div>

					<div class="flex-item-body">
						<span class="text truncate">{{ctx.Locale.Tr "moderation.report_remarks"}}: <em>{{.Remarks}}</em></span>
					</div>
				</div>

				{{$postURL := print AppSubUrl "/admin/abuse_reports/act"}}

				<div class="flex-item-trailing">
					<div class="flex-item-main tw-max-w-12 sm:tw-max-w-40">
						<a class="flex-item-trailing tw-p-1" href="{{AppSubUrl}}/admin/moderation/reports/type/{{.ContentType}}/id/{{.ContentID}}">
							<span class="tw-text-16 tw-font-semibold">{{.ReportedTimes}}</span>{{svg "octicon-report" "tw-ml-2"}}
						</a>
						<div class="button-sequence right tw-items-center"
								hx-target="{{$reportDivSelector}}" hx-indicator="{{$reportDivSelector}}"
								hx-vals='{"content_type": {{.ContentType}}, "content_id": {{.ContentID}}}'>
							<button class="item tw-p-1 ui button" data-tooltip-content="{{ctx.Locale.Tr "moderation.report.mark_as_handled"}}"
									hx-post="{{$postURL}}" hx-vals='{"report_action": {{$.MarkAsHandled}}}'>
								{{svg "octicon-check"}}
							</button>
							<button class="item tw-p-1 ui button" data-tooltip-content="{{ctx.Locale.Tr "moderation.report.mark_as_ignored"}}"
									hx-post="{{$postURL}}" hx-vals='{"report_action": {{$.MarkAsIgnored}}}'>
								{{svg "octicon-x"}}
							</button>
							{{if .ContentReference}} {{/* the reference is missing when the content was already deleted */}}
							<details class="dropdown item dir-rtl">
								<summary class="tw-p-1" data-tooltip-content="{{ctx.Locale.Tr "profile.actions.tooltip"}}">{{svg "octicon-kebab-horizontal"}}</summary>
								<div class="content">
									<ul
											hx-target="{{$reportDivSelector}}" hx-indicator="{{$reportDivSelector}}"
											hx-vals='{"content_type": {{.ContentType}}, "content_id": {{.ContentID}}}'>
										{{if .ReportedContentIsUser}}
										<li>
											<a hx-post="{{$postURL}}" hx-vals='{"content_action": {{$.ActionSuspendAccount}}}' hx-swap="none" class="item">
												{{svg "octicon-x"}}{{ctx.Locale.Tr "moderation.action.account.suspend"}}
											</a>
										</li>
										<li>
											<a hx-post="{{$postURL}}" hx-vals='{"content_action": {{$.ActionDeleteAccount}}, "report_action": {{$.MarkAsHandled}}}' class="item">
												{{svg "octicon-trash"}}{{ctx.Locale.Tr "moderation.action.account.delete"}}
											</a>
										</li>
										{{else if .ReportedContentIsRepo}}
										<li>
											<a hx-post="{{$postURL}}" hx-vals='{"content_action": {{$.ActionDeleteRepo}}, "report_action": {{$.MarkAsHandled}}}' class="item">
												{{svg "octicon-trash"}}{{ctx.Locale.Tr "moderation.action.repo.delete"}}
											</a>
										</li>
										{{else if .ReportedContentIsIssue}}
										<li>
											<a hx-post="{{$postURL}}" hx-vals='{"content_action": {{$.ActionDeleteIssue}}, "report_action": {{$.MarkAsHandled}}}' class="item">
												{{svg "octicon-trash"}}{{ctx.Locale.Tr "moderation.action.issue.delete"}}
											</a>
										</li>
										{{else if .ReportedContentIsComment}}
										<li>
											<a hx-post="{{$postURL}}" hx-vals='{"content_action": {{$.ActionDeleteComment}}, "report_action": {{$.MarkAsHandled}}}' class="item">
												{{svg "octicon-trash"}}{{ctx.Locale.Tr "moderation.action.comment.delete"}}
											</a>
										</li>
										{{end}}
									</ul>
								</div>
							</details>
							{{end}}
						</div>
					</div>
				</div>
			</div>
			{{end}}
		</div>
		{{else}}
			<p class="tw-text-center">{{ctx.Locale.Tr "admin.moderation.no_open_reports"}}</p>
		{{end}}
	</div>
</div>
{{template "admin/layout_footer" .}}