feat: integrate Langfuse for LLM observability (#66)

* feat: integrate Langfuse for LLM observability

- Add instrumentation.ts with Langfuse OpenTelemetry exporter
- Enable experimental telemetry on streamText calls
- Add instrumentationHook to Next.js config
- Install required dependencies (@vercel/otel, langfuse-vercel, etc.)

* feat: add optional Langfuse observability integration

- Add session tracking with unique sessionId per conversation
- Add user tracking via IP address (x-forwarded-for header)
- Make telemetry conditional - only enabled if LANGFUSE_PUBLIC_KEY is set
- Add environment variable validation in instrumentation.ts
- Add sessionId validation (type check + 200 char limit)
- Update env.example with Langfuse configuration docs
- Remove unused langfuse-vercel and @vercel/otel packages

* fix: remove deprecated instrumentationHook (enabled by default in Next.js 15)
This commit is contained in:
Dayuan Jiang
2025-12-04 00:23:09 +09:00
committed by GitHub
parent 39322c2793
commit fa1b02ad78
6 changed files with 383 additions and 3 deletions

View File

@@ -61,6 +61,9 @@ export default function ChatPanel({
const [showHistory, setShowHistory] = useState(false);
const [input, setInput] = useState("");
// Generate a unique session ID for Langfuse tracing
const [sessionId, setSessionId] = useState(() => `session-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`);
const { messages, sendMessage, addToolResult, status, error, setMessages } =
useChat({
transport: new DefaultChatTransport({
@@ -177,6 +180,7 @@ Please retry with an adjusted search pattern or use display_diagram if retries a
{
body: {
xml: chartXml,
sessionId,
},
}
);
@@ -293,6 +297,7 @@ Please retry with an adjusted search pattern or use display_diagram if retries a
onClearChat={() => {
setMessages([]);
clearDiagram();
setSessionId(`session-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`);
}}
files={files}
onFileChange={handleFileChange}