@page "/administration"
@attribute [Authorize(Policy = Policies.IsModerator)]
@inherits LocalizableComponentBase

<Title>@Localizer["Administration"]</Title>

@* Moderators handle reports and read the staff's log. Administrators also say what the server is (Instance), set its
   rules, write its announcements, block servers for everyone, choose its relays and media limits, read the federation
   statistics, and back up and restore the server. PrivaPub checks the role on every call; the sections only follow it.
   Each section is a collapse marked data-admin-section; its panel loads when the page opens. *@
<section class="block relative w-full h-full neo-inset neo-xs rounded-xl">

	<div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto">

		<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="reports">
			<Header>
				<p class="inline-flex items-center gap-2">
					<i class="ion-md-flag text-xl"></i> <span>@Localizer["Reports"]</span>
				</p>
			</Header>
			<ChildContent>
				<div class="block w-full p-3 md:p-4">
					<ReportsPanel />
				</div>
			</ChildContent>
		</DCollapse>

		<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="log">
			<Header>
				<p class="inline-flex items-center gap-2">
					<i class="ion-md-list-box text-xl"></i> <span>@Localizer["Moderation log"]</span>
				</p>
			</Header>
			<ChildContent>
				<div class="block w-full p-3 md:p-4">
					<ModerationLogPanel />
				</div>
			</ChildContent>
		</DCollapse>

		<AuthorizeView Policy="@Policies.IsAdmin">
			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="instance">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-information-circle text-xl"></i> <span>@Localizer["Instance"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<InstancePanel />
					</div>
				</ChildContent>
			</DCollapse>

			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="rules">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-book text-xl"></i> <span>@Localizer["Rules"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<RulesPanel />
					</div>
				</ChildContent>
			</DCollapse>

			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="announcements">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-megaphone text-xl"></i> <span>@Localizer["Announcements"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<AnnouncementsPanel />
					</div>
				</ChildContent>
			</DCollapse>

			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="blocks">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-globe text-xl"></i> <span>@Localizer["Blocked servers"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<ServerBlocksPanel />
					</div>
				</ChildContent>
			</DCollapse>

			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="relays">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-radio text-xl"></i> <span>@Localizer["Relays"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<RelaysPanel />
					</div>
				</ChildContent>
			</DCollapse>

			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="media">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-images text-xl"></i> <span>@Localizer["Media limits"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<MediaLimitsPanel />
					</div>
				</ChildContent>
			</DCollapse>

			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="statistics">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-stats text-xl"></i> <span>@Localizer["Statistics"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<StatisticsPanel />
					</div>
				</ChildContent>
			</DCollapse>

			<DCollapse Icon="DCollapseIcon.Arrow" data-admin-section="backups">
				<Header>
					<p class="inline-flex items-center gap-2">
						<i class="ion-md-archive text-xl"></i> <span>@Localizer["Backups"]</span>
					</p>
				</Header>
				<ChildContent>
					<div class="block w-full p-3 md:p-4">
						<BackupsPanel />
					</div>
				</ChildContent>
			</DCollapse>
		</AuthorizeView>

	</div>

</section>