From 645e27fc9e8fcb1c20edd44f4ab5083db319b173 Mon Sep 17 00:00:00 2001
From: Hazelnoot <acomputerdog@gmail.com>
Date: Wed, 28 May 2025 02:05:31 -0400
Subject: [PATCH] add date separation to report UI

---
 packages/frontend/src/pages/admin/abuses.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/frontend/src/pages/admin/abuses.vue b/packages/frontend/src/pages/admin/abuses.vue
index 4ec4372492..6531a3e49d 100644
--- a/packages/frontend/src/pages/admin/abuses.vue
+++ b/packages/frontend/src/pages/admin/abuses.vue
@@ -48,9 +48,9 @@ SPDX-License-Identifier: AGPL-3.0-only
 			-->
 
 			<MkPagination v-slot="{items}" ref="reports" :pagination="pagination" :displayLimit="50">
-				<div class="_gaps">
-					<XAbuseReport v-for="report in items" :key="report.id" :report="report" @resolved="resolved"/>
-				</div>
+				<SkDateSeparatedList v-slot="{ item: report }" :items="items">
+					<XAbuseReport :report="report" @resolved="resolved"/>
+				</SkDateSeparatedList>
 			</MkPagination>
 		</div>
 	</div>
@@ -67,6 +67,7 @@ import { definePage } from '@/page.js';
 import MkButton from '@/components/MkButton.vue';
 import MkInfo from '@/components/MkInfo.vue';
 import { store } from '@/store.js';
+import SkDateSeparatedList from '@/components/SkDateSeparatedList.vue';
 
 const reports = useTemplateRef('reports');