FunctionComponentsContext
Map function call names to React components. When a run step calls a function, the
corresponding component from this context renders the call.
Provider
Use
FunctionComponentsContext.Provider to register components for specific
function calls. The value is an object whose keys are function names and values
are React components. Each component receives fn, runStep, and toolCall
props describing the function call.app.tsx
import { FunctionComponentsContext, Thread } from '@superinterface/react'
const SearchGoogle = ({ fn, runStep, toolCall }) => {
const args = JSON.parse(fn.arguments)
return <div>Searching for: {args.query}</div>
}
export const App = () => (
<FunctionComponentsContext.Provider value={{ search_google: SearchGoogle }}>
<Thread />
</FunctionComponentsContext.Provider>
)