feat(CC-054): add Legislation page (vector search + AnythingLLM AI agent)

This commit is contained in:
admin-valentin 2026-08-01 12:32:07 +00:00
parent 9b5454db69
commit 8585f7a62d

View file

@ -0,0 +1,182 @@
'use client';
import { useState } from 'react';
import { useSession } from '../../../lib/session';
import { apiFetch } from '../../../lib/api';
interface LegResult {
country?: string;
section?: string;
text?: string;
source_id?: string;
[key: string]: unknown;
}
interface ApiSearchResponse {
scenario?: string;
country_filter?: string;
results?: LegResult[];
}
type Mode = 'search' | 'ask';
export default function LegislationPage() {
const { session } = useSession();
const [mode, setMode] = useState<Mode>('ask');
const [input, setInput] = useState('');
const [country, setCountry] = useState('DE');
const [results, setResults] = useState<LegResult[]>([]);
const [aiAnswer, setAiAnswer] = useState<string | null>(null);
const [loading, setLoading] = useState(false);
const [error, setError] = useState<string | null>(null);
const [searched, setSearched] = useState(false);
async function handleSubmit(e: React.FormEvent) {
e.preventDefault();
if (!input.trim() || !session) return;
setLoading(true); setError(null); setResults([]); setAiAnswer(null);
try {
const headers = {
Authorization: `Bearer ${session.access_token}`,
'x-tenant-id': session.tenant_id,
'Content-Type': 'application/json',
};
if (mode === 'search') {
const data: ApiSearchResponse = await apiFetch('/v1/external/legislation/search', {
method: 'POST', headers,
body: JSON.stringify({ scenario: input.trim(), country, topK: 10 }),
});
setResults(data.results ?? []);
} else {
const data = await apiFetch('/v1/external/legislation/ask', {
method: 'POST', headers,
body: JSON.stringify({
message: `${input.trim()} (context juridic: ${country})`,
sessionId: 'ceo-legislation-' + Date.now(),
}),
}) as Record<string, unknown>;
const text = (data?.textResponse ?? data?.response ?? data?.message ?? '') as string;
setAiAnswer(text);
}
setSearched(true);
} catch {
setError(mode === 'ask'
? 'Agentul de legislație nu e disponibil momentan. Încearcă modul Căutare.'
: 'Serviciul de căutare nu e disponibil momentan.'
);
} finally {
setLoading(false);
}
}
return (
<div className="space-y-6 p-6 max-w-4xl">
<div>
<h1 className="text-2xl font-semibold">Căutare Legislație</h1>
<p className="text-sm text-muted-foreground mt-1">
Corpus DE · RO · EU căutare vectorială sau răspuns AI prin agent AnythingLLM
</p>
</div>
{/* Mode toggle */}
<div className="flex gap-1 p-1 bg-muted rounded-lg w-fit">
{(['ask', 'search'] as Mode[]).map((m) => (
<button key={m} onClick={() => setMode(m)}
className={`px-4 py-1.5 rounded-md text-sm font-medium transition-colors ${
mode === m
? 'bg-background shadow-sm text-foreground'
: 'text-muted-foreground hover:text-foreground'
}`}>
{m === 'ask' ? '🤖 Întreabă agentul AI' : '📄 Caută în corpus'}
</button>
))}
</div>
<form onSubmit={handleSubmit} className="space-y-3">
<textarea
value={input} onChange={(e) => setInput(e.target.value)} rows={3}
placeholder={mode === 'ask'
? 'ex: Am o firmă GmbH în Germania și vreau să angajez remote din România. Ce obligații legale am?'
: 'Descrie situația ta complet pentru a obține secțiunile de lege relevante...'
}
className="w-full rounded-lg border bg-background px-4 py-3 text-sm
focus:outline-none focus:ring-2 focus:ring-ring resize-none"
/>
<div className="flex gap-3 flex-wrap">
<select value={country} onChange={(e) => setCountry(e.target.value)}
className="rounded-lg border bg-background px-3 py-2 text-sm
focus:outline-none focus:ring-2 focus:ring-ring">
<option value="DE">Germania (DE)</option>
<option value="RO">România (RO)</option>
<option value="EU">UE (EU)</option>
<option value="AT">Austria (AT)</option>
</select>
<button type="submit" disabled={loading || !input.trim()}
className="rounded-lg bg-primary px-6 py-2 text-sm font-medium
text-primary-foreground hover:bg-primary/90 disabled:opacity-50">
{loading ? (mode === 'ask' ? 'Agent răspunde...' : 'Se caută...') : (mode === 'ask' ? 'Întreabă' : 'Caută')}
</button>
</div>
</form>
{error && (
<div className="rounded-lg border border-destructive/40 bg-destructive/10 px-4 py-3
text-sm text-destructive">
{error}
</div>
)}
{/* AI Answer */}
{aiAnswer && (
<div className="rounded-xl border bg-card p-5 space-y-3">
<div className="flex items-center gap-2 text-sm font-medium">
<span>🤖</span>
<span>Răspuns agent legislație</span>
</div>
<div className="text-sm leading-relaxed whitespace-pre-wrap text-foreground">
{aiAnswer}
</div>
<p className="text-xs text-muted-foreground border-t pt-2">
Generat de agentul AnythingLLM · Nu constituie consultanță juridică
</p>
</div>
)}
{/* Vector search results */}
{results.length > 0 && (
<div className="space-y-3">
<p className="text-sm text-muted-foreground">
{results.length} secțiuni relevante găsite
</p>
{results.map((r, i) => (
<div key={i} className="rounded-xl border bg-card p-4 space-y-2">
<div className="flex items-center gap-2">
{r.country && (
<span className="text-xs bg-primary/10 text-primary px-2 py-0.5 rounded font-mono font-medium">
{r.country}
</span>
)}
{r.section && (
<span className="text-sm font-medium">{r.section}</span>
)}
</div>
{r.text && (
<p className="text-xs text-muted-foreground leading-relaxed line-clamp-4">
{r.text}
</p>
)}
<p className="text-xs text-muted-foreground/60">{r.source_id}</p>
</div>
))}
</div>
)}
{searched && !loading && results.length === 0 && !aiAnswer && !error && (
<p className="text-sm text-muted-foreground">
Niciun rezultat pentru scenariul introdus.
</p>
)}
</div>
);
}