Skip to main content

Support Zod Function Tools in OpenAssistant

· 4 min read
Xun Li
Software Engineer @ OpenAssistant

OpenAssistant now provides enhanced support for function tools using Zod, making it easier than ever to create type-safe, interactive AI tools with rich UI components. Let's explore how this powerful feature works and how you can use it in your applications.

What are Zod Function Tools?​

Zod function tools in OpenAssistant extend the Vercel AI SDK's tool system with additional capabilities. These tools combine:

  • Type-safe schema validation using Zod
  • Executable functions for handling user requests
  • Context management for dynamic data
  • UI components for rich visual feedback

Key Features​

Type-Safe Schema Definition​

Using Zod, you can define your tool's parameters with precise types and validation:

z.object({
location: z.string().describe('The location to get the weather for'),
})

This schema definition helps the LLM understand the expected input format and generates appropriate parameter values.

Enhanced Tool Structure​

Each tool consists of three main components:

  • execute: A function that processes the request and returns results
  • context: Optional data provider for the execution
  • component: Optional React component for visualizing results

This structure allows you to:

  • Validate user inputs with Zod
  • Dynamically provide data to the tool
  • Display rich UI components for the tool's output

Rich Response Format​

Tools return structured responses with two key elements:

  • llmResult: Text response sent back to the LLM
  • output: Optional data for UI rendering or subsequent tool calls

Example Implementation​

Here's a simple weather tool implementation:

const weatherTool = tool({
description: 'Get the weather in a location',
parameters: z.object({
location: z.string().describe('The location to get the weather for'),
}),
execute: async ({ location }) => {
return {
llmResult: `Weather in ${location}`,
output: {
temperature: 72 + Math.floor(Math.random() * 21) - 10,
},
};
},
component: WeatherDisplay // Optional React component
});

Using Context for Dynamic Data​

The context feature allows tools to access external data or services:

const weatherTool = tool({
// ... other properties
context: {
getWeatherData: async (location: string) => {
// Fetch real weather data
return await weatherAPI.fetch(location);
}
}
});

Visual Feedback with Components​

Tools can include React components to visualize results:

function WeatherDisplay({ temperature, location }) {
return (
<div className="weather-card">
<h3>{location}</h3>
<p>{temperature}°F</p>
</div>
);
}

Integration with OpenAssistant​

To use Zod function tools in your OpenAssistant application, reference the example from the codebase:

export function App() {
const functions = {
weather: tool({
description: 'Get the weather in a city from a weather station',
parameters: z
.object({ cityName: z.string() })
.describe('The city name to get the weather for'),
execute: async ({ cityName }, options) => {
const getStation = options.context?.getStation;
const station = getStation ? await getStation(cityName) : null;
return {
llmResult: `The weather in ${cityName} is sunny from weather station ${station}.`,
output: {
weather: 'sunny',
station,
},
};
},
context: {
getStation: async (cityName: string) => {
const stations = {
'New York': '123',
'Los Angeles': '456',
Chicago: '789',
};
return stations[cityName];
},
},
component: WeatherStation,
}),
};

Benefits​

  • Type Safety: Zod schemas provide runtime type checking and validation
  • Better AI Understanding: Clear parameter descriptions help the LLM generate appropriate inputs
  • Rich UI Integration: Built-in support for React components enables visual feedback
  • Flexible Context: Dynamic data fetching and state management through context
  • Developer Experience: Improved tooling and TypeScript support

Conclusion​

OpenAssistant's Zod function tools provide a powerful way to create interactive AI features with type safety and rich UI components. This combination of Zod's type system, executable functions, and React components creates a robust foundation for building sophisticated AI-powered applications.