feat(frontend): show audit log entry for closed reports

Foxnouns.Frontend/src/routes/admin/reports/[id]/+page.server.ts

@@ -7,7 +7,12 @@ export const load = async ({ params, fetch, cookies }) => {
 		fetch,
 		cookies,
 	});
-	return { report: resp.report, user: resp.user, member: resp.member };
+	return {
+		report: resp.report,
+		user: resp.user,
+		member: resp.member,
+		auditLogEntry: resp.audit_log_entry,
+	};
 };
 
 export const actions = createModactions();

Foxnouns.Frontend/src/routes/admin/reports/[id]/+page.svelte

@@ -2,6 +2,7 @@
 	import type { Member } from "$api/models/member";
 	import type { User } from "$api/models/user";
 	import ActionForm from "$components/admin/ActionForm.svelte";
+	import ClosedReportAuditLog from "$components/admin/ClosedReportAuditLog.svelte";
 	import PartialProfileCard from "$components/admin/PartialProfileCard.svelte";
 	import ProfileHeader from "$components/profile/ProfileHeader.svelte";
 	import MemberCard from "$components/profile/user/MemberCard.svelte";
@@ -10,13 +11,21 @@
 
 	type Props = { data: PageData; form: ActionData };
 	let { data, form }: Props = $props();
-	let { report, user, member } = $derived(data);
+	let { report, user, auditLogEntry } = $derived(data);
 </script>
 
 <svelte:head>
 	<title>Report on @{user.username} • pronouns.cc</title>
 </svelte:head>
 
+{#if report.status === "CLOSED"}
+	<div class="alert alert-secondary">
+		This report has already been handled. <a href="#report-status" class="alert-link"
+			>See audit log entry</a
+		>
+	</div>
+{/if}
+
 <div class="row">
 	<div class="col-md">
 		<h3>Target user</h3>
@@ -55,15 +64,26 @@
 	</div>
 </div>
 
-<div class="row">
-	<h3>Take action</h3>
-	<ActionForm
-		userId={report.target_user.id}
-		reportId={report.id}
-		memberId={report.target_member?.id}
-		{form}
-	/>
-</div>
+{#if report.status === "OPEN"}
+	<div class="row">
+		<h3>Take action</h3>
+		<ActionForm
+			userId={report.target_user.id}
+			reportId={report.id}
+			memberId={report.target_member?.id}
+			{form}
+		/>
+	</div>
+{:else if report.status === "CLOSED" && auditLogEntry}
+	<ClosedReportAuditLog entry={auditLogEntry} />
+{:else}
+	<div class="row">
+		<h3>Closed by an unknown moderator</h3>
+		<p>
+			<em>This should not happen!</em>
+		</p>
+	</div>
+{/if}
 
 {#if report.snapshot}
 	<h3>Profile at time of report</h3>