feat(housekeeping): add localized route states

src/features/housekeeping/foundation/page/housekeeping-page-state.tsx

@@ -3,35 +3,65 @@ import type { ReactNode } from "react";
 interface HousekeepingPageStateBaseProps {
 	title: string;
 	description: string;
+	headingLevel?: "h1" | "h2";
 	retryAction?: ReactNode;
 }
 
 type HousekeepingPageStateProps = HousekeepingPageStateBaseProps &
 	(
 		| { state: "partial"; partialLabel: string }
-		| { state: "loading" | "empty" | "error"; partialLabel?: never }
+		| {
+				state:
+					| "loading"
+					| "empty"
+					| "conflict"
+					| "dependency"
+					| "forbidden"
+					| "error"
+					| "not-found"
+					| "success";
+				partialLabel?: never;
+		  }
 	);
 
+const ALERT_STATES = new Set(["conflict", "dependency", "forbidden", "error"]);
+
 export function HousekeepingPageState({
 	state,
 	partialLabel,
 	title,
 	description,
+	headingLevel = "h2",
 	retryAction,
 }: HousekeepingPageStateProps) {
-	const isError = state === "error";
+	const isAlert = ALERT_STATES.has(state);
 	const isPartial = state === "partial";
+	const isWarning = isPartial || state === "conflict" || state === "dependency";
+	const isError = state === "error" || state === "forbidden";
+	const isSuccess = state === "success";
+	const Heading = headingLevel;
 
 	return (
 		<section
-			role={isError ? "alert" : "status"}
+			role={isAlert ? "alert" : "status"}
+			data-state-tone={
+				isError
+					? "error"
+					: isWarning
+						? "warning"
+						: isSuccess
+							? "success"
+							: "neutral"
+			}
 			aria-live={state === "loading" ? "polite" : undefined}
 			className={`rounded-lg border p-4 ${
 				isError
-					? "border-[var(--admin-error)] bg-[var(--admin-surface)]"
-					: isPartial
+					? "border-[var(--admin-error-border)] bg-[var(--admin-error-subtle)]"
+					: isWarning
 						? "border-[var(--admin-warning-border)] bg-[var(--admin-warning-subtle)]"
-						: "border-[var(--admin-border)] bg-[var(--admin-surface)]"
+						: isSuccess
+							? "border-[var(--admin-success)] bg-[var(--admin-success-subtle)]"
+							: "border-[var(--admin-border)] bg-[var(--admin-surface)]"
 			}`}
 		>
 			{isPartial ? (
@@ -42,7 +72,9 @@ export function HousekeepingPageState({
 					{partialLabel}
 				</p>
 			) : null}
-			<h2 className="font-medium text-[var(--admin-text)]">{title}</h2>
+			<Heading className="font-medium text-[var(--admin-text)]">
+				{title}
+			</Heading>
 			<p className="mt-1 text-sm text-[var(--admin-text-muted)]">
 				{description}
 			</p>