Files
breakpilot-compliance/admin-compliance/components/sdk/advisor/StatsBar.tsx
T
Benjamin Admin 49171e841f feat(advisor): Evidence Workspace — structured panes, markdown, sources as knowledge units
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>
2026-07-01 07:46:37 +02:00

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>
)
}