feat(housekeeping): deliver people account workflows

src/features/housekeeping/domains/people/pages/multi-accounts.tsx

@@ -0,0 +1,68 @@
+import type {
+	HousekeepingCapabilityContext,
+	HousekeepingResult,
+} from "../../../foundation/contracts";
+import type { HousekeepingPageInput } from "../../../route-handlers";
+import { type PeopleUsersQueryData, peopleUsersQuery } from "../queries/users";
+import { PeoplePageFrame } from "./page-state";
+
+interface PeopleMultiAccountsPageProps {
+	readonly context: HousekeepingCapabilityContext;
+	readonly result?: HousekeepingResult<PeopleUsersQueryData>;
+	readonly partialDependencies?: readonly string[];
+}
+
+export function PeopleMultiAccountsPage({
+	context: _context,
+	result,
+	partialDependencies,
+}: PeopleMultiAccountsPageProps) {
+	return (
+		<PeoplePageFrame
+			title="Multi-account clusters"
+			description="Review bounded account clusters grouped by current IP."
+			result={result}
+			partialDependencies={partialDependencies}
+			isEmpty={(data) =>
+				data.kind === "multi-accounts" && data.page.items.length === 0
+			}
+		>
+			{(data) =>
+				data.kind === "multi-accounts" ? (
+					<ul className="space-y-3">
+						{data.page.items.map((cluster) => (
+							<li
+								key={cluster.key}
+								className="rounded-lg border border-[var(--admin-border)] bg-[var(--admin-surface)] p-4"
+							>
+								<h2 className="font-medium text-[var(--admin-text)]">
+									{cluster.key}
+								</h2>
+								<p className="text-sm text-[var(--admin-text-muted)]">
+									{cluster.accountCount} accounts
+								</p>
+								<ul className="mt-2 flex flex-wrap gap-3 text-sm">
+									{cluster.accounts.map((account) => (
+										<li key={account.id}>
+											<a href={account.href}>{account.username}</a>
+										</li>
+									))}
+								</ul>
+							</li>
+						))}
+					</ul>
+				) : null
+			}
+		</PeoplePageFrame>
+	);
+}
+
+export async function renderPeopleMultiAccountsPage(
+	input: HousekeepingPageInput,
+) {
+	const result = await peopleUsersQuery.run(input.context, {
+		routeId: "people.users.multi-accounts",
+		list: {},
+	});
+	return <PeopleMultiAccountsPage context={input.context} result={result} />;
+}