add vote result comparison view, wire into legislation detail page

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/client/features/legislation/components/legislation-detail.tsx

@@ -1,6 +1,9 @@
-import { useState } from "react"
+import { useDeviceId } from "@/shared/hooks/use-device-id"
+import { useEffect, useState } from "react"
 import { useLegislation } from "../hooks/use-legislation"
 import { useUserVote } from "../hooks/use-user-vote"
+import { fetchLegislationResults } from "../lib/legislation-api"
+import { VoteResult } from "./vote-result"
 import { VoteWidget } from "./vote-widget"
 
 interface LegislationDetailProps {
@@ -11,6 +14,23 @@ export function LegislationDetail({ legislationId }: LegislationDetailProps) {
 	const { legislation, loading, error } = useLegislation(legislationId)
 	const { vote, castVote } = useUserVote(legislationId)
 	const [showFullText, setShowFullText] = useState(false)
+	const deviceId = useDeviceId()
+	const [results, setResults] = useState<{
+		pollId: number
+		votes: {
+			politicianId: number
+			name: string
+			fraction: string | null
+			vote: string
+		}[]
+	} | null>(null)
+
+	useEffect(() => {
+		if (!deviceId) return
+		fetchLegislationResults(legislationId, deviceId)
+			.then(setResults)
+			.catch(() => null)
+	}, [legislationId, deviceId])
 
 	if (loading) {
 		return <div className="p-4 text-center text-muted-foreground">Laden…</div>
@@ -84,6 +104,13 @@ export function LegislationDetail({ legislationId }: LegislationDetailProps) {
 					</p>
 				)}
 			</div>
+
+			{results && vote && (
+				<div className="space-y-3">
+					<h2 className="text-sm font-medium">Ergebnis</h2>
+					<VoteResult userVote={vote} politicianVotes={results.votes} />
+				</div>
+			)}
 		</div>
 	)
 }