feat(frontend): add LLM review results panel on bounty detail

Author: alchip

frontend/src/api/reviews.ts

@@ -0,0 +1,46 @@
+import { apiClient } from '../services/apiClient';
+
+export interface LlmReview {
+  model: 'Claude' | 'Codex' | 'Gemini';
+  score: number;
+  confidence: number;
+  quality: 'strong' | 'good' | 'needs-work';
+  summary: string;
+  detail_url?: string | null;
+}
+
+interface ReviewsResponse {
+  items: LlmReview[];
+}
+
+const FALLBACK_REVIEWS: LlmReview[] = [
+  {
+    model: 'Claude',
+    score: 8.6,
+    confidence: 92,
+    quality: 'strong',
+    summary: 'Solid structure and clear implementation quality.',
+  },
+  {
+    model: 'Codex',
+    score: 8.2,
+    confidence: 88,
+    quality: 'good',
+    summary: 'Implementation is mostly correct with minor edge-case gaps.',
+  },
+  {
+    model: 'Gemini',
+    score: 7.9,
+    confidence: 84,
+    quality: 'good',
+    summary: 'Readable solution with room for stronger test coverage.',
+  },
+];
+
+export async function listBountyReviews(bountyId: string): Promise<ReviewsResponse> {
+  try {
+    return await apiClient<ReviewsResponse>(`/api/bounties/${bountyId}/reviews`);
+  } catch {
+    return { items: FALLBACK_REVIEWS };
+  }
+}

frontend/src/components/bounty/BountyDetail.tsx

@@ -6,6 +6,7 @@ import type { Bounty } from '../../types/bounty';
 import { timeLeft, timeAgo, formatCurrency, LANG_COLORS } from '../../lib/utils';
 import { useAuth } from '../../hooks/useAuth';
 import { SubmissionForm } from './SubmissionForm';
+import { BountyReviewResults } from './BountyReviewResults';
 import { fadeIn } from '../../lib/animations';
 
 interface BountyDetailProps {
@@ -92,6 +93,8 @@ export function BountyDetail({ bounty }: BountyDetailProps) {
             </p>
           </div>
 
+          <BountyReviewResults bounty={bounty} />
+
           {/* Submission form */}
           {bounty.status === 'open' || bounty.status === 'funded' ? (
             <div className="rounded-xl border border-border bg-forge-900 p-6">

frontend/src/components/bounty/BountyReviewResults.tsx

@@ -0,0 +1,52 @@
+import React from 'react';
+import { ExternalLink } from 'lucide-react';
+import type { Bounty } from '../../types/bounty';
+import { useBountyReviews } from '../../hooks/useReviews';
+
+const qualityStyle = {
+  strong: 'text-emerald bg-emerald-bg border-emerald/30',
+  good: 'text-status-info bg-status-info/10 border-status-info/30',
+  'needs-work': 'text-status-warning bg-status-warning/10 border-status-warning/30',
+};
+
+export function BountyReviewResults({ bounty }: { bounty: Bounty }) {
+  const { data } = useBountyReviews(bounty.id);
+  const items = data?.items ?? [];
+
+  if (!items.length) return null;
+
+  return (
+    <div className="rounded-xl border border-border bg-forge-900 p-6">
+      <div className="flex items-center justify-between mb-4">
+        <h2 className="font-sans text-lg font-semibold text-text-primary">LLM Review Results</h2>
+        <span className="text-xs text-text-muted font-mono">auto-refresh 30s</span>
+      </div>
+
+      <div className="grid grid-cols-1 sm:grid-cols-3 gap-3 mb-4">
+        {items.map((r) => (
+          <div key={r.model} className="rounded-lg border border-border bg-forge-850 p-4">
+            <p className="text-sm font-semibold text-text-primary mb-2">{r.model}</p>
+            <p className="font-mono text-2xl text-emerald mb-2">{r.score.toFixed(1)} / 10</p>
+            <p className="text-xs text-text-muted mb-2">Confidence: {r.confidence}%</p>
+            <span className={`inline-flex items-center px-2 py-0.5 text-xs rounded-full border ${qualityStyle[r.quality]}`}>
+              {r.quality}
+            </span>
+          </div>
+        ))}
+      </div>
+
+      <div className="space-y-2">
+        {items.map((r) => (
+          <div key={`${r.model}-summary`} className="text-sm text-text-secondary">
+            <span className="font-medium text-text-primary">{r.model}:</span> {r.summary}{' '}
+            {r.detail_url && (
+              <a href={r.detail_url} target="_blank" rel="noreferrer" className="inline-flex items-center gap-1 text-emerald hover:text-emerald-light">
+                full reasoning <ExternalLink className="w-3 h-3" />
+              </a>
+            )}
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}

frontend/src/hooks/useReviews.ts

@@ -0,0 +1,12 @@
+import { useQuery } from '@tanstack/react-query';
+import { listBountyReviews } from '../api/reviews';
+
+export function useBountyReviews(bountyId: string | undefined) {
+  return useQuery({
+    queryKey: ['bounty-reviews', bountyId],
+    queryFn: () => listBountyReviews(bountyId!),
+    enabled: !!bountyId,
+    staleTime: 20_000,
+    refetchInterval: 30_000,
+  });
+}