fix(housekeeping): harden people account workflows

src/features/housekeeping/domains/people/pages/user-edit.tsx

@@ -7,80 +7,74 @@ import {
 import type { HousekeepingPageInput } from "../../../route-handlers";
 import { type PeopleUsersQueryData, peopleUsersQuery } from "../queries/users";
 import { PeoplePageFrame } from "./page-state";
+import {
+	type PeopleCommandField,
+	PeopleCommandForm,
+} from "./people-command-form";
 
 interface PeopleUserEditPageProps {
 	readonly context: HousekeepingCapabilityContext;
 	readonly result?: HousekeepingResult<PeopleUsersQueryData>;
-	readonly partialDependencies?: readonly string[];
 }
 
-export function PeopleUserEditPage({
-	context: _context,
-	result,
-	partialDependencies,
-}: PeopleUserEditPageProps) {
+export function PeopleUserEditPage({ result }: PeopleUserEditPageProps) {
 	return (
 		<PeoplePageFrame
 			title="Edit user"
 			description="Update bounded account fields through an audited command."
 			result={result}
-			partialDependencies={partialDependencies}
 			isEmpty={() => false}
 		>
-			{(data) =>
-				data.kind === "user" ? (
-					<form
-						data-housekeeping-command="people.user.update"
-						className="space-y-4 rounded-lg border border-[var(--admin-border)] bg-[var(--admin-surface)] p-4"
-					>
-						<input type="hidden" name="userId" value={data.user.id} />
-						<label className="block text-sm">
-							Username
-							<input
-								name="username"
-								defaultValue={data.user.username}
-								maxLength={20}
-								className="mt-1 block w-full"
-							/>
-						</label>
-						{data.user.mail !== null ? (
-							<label className="block text-sm">
-								Email
-								<input
-									name="mail"
-									type="email"
-									defaultValue={data.user.mail}
-									className="mt-1 block w-full"
-								/>
-							</label>
-						) : null}
-						<label className="block text-sm">
-							Motto
-							<input
-								name="motto"
-								defaultValue={data.user.motto}
-								maxLength={127}
-								className="mt-1 block w-full"
-							/>
-						</label>
-						<label className="block text-sm">
-							Rank
-							<select
-								name="rank"
-								defaultValue={data.user.rank}
-								className="mt-1 block w-full"
-							>
-								{data.user.permission.ranks.map((rank) => (
-									<option key={rank.id} value={rank.id}>
-										{rank.name}
-									</option>
-								))}
-							</select>
-						</label>
-						<button type="submit">Save user</button>
-					</form>
-				) : null
-			}
+			{(data) => {
+				if (data.kind !== "user") return null;
+				const fields: PeopleCommandField[] = [
+					{
+						name: "username",
+						label: "Username",
+						type: "text",
+						defaultValue: data.user.username,
+						maxLength: 20,
+						required: true,
+					},
+					...(data.user.mail !== null
+						? [
+								{
+									name: "mail",
+									label: "Email",
+									type: "text",
+									defaultValue: data.user.mail,
+									maxLength: 255,
+								} as const,
+							]
+						: []),
+					{
+						name: "motto",
+						label: "Motto",
+						type: "text",
+						defaultValue: data.user.motto,
+						maxLength: 127,
+					},
+					{
+						name: "rank",
+						label: "Rank",
+						type: "select",
+						defaultValue: data.user.rank,
+						options: data.user.permission.ranks.map((rank) => ({
+							value: rank.id,
+							label: rank.name,
+						})),
+					},
+				];
+				return (
+					<PeopleCommandForm
+						commandId="people.user.update"
+						buttonLabel="Save user"
+						input={{ userId: data.user.id }}
+						fields={fields}
+						nestFields
+					/>
+				);
+			}}
 		</PeoplePageFrame>
 	);
 }