feat(hk): expand search and add operational user overview

src/app/admin/users/show/[id]/page.tsx

@@ -6,9 +6,9 @@ import { getWatchedUserIds } from "@/lib/services/watch";
 import { UserAccountInfo } from "../../_components/user-account-info";
 import { UserBadgesReadonly } from "../../_components/user-badges-readonly";
 import { UserHero } from "../../_components/user-hero";
-import { UserSanctionTimeline } from "../../_components/user-sanction-timeline";
+import { UserOperationalOverview } from "../../_components/user-operational-overview";
 import { loadUserById } from "../../_lib/load-user";
-import { loadUserSanctions } from "../../_lib/load-user-sanctions";
+import { loadUserOverview } from "../../_lib/load-user-overview";
 import { UserActivityLog } from "../../[id]/user-activity-log";
 import { UserQuickActions } from "../../[id]/user-quick-actions";
 import { UserRooms } from "../../[id]/user-rooms";
@@ -25,10 +25,19 @@ export default async function UserShowPage({
 	}
 
 	const t = await getTranslations("pages.admin.users.detail");
+	const overviewT = await getTranslations("pages.admin.users.overview");
 	const canEdit = canAccess(permissions, PERMS.USERS_EDIT, session.user.rank);
-	const data = await loadUserById(id);
-	const [sanctions, watched] = await Promise.all([
-		loadUserSanctions(data.user.id),
+	const canViewLogs = canAccess(
+		permissions,
+		PERMS.LOGS_VIEW,
+		session.user.rank,
+	);
+	const data = await loadUserById(id, {
+		logs: canViewLogs,
+		bans: canAccess(permissions, PERMS.BANS_VIEW, session.user.rank),
+	});
+	const [overview, watched] = await Promise.all([
+		loadUserOverview(data.user.id, permissions, session.user.rank),
 		getWatchedUserIds(session.user.id),
 	]);
 
@@ -40,6 +49,7 @@ export default async function UserShowPage({
 				duckets={data.duckets}
 				roomCount={data.roomCount}
 				chatCount={data.chatCount}
+				canViewLogs={canViewLogs && !data.activityUnavailable}
 				tradeCount={data.tradeCount}
 				isOnline={data.isOnline}
 				activeBan={!!data.activeBan}
@@ -55,8 +65,9 @@ export default async function UserShowPage({
 						: undefined
 				}
 			>
-				<Tabs defaultValue="info" className="space-y-4 min-w-0">
+				<Tabs defaultValue="overview" className="space-y-4 min-w-0">
 					<TabsList className="h-auto flex-wrap justify-start">
+						<TabsTrigger value="overview">{overviewT("title")}</TabsTrigger>
 						<TabsTrigger value="info">{t("tabInfo")}</TabsTrigger>
 						<TabsTrigger value="badges">
 							{t("tabBadges", { count: data.user.badges.length })}
@@ -64,12 +75,15 @@ export default async function UserShowPage({
 						<TabsTrigger value="rooms">
 							{t("tabRooms", { count: data.roomCount })}
 						</TabsTrigger>
-						<TabsTrigger value="sanctions">
-							{t("tabSanctions", { count: sanctions.events.length })}
-						</TabsTrigger>
-						<TabsTrigger value="activity">{t("tabActivity")}</TabsTrigger>
+						{canViewLogs && (
+							<TabsTrigger value="activity">{t("tabActivity")}</TabsTrigger>
+						)}
 					</TabsList>
 
+					<TabsContent value="overview">
+						<UserOperationalOverview sections={overview} />
+					</TabsContent>
+
 					<TabsContent value="info">
 						<UserAccountInfo user={data.user} />
 					</TabsContent>
@@ -87,19 +101,23 @@ export default async function UserShowPage({
 						<UserRooms rooms={data.userRooms} />
 					</TabsContent>
 
-					<TabsContent value="sanctions">
-						<UserSanctionTimeline
-							events={sanctions.events}
-							muteUntil={sanctions.muteUntil}
-						/>
-					</TabsContent>
-
-					<TabsContent value="activity">
-						<UserActivityLog
-							chatLogs={data.chatLogs}
-							commandLogs={data.commandLogs}
-						/>
-					</TabsContent>
+					{canViewLogs && (
+						<TabsContent value="activity">
+							{data.activityUnavailable ? (
+								<p
+									role="status"
+									className="rounded-lg border bg-card p-4 text-sm text-destructive"
+								>
+									{overviewT("error")}
+								</p>
+							) : (
+								<UserActivityLog
+									chatLogs={data.chatLogs}
+									commandLogs={data.commandLogs}
+								/>
+							)}
+						</TabsContent>
+					)}
 				</Tabs>
 
 				{canEdit && (