> ## Documentation Index > Fetch the complete documentation index at: https://veryfront.com/docs/llms.txt > Use this file to discover all available pages before exploring further. # List conversation runs > List canonical runs in a readable conversation, using the target cursor and response contract. export const McpToolCall = ({tool, initialArguments = {}, requiresConfirmation = false}) => { const validateCall = function validateReferenceToolCall(token, text, requiresConfirmation, confirmed) { if (!token.trim()) return { error: "Paste a bearer token first." }; let value; try { value = JSON.parse(text.trim() || "{}"); } catch { return { error: "Arguments must be valid JSON." }; } if (!value || typeof value !== "object" || Array.isArray(value)) return { error: "Arguments must be a JSON object." }; if (requiresConfirmation && !confirmed) return { error: "Confirm the tool call before running it." }; return { arguments: value }; }; const endpoint = "https://api.veryfront.com/mcp"; const tokenStorageKey = 'veryfront.docs.mcpBearerToken'; const escapeHtml = value => value.replace(/&/g, '&').replace(//g, '>'); const highlightJson = value => { const escaped = escapeHtml(value); return escaped.replace(/("(?:\\u[a-fA-F0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\btrue\b|\bfalse\b|\bnull\b|-?\d+(?:\.\d+)?(?:[eE][+\-]?\d+)?)/g, match => { let color = '#f3f4f6'; if (match.endsWith(':')) { color = '#7dd3fc'; } else if (match.startsWith('"')) { color = '#86efac'; } else if ((/true|false/).test(match)) { color = '#c4b5fd'; } else if ((/null/).test(match)) { color = '#fcd34d'; } else { color = '#67e8f9'; } return `${match}`; }); }; const expandJsonStrings = value => { if (typeof value === 'string') { const trimmed = value.trim(); if (trimmed.startsWith('{') && trimmed.endsWith('}') || trimmed.startsWith('[') && trimmed.endsWith(']')) { try { return expandJsonStrings(JSON.parse(trimmed)); } catch {} } return value; } if (Array.isArray(value)) { return value.map(expandJsonStrings); } if (value && typeof value === 'object') { return Object.fromEntries(Object.entries(value).map(([key, nestedValue]) => [key, expandJsonStrings(nestedValue)])); } return value; }; const formatJson = value => { try { return JSON.stringify(expandJsonStrings(value), null, 2); } catch { return String(value); } }; const formatResponseText = text => { const trimmed = text.trim(); if (!trimmed) return 'No response body.'; try { return formatJson(JSON.parse(trimmed)); } catch {} const ssePayloads = trimmed.split(/\n\n+/).flatMap(chunk => chunk.split('\n').filter(line => line.startsWith('data:')).map(line => line.slice(5).trim()).filter(Boolean)); for (let index = ssePayloads.length - 1; index >= 0; index -= 1) { try { return formatJson(JSON.parse(ssePayloads[index])); } catch {} } return trimmed; }; const readStoredToken = () => { if (typeof window === 'undefined') return ''; try { return window.sessionStorage.getItem(tokenStorageKey) || ''; } catch { return ''; } }; const writeStoredToken = value => { if (typeof window === 'undefined') return; try { if (value) { window.sessionStorage.setItem(tokenStorageKey, value); } else { window.sessionStorage.removeItem(tokenStorageKey); } } catch {} }; const [token, setToken] = useState(readStoredToken); const [argumentText, setArgumentText] = useState(formatJson(initialArguments)); const [status, setStatus] = useState('Ready'); const [response, setResponse] = useState('No response yet.'); const [copied, setCopied] = useState(false); const [confirmed, setConfirmed] = useState(false); const callTool = async () => { const validation = validateCall(token, argumentText, requiresConfirmation, confirmed); if (('error' in validation)) { setStatus(validation.error); return; } const parsedArguments = validation.arguments; setConfirmed(false); const body = { jsonrpc: '2.0', id: Date.now(), method: 'tools/call', params: { name: tool, arguments: parsedArguments } }; setStatus('Calling tool...'); setResponse(formatJson(body)); try { const result = await fetch(endpoint, { method: 'POST', headers: { accept: 'application/json, text/event-stream', 'content-type': 'application/json', authorization: `Bearer ${token.trim()}`, 'x-veryfront-origin': 'docs-mcp-tool-page' }, body: JSON.stringify(body) }); const text = await result.text(); setStatus(result.ok ? 'Response received.' : `Request failed with HTTP ${result.status}.`); setResponse(formatResponseText(text)); } catch (error) { setStatus('Request failed.'); setResponse(error instanceof Error ? error.message : String(error)); } }; const copyResponse = async () => { try { await navigator.clipboard.writeText(response); setCopied(true); setTimeout(() => setCopied(false), 1500); } catch { setStatus('Copy failed.'); } }; return
Try this tool

Replace sample arguments with values for your project or connected account. Calls run only when you select Run tool.

MCP tool call
Call {tool} against the Veryfront MCP endpoint.
{ const value = event.target.value; setToken(value); setConfirmed(false); writeStoredToken(value); }} placeholder="Paste API key or JWT" />