Files
learning-platform/src/components/chat/useChat.js
RaymondVerhoef 229246f7b6
All checks were successful
On Pull Request to Main / test (pull_request) Successful in 32s
On Pull Request to Main / publish (pull_request) Successful in 57s
On Pull Request to Main / deploy-dev (pull_request) Successful in 1m34s
feat: phase 5 of AI pipeline hardening — R42 retrieval & telemetry
- Add dependency-free TF-IDF retrieval (src/lib/retrieval.js) with NL+EN
  stopwords and a WeakMap-cached index.
- Rewrite buildKbContext to ship the top-K relevant topics + verbatim-
  mentioned ids only, filter relations to the included set, and append a
  [kb_hash: <8 hex>] suffix so the ephemeral prompt cache busts when the
  graph changes. Returns { context, retrievedTopics, allTopics }.
- Add LOOKUP_TOPIC_TOOL and drive useChat through callLLM directly with a
  multi-hop tool_result loop capped at 3 hops; preserve Anthropic-provided
  tool_use ids through callLLM so the loop can echo correct tool_use_id.
- Truncate R42 history to the last 12 turns and prepend a single
  "(earlier conversation truncated)" assistant message.
- Set R42 chat defaults: temperature 0.3, maxTokens 2048.
- Add pb_migrations/1780500002_created_llm_calls.js (the best-effort
  logger in callLLM was already wired) and a new Admin → Diagnostics
  view showing the last 100 calls with token usage, cache-hit rate, and
  USD cost from a local Anthropic price table.
- Finalize AI_PIPELINE_HARDENING_PLAN.md: mark Phases 1–5 shipped and
  Phase 6 (eval harness) explicitly out of scope.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-20 21:36:40 +02:00

219 lines
6.7 KiB
JavaScript

import { useCallback, useEffect, useRef, useState } from 'react';
import { storage } from '../../lib/storage';
import { callLLM } from '../../lib/llm';
import * as db from '../../lib/db';
import { buildKbContext, validateDelta, deltaKey } from './rag';
import {
buildSystemPrompt,
PROPOSE_GRAPH_DELTA_TOOL,
LOOKUP_TOPIC_TOOL,
STRINGS,
} from './prompts';
const MAX_HISTORY = 50;
const VERBATIM_TURNS = 12;
const MAX_LOOKUP_HOPS = 3;
const TRUNCATION_NOTICE = '(earlier conversation truncated)';
/** Trim API history to the last N turns and prepend a truncation notice. */
function truncateApiMessages(history) {
if (history.length <= VERBATIM_TURNS) return history;
const tail = history.slice(-VERBATIM_TURNS);
return [{ role: 'assistant', content: TRUNCATION_NOTICE }, ...tail];
}
async function resolveLookupTopic(id, allTopics) {
const topic = allTopics.find(t => t.id === id);
if (!topic) {
return { ok: false, payload: `Geen topic gevonden met id "${id}".` };
}
const content = await db.getContent(id).catch(() => null);
let contentSnippet = null;
if (content) {
let raw;
if (typeof content === 'string') raw = content;
else if (content.article) raw = typeof content.article === 'string' ? content.article : JSON.stringify(content.article);
else raw = JSON.stringify(content);
contentSnippet = raw.replace(/\s+/g, ' ').trim().slice(0, 2400);
}
return {
ok: true,
payload: {
id: topic.id,
label: topic.label,
type: topic.type || 'concept',
description: topic.description || '',
learning_content: contentSnippet,
},
};
}
/**
* Conversation hook for R42.
* Owns the message list, persists to chat:thread:{userId}, calls Anthropic
* via the shared `callLLM` client (with a `lookup_topic` multi-hop loop and
* the `propose_graph_delta` tool), and surfaces validated graph delta
* suggestions inline.
*/
export function useChat({ user, isAdmin }) {
const threadKey = user ? `chat:thread:${user.id}` : null;
const [messages, setMessages] = useState([]);
const [isThinking, setIsThinking] = useState(false);
const [errored, setErrored] = useState(false);
const seenDeltaKeys = useRef(new Set());
useEffect(() => {
if (!user) return;
const stored = storage.get(threadKey, null);
if (stored && Array.isArray(stored) && stored.length) {
setMessages(stored);
for (const m of stored) {
if (m.suggestion?.key) seenDeltaKeys.current.add(m.suggestion.key);
}
} else {
setMessages([
{
id: `m_${Date.now()}`,
role: 'assistant',
content: STRINGS.greeting(user.name || 'daar'),
ts: Date.now(),
},
]);
}
}, [user, threadKey]);
useEffect(() => {
if (!threadKey) return;
const capped = messages.slice(-MAX_HISTORY);
storage.set(threadKey, capped);
}, [messages, threadKey]);
const updateMessage = useCallback((id, patch) => {
setMessages(prev => prev.map(m => (m.id === id ? { ...m, ...patch } : m)));
}, []);
const send = useCallback(async (text) => {
const trimmed = (text || '').trim();
if (!trimmed || !user) return;
const userMsg = {
id: `m_${Date.now()}_u`,
role: 'user',
content: trimmed,
ts: Date.now(),
};
const next = [...messages, userMsg];
setMessages(next);
setIsThinking(true);
setErrored(false);
try {
const { context: kbContext, allTopics } = await buildKbContext(trimmed);
const systemPrompt = buildSystemPrompt({
userName: user.name || 'daar',
isAdmin,
kbContext,
});
const historyMessages = next
.filter(m => m.role === 'user' || m.role === 'assistant')
.map(m => ({ role: m.role, content: m.content }));
const apiMessages = truncateApiMessages(historyMessages);
let textOut = '';
let suggestion = null;
let hops = 0;
while (true) {
const response = await callLLM({
task: 'chat.r42',
tier: 'standard',
system: systemPrompt,
messages: apiMessages,
tools: [LOOKUP_TOPIC_TOOL, PROPOSE_GRAPH_DELTA_TOOL],
maxTokens: 2048,
temperature: 0.3,
});
if (response.text) {
textOut += (textOut ? '\n' : '') + response.text;
}
const lookupCalls = response.toolUses.filter(tu => tu.name === LOOKUP_TOPIC_TOOL.name);
const deltaCall = response.toolUses.find(tu => tu.name === PROPOSE_GRAPH_DELTA_TOOL.name);
if (deltaCall && !suggestion) {
const validated = validateDelta(deltaCall.input, allTopics);
if (validated) {
const key = deltaKey(validated);
if (!seenDeltaKeys.current.has(key)) {
seenDeltaKeys.current.add(key);
suggestion = { ...validated, key, status: 'pending' };
}
}
}
if (lookupCalls.length === 0 || hops >= MAX_LOOKUP_HOPS) break;
hops++;
const assistantBlocks = [];
if (response.text) assistantBlocks.push({ type: 'text', text: response.text });
for (const tu of response.toolUses) {
if (!tu.id) continue;
assistantBlocks.push({ type: 'tool_use', id: tu.id, name: tu.name, input: tu.input });
}
apiMessages.push({ role: 'assistant', content: assistantBlocks });
const toolResults = [];
for (const tu of lookupCalls) {
if (!tu.id) continue;
const topicId = String(tu.input?.id || '').trim();
const resolved = await resolveLookupTopic(topicId, allTopics);
toolResults.push({
type: 'tool_result',
tool_use_id: tu.id,
content: typeof resolved.payload === 'string'
? resolved.payload
: JSON.stringify(resolved.payload),
...(resolved.ok ? {} : { is_error: true }),
});
}
apiMessages.push({ role: 'user', content: toolResults });
}
const assistantMsg = {
id: `m_${Date.now()}_a`,
role: 'assistant',
content: textOut || (suggestion ? STRINGS.suggestionTitle : STRINGS.errorGeneric),
ts: Date.now(),
...(suggestion ? { suggestion } : {}),
};
setMessages(prev => [...prev, assistantMsg]);
} catch (e) {
console.error('[R42] chat error', e);
setErrored(true);
const isKey = /api key/i.test(e?.message || '');
setMessages(prev => [
...prev,
{
id: `m_${Date.now()}_e`,
role: 'error',
content: isKey ? STRINGS.errorNoKey : STRINGS.errorGeneric,
ts: Date.now(),
},
]);
} finally {
setIsThinking(false);
}
}, [messages, user, isAdmin]);
return {
messages,
isThinking,
errored,
send,
updateMessage,
};
}