49171e841f
Rebuilds the Compliance Advisor floating widget from a plain chat into an Evidence
Workspace: pinned last question, markdown-rendered answer (clean prose), and separate
panes for Sources (hierarchical Knowledge Units), Figures (C8, conditional) and
Footnotes (C-FN), plus a stats bar (Quellen/Regelwerke/Diagramme/Fußnoten). Scrollable
turn history; stays a floating icon on every SDK page.
Architecture (user direction): the frontend renders ONLY structured evidence and NEVER
parses the answer text. The proxy now returns a JSON AdvisorEvidenceMeta line followed
by the streamed markdown answer; advisor-rag exposes structured results; an adapter maps
RAG/compiler output to the frontend envelope. Figures/footnotes wire in once the
RAG-ingestion contract lands (requested on the board) — figures pane is conditional.
- lib/sdk/advisor/{evidence,evidence-adapter}.ts (+ adapter test, 7 cases)
- components/sdk/advisor/* panes + in-house safe Markdown (no new dep, no dangerouslySetInnerHTML) + test
- useAdvisorStream (meta-line parse + streamed answer) + useAdvisorEmail (escaped)
- proxy: evidence-meta-v1 envelope + clean-prose prompt (no inline citations)
- tsc clean, 11 vitest pass, check-loc 0. ESLint not installed in this node_modules -> CI lints on push.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
53 lines
1.4 KiB
TypeScript
53 lines
1.4 KiB
TypeScript
'use client'
|
|
|
|
import { FileText, Library, Image as ImageIcon, Hash } from 'lucide-react'
|
|
import type { AdvisorStats } from '@/lib/sdk/advisor/evidence'
|
|
|
|
function Chip({
|
|
icon,
|
|
label,
|
|
value,
|
|
dim,
|
|
}: {
|
|
icon: React.ReactNode
|
|
label: string
|
|
value: number
|
|
dim?: boolean
|
|
}) {
|
|
return (
|
|
<div
|
|
className={`flex items-center gap-1 rounded-md border px-1.5 py-0.5 text-[11px] ${
|
|
dim ? 'border-gray-100 bg-gray-50 text-gray-400' : 'border-gray-200 bg-white text-gray-600'
|
|
}`}
|
|
title={`${label}: ${value}`}
|
|
>
|
|
{icon}
|
|
<span className="font-semibold text-gray-900">{value}</span>
|
|
<span>{label}</span>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
/** Compact evidence summary: "Diese Antwort basiert auf N Quellen / M Regelwerken ...". */
|
|
export function StatsBar({ stats }: { stats: AdvisorStats }) {
|
|
const cls = 'h-3 w-3'
|
|
return (
|
|
<div className="flex flex-wrap items-center gap-1.5">
|
|
<Chip icon={<FileText className={cls} />} label="Quellen" value={stats.sources} />
|
|
<Chip icon={<Library className={cls} />} label="Regelwerke" value={stats.regulations} />
|
|
<Chip
|
|
icon={<ImageIcon className={cls} />}
|
|
label="Diagramme"
|
|
value={stats.figures}
|
|
dim={stats.figures === 0}
|
|
/>
|
|
<Chip
|
|
icon={<Hash className={cls} />}
|
|
label="Fußnoten"
|
|
value={stats.footnotes}
|
|
dim={stats.footnotes === 0}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|