How to integrate Clockify MCP with Vercel AI SDK v6

This guide walks you through connecting Clockify to Vercel AI SDK v6 using the Composio tool router. By the end, you'll have a working Clockify agent that can list all your active workspaces, add a new client to marketing workspace, show all users on design team workspace through natural language commands. This guide will help you understand how to give your Vercel AI SDK agent real control over a Clockify account through Composio's Clockify MCP server. Before we dive in, let's take a quick look at the key ideas and tools involved.

Clockify logoClockify
Api KeyOauth2

Clockify is a free time tracking software for individuals and teams to monitor work hours across projects. Track, manage, and report time for better productivity and transparency.

73 Tools

Introduction

This guide walks you through connecting Clockify to Vercel AI SDK v6 using the Composio tool router. By the end, you'll have a working Clockify agent that can list all your active workspaces, add a new client to marketing workspace, show all users on design team workspace through natural language commands.

This guide will help you understand how to give your Vercel AI SDK agent real control over a Clockify account through Composio's Clockify MCP server.

Before we dive in, let's take a quick look at the key ideas and tools involved.

Also integrate Clockify with

TL;DR

Here's what you'll learn:
  • How to set up and configure a Vercel AI SDK agent with Clockify integration
  • Using Composio's Tool Router to dynamically load and access Clockify tools
  • Creating an MCP client connection using HTTP transport
  • Building an interactive CLI chat interface with conversation history management
  • Handling tool calls and results within the Vercel AI SDK framework

What is Vercel AI SDK?

The Vercel AI SDK is a TypeScript library for building AI-powered applications. It provides tools for creating agents that can use external services and maintain conversation state.

Key features include:

  • streamText: Core function for streaming responses with real-time tool support
  • MCP Client: Built-in support for Model Context Protocol via @ai-sdk/mcp
  • Step Counting: Control multi-step tool execution with stopWhen: stepCountIs()
  • OpenAI Provider: Native integration with OpenAI models

What is the Clockify MCP server, and what's possible with it?

The Clockify MCP server is an implementation of the Model Context Protocol that connects your AI agent and assistants like Claude, Cursor, etc directly to your Clockify account. It provides structured and secure access to your team's time tracking data, so your agent can perform actions like managing clients, handling workspace users, setting up webhooks, and retrieving workspace details on your behalf.

  • Workspace user management: Let your agent list all users in a workspace, filter users by advanced criteria, or find team managers for more efficient team organization.
  • Client creation and deletion: Easily create new clients or remove existing ones from your workspace, streamlining project onboarding and cleanup.
  • Webhook automation: Enable your agent to create, delete, and manage webhooks for real-time notifications and integrations with other tools.
  • Workspace overview and navigation: Retrieve a list of all workspaces you belong to, empowering your agent to access and organize time tracking across multiple teams or projects.
  • Addon and webhook token management: Generate new webhook tokens and list all addon webhooks, ensuring secure and automated integrations with third-party services.

What is the Composio tool router, and how does it fit here?

What is Composio SDK?

Composio's Composio SDK helps agents find the right tools for a task at runtime. You can plug in multiple toolkits (like Gmail, HubSpot, and GitHub), and the agent will identify the relevant app and action to complete multi-step workflows. This can reduce token usage and improve the reliability of tool calls. Read more here: Getting started with Composio SDK

The tool router generates a secure MCP URL that your agents can access to perform actions.

How the Composio SDK works

The Composio SDK follows a three-phase workflow:

  1. Discovery: Searches for tools matching your task and returns relevant toolkits with their details.
  2. Authentication: Checks for active connections. If missing, creates an auth config and returns a connection URL via Auth Link.
  3. Execution: Executes the action using the authenticated connection.

Step-by-step Guide

Step by step09 STEPS
1

Prerequisites

Before you begin, make sure you have:
  • Node.js and npm installed
  • A Composio account with API key
  • An OpenAI API key
2

Getting API Keys for OpenAI and Composio

OpenAI API Key
  • Go to the OpenAI dashboard and create an API key. You'll need credits to use the models, or you can connect to another model provider.
  • Keep the API key safe.
Composio API Key
  • Log in to the Composio dashboard.
  • Navigate to your API settings and generate a new API key.
  • Store this key securely as you'll need it for authentication.
3

Install required dependencies

bash
npm install @ai-sdk/openai @ai-sdk/mcp @composio/core ai dotenv

First, install the necessary packages for your project.

What you're installing:

  • @ai-sdk/openai: Vercel AI SDK's OpenAI provider
  • @ai-sdk/mcp: MCP client for Vercel AI SDK
  • @composio/core: Composio SDK for tool integration
  • ai: Core Vercel AI SDK
  • dotenv: Environment variable management
4

Set up environment variables

bash
OPENAI_API_KEY=your_openai_api_key_here
COMPOSIO_API_KEY=your_composio_api_key_here
COMPOSIO_USER_ID=your_user_id_here

Create a .env file in your project root.

What's needed:

  • OPENAI_API_KEY: Your OpenAI API key for GPT model access
  • COMPOSIO_API_KEY: Your Composio API key for tool access
  • COMPOSIO_USER_ID: A unique identifier for the user session
5

Import required modules and validate environment

typescript
import "dotenv/config";
import { openai } from "@ai-sdk/openai";
import { Composio } from "@composio/core";
import * as readline from "readline";
import { streamText, type ModelMessage, stepCountIs } from "ai";
import { createMCPClient } from "@ai-sdk/mcp";

const composioAPIKey = process.env.COMPOSIO_API_KEY;
const composioUserID = process.env.COMPOSIO_USER_ID;

if (!process.env.OPENAI_API_KEY) throw new Error("OPENAI_API_KEY is not set");
if (!composioAPIKey) throw new Error("COMPOSIO_API_KEY is not set");
if (!composioUserID) throw new Error("COMPOSIO_USER_ID is not set");

const composio = new Composio({
  apiKey: composioAPIKey,
});
What's happening:
  • We're importing all necessary libraries including Vercel AI SDK's OpenAI provider and Composio
  • The dotenv/config import automatically loads environment variables
  • The MCP client import enables connection to Composio's tool server
6

Create Tool Router session and initialize MCP client

typescript
async function main() {
  // Create a tool router session for the user
  const session = await composio.create(composioUserID!, {
    toolkits: ["clockify"],
  });

  const mcpUrl = session.mcp.url;
What's happening:
  • We're creating a Tool Router session that gives your agent access to Clockify tools
  • The create method takes the user ID and specifies which toolkits should be available
  • The returned mcp object contains the URL and authentication headers needed to connect to the MCP server
  • This session provides access to all Clockify-related tools through the MCP protocol
7

Connect to MCP server and retrieve tools

typescript
const mcpClient = await createMCPClient({
  transport: {
    type: "http",
    url: mcpUrl,
    headers: session.mcp.headers, // Authentication headers for the Composio MCP server
  },
});

const tools = await mcpClient.tools();
What's happening:
  • We're creating an MCP client that connects to our Composio Tool Router session via HTTP
  • The mcp.url provides the endpoint, and mcp.headers contains authentication credentials
  • The type: "http" is important - Composio requires HTTP transport
  • tools() retrieves all available Clockify tools that the agent can use
8

Initialize conversation and CLI interface

typescript
let messages: ModelMessage[] = [];

console.log("Chat started! Type 'exit' or 'quit' to end the conversation.\n");
console.log(
  "Ask any questions related to clockify, like summarize my last 5 emails, send an email, etc... :)))\n",
);

const rl = readline.createInterface({
  input: process.stdin,
  output: process.stdout,
  prompt: "> ",
});

rl.prompt();
What's happening:
  • We initialize an empty messages array to maintain conversation history
  • A readline interface is created to accept user input from the command line
  • Instructions are displayed to guide the user on how to interact with the agent
9

Handle user input and stream responses with real-time tool feedback

typescript
rl.on("line", async (userInput: string) => {
  const trimmedInput = userInput.trim();

  if (["exit", "quit", "bye"].includes(trimmedInput.toLowerCase())) {
    console.log("\nGoodbye!");
    rl.close();
    process.exit(0);
  }

  if (!trimmedInput) {
    rl.prompt();
    return;
  }

  messages.push({ role: "user", content: trimmedInput });
  console.log("\nAgent is thinking...\n");

  try {
    const stream = streamText({
      model: openai("gpt-5"),
      messages,
      tools,
      toolChoice: "auto",
      stopWhen: stepCountIs(10),
      onStepFinish: (step) => {
        for (const toolCall of step.toolCalls) {
          console.log(`[Using tool: ${toolCall.toolName}]`);
          }
          if (step.toolCalls.length > 0) {
            console.log(""); // Add space after tool calls
          }
        },
      });

      for await (const chunk of stream.textStream) {
        process.stdout.write(chunk);
      }

      console.log("\n\n---\n");

      // Get final result for message history
      const response = await stream.response;
      if (response?.messages?.length) {
        messages.push(...response.messages);
      }
    } catch (error) {
      console.error("\nAn error occurred while talking to the agent:");
      console.error(error);
      console.log(
        "\nYou can try again or restart the app if it keeps happening.\n",
      );
    } finally {
      rl.prompt();
    }
  });

  rl.on("close", async () => {
    await mcpClient.close();
    console.log("\n👋 Session ended.");
    process.exit(0);
  });
}

main().catch((err) => {
  console.error("Fatal error:", err);
  process.exit(1);
});
What's happening:
  • We use streamText instead of generateText to stream responses in real-time
  • toolChoice: "auto" allows the model to decide when to use Clockify tools
  • stopWhen: stepCountIs(10) allows up to 10 steps for complex multi-tool operations
  • onStepFinish callback displays which tools are being used in real-time
  • We iterate through the text stream to create a typewriter effect as the agent responds
  • The complete response is added to conversation history to maintain context
  • Errors are caught and displayed with helpful retry suggestions

Complete Code

Here's the complete code to get you started with Clockify and Vercel AI SDK:

typescript
import "dotenv/config";
import { openai } from "@ai-sdk/openai";
import { Composio } from "@composio/core";
import * as readline from "readline";
import { streamText, type ModelMessage, stepCountIs } from "ai";
import { createMCPClient } from "@ai-sdk/mcp";

const composioAPIKey = process.env.COMPOSIO_API_KEY;
const composioUserID = process.env.COMPOSIO_USER_ID;

if (!process.env.OPENAI_API_KEY) throw new Error("OPENAI_API_KEY is not set");
if (!composioAPIKey) throw new Error("COMPOSIO_API_KEY is not set");
if (!composioUserID) throw new Error("COMPOSIO_USER_ID is not set");

const composio = new Composio({
  apiKey: composioAPIKey,
});

async function main() {
  // Create a tool router session for the user
  const session = await composio.create(composioUserID!, {
    toolkits: ["clockify"],
  });

  const mcpUrl = session.mcp.url;

  const mcpClient = await createMCPClient({
    transport: {
      type: "http",
      url: mcpUrl,
      headers: session.mcp.headers, // Authentication headers for the Composio MCP server
    },
  });

  const tools = await mcpClient.tools();

  let messages: ModelMessage[] = [];

  console.log("Chat started! Type 'exit' or 'quit' to end the conversation.\n");
  console.log(
    "Ask any questions related to clockify, like summarize my last 5 emails, send an email, etc... :)))\n",
  );

  const rl = readline.createInterface({
    input: process.stdin,
    output: process.stdout,
    prompt: "> ",
  });

  rl.prompt();

  rl.on("line", async (userInput: string) => {
    const trimmedInput = userInput.trim();

    if (["exit", "quit", "bye"].includes(trimmedInput.toLowerCase())) {
      console.log("\nGoodbye!");
      rl.close();
      process.exit(0);
    }

    if (!trimmedInput) {
      rl.prompt();
      return;
    }

    messages.push({ role: "user", content: trimmedInput });
    console.log("\nAgent is thinking...\n");

    try {
      const stream = streamText({
        model: openai("gpt-5"),
        messages,
        tools,
        toolChoice: "auto",
        stopWhen: stepCountIs(10),
        onStepFinish: (step) => {
          for (const toolCall of step.toolCalls) {
            console.log(`[Using tool: ${toolCall.toolName}]`);
          }
          if (step.toolCalls.length > 0) {
            console.log(""); // Add space after tool calls
          }
        },
      });

      for await (const chunk of stream.textStream) {
        process.stdout.write(chunk);
      }

      console.log("\n\n---\n");

      // Get final result for message history
      const response = await stream.response;
      if (response?.messages?.length) {
        messages.push(...response.messages);
      }
    } catch (error) {
      console.error("\nAn error occurred while talking to the agent:");
      console.error(error);
      console.log(
        "\nYou can try again or restart the app if it keeps happening.\n",
      );
    } finally {
      rl.prompt();
    }
  });

  rl.on("close", async () => {
    await mcpClient.close();
    console.log("\n👋 Session ended.");
    process.exit(0);
  });
}

main().catch((err) => {
  console.error("Fatal error:", err);
  process.exit(1);
});

Conclusion

You've successfully built a Clockify agent using the Vercel AI SDK with streaming capabilities! This implementation provides a powerful foundation for building AI applications with natural language interfaces and real-time feedback.

Key features of this implementation:

  • Real-time streaming responses for a better user experience with typewriter effect
  • Live tool execution feedback showing which tools are being used as the agent works
  • Dynamic tool loading through Composio's Tool Router with secure authentication
  • Multi-step tool execution with configurable step limits (up to 10 steps)
  • Comprehensive error handling for robust agent execution
  • Conversation history maintenance for context-aware responses

You can extend this further by adding custom error handling, implementing specific business logic, or integrating additional Composio toolkits to create multi-app workflows.
TOOLS

Supported Tools

Every Clockify action and event your agent gets out of the box.

Add User to Group

Tool to add a user to a user group in a Clockify workspace.

Create Client

Tool to add a new client to a workspace.

Create New Project

Tool to create a new project in a Clockify workspace.

Create Shared Report

Tool to create a shared report in Clockify.

Create Task

Tool to add a new task to a project in Clockify.

Create Templates On Workspace

Tool to create templates on a Clockify workspace.

Create Time Entry

Tool to create a new time entry in a Clockify workspace.

Create User Group

Tool to create a new user group in a workspace.

Create User Time Entry

Tool to create a time entry for another user in a Clockify workspace.

Create Webhook

Tool to create a new webhook in a workspace.

Create Workspace

Tool to create a new workspace in Clockify.

Delete Client

Permanently deletes a client from a Clockify workspace.

Delete Project

Tool to delete a project from a workspace.

Delete Shared Report

Tool to delete a shared report from a workspace by ID.

Delete Tag

Tool to delete a tag from a Clockify workspace.

Delete Task

Tool to delete a task from a project in Clockify.

Delete Template

Tool to delete a template from a Clockify workspace.

Delete Time Entry

Tool to delete a time entry from a workspace by ID.

Delete User Group

Tool to delete a user group from a workspace.

Delete User Time Entries

Tool to delete multiple time entries for a user in a workspace.

Delete Webhook

Tool to delete a webhook from a workspace.

Duplicate Time Entry

Tool to duplicate an existing time entry in a Clockify workspace.

Filter Workspace Users

Tool to filter users in a workspace by advanced criteria.

Find User's Team Managers

Retrieves the list of team managers assigned to a specific user in a Clockify workspace.

Generate Detailed Report

Tool to generate a detailed time entry report with filtering and pagination.

Generate Expense Report

Tool to generate a detailed expense report for a Clockify workspace.

Generate New Webhook Token

Tool to generate a new webhook token.

Generate Summary Report

Tool to generate a summary report for time entries in a Clockify workspace.

Generate Weekly Report

Tool to generate a weekly time entry report for a workspace with grouped data.

Get All Addon Webhooks

Tool to list all webhooks for an addon in a workspace.

Get All My Workspaces

Tool to list all workspaces the user belongs to.

Get All Webhooks

Tool to list all webhooks in a workspace.

Get Client By ID

Retrieves detailed information about a specific client in a Clockify workspace.

Get Clients

Tool to list clients in a workspace.

Get Created Entities

Tool to retrieve created entities within a workspace (Experimental).

Get Currently Logged In User Info

Tool to retrieve info about the authenticated user.

Get Deleted Entities

Tool to retrieve information about entities deleted within a date range (Experimental API).

Get Holidays

Tool to retrieve all holidays for a workspace.

Get Holidays In Period

Tool to retrieve holidays in a specific period.

Get In Progress Time Entries

Tool to retrieve all currently running time entries in a workspace.

Get member's profile

Tool to get a member's profile in a workspace.

Get Project

Tool to retrieve detailed information about a specific project by ID.

Get Projects

Tool to list projects in a workspace with filtering and pagination.

Get Shared Report

Tool to retrieve a shared report by ID from Clockify.

Get Shared Reports

Tool to retrieve all shared reports in a workspace.

Get Tag By ID

Tool to retrieve detailed information about a specific tag by ID in a Clockify workspace.

Get Tags

Tool to find and list tags in a workspace.

Get Task

Retrieves detailed information about a specific task in a Clockify project.

Get Tasks

Tool to find all tasks on a specific project in a workspace.

Get Templates On Workspace

Tool to list all templates in a workspace.

Get Time Entries

Tool to retrieve historical time entries for a user in a workspace with filters.

Get Time Entry

Tool to retrieve a specific time entry by ID from a workspace.

Get Updated Entities

Tool to retrieve entities that have been updated in a workspace (Experimental).

Get User Groups

Tool to find all user groups in a workspace.

Get Webhook By ID

Retrieves detailed information about a specific webhook in a Clockify workspace.

Get Webhook Logs

Tool to retrieve webhook logs for a specific webhook.

Get Workspace Info

Retrieves detailed information about a specific Clockify workspace.

List Assignments

Tool to retrieve all scheduling assignments in a workspace.

Remove User From Group

Tool to remove a user from a group in Clockify.

Stop User Timer

Tool to stop a currently running timer for a user in a workspace.

Update Client

Tool to update an existing client in a Clockify workspace.

Update Project

Tool to update an existing project in a Clockify workspace.

Update Project Memberships

Tool to update project memberships in Clockify.

Update Project User Hourly Rate

Tool to update a project user's billable rate.

Update Shared Report

Tool to update an existing shared report in Clockify.

Update Tag

Tool to update a tag in a Clockify workspace.

Update Task

Tool to update an existing task on a project in Clockify.

Update Time Entries

Tool to bulk update multiple time entries in a Clockify workspace.

Update Time Entry

Tool to update an existing time entry in a Clockify workspace.

Update User Group

Tool to update an existing user group in a workspace.

Update User Hourly Rate

Tool to update a user's hourly rate in a Clockify workspace.

Update Webhook

Tool to update a webhook in a workspace.

Update Workspace Hourly Rate

Tool to update the workspace billable hourly rate.

FAQ

Frequently asked questions

With a standalone Clockify MCP server, the agents and LLMs can only access a fixed set of Clockify tools tied to that server. However, with the Composio Tool Router, agents can dynamically load tools from Clockify and many other apps based on the task at hand, all through a single MCP endpoint.

Yes, you can. Vercel AI SDK v6 fully supports MCP integration. You get structured tool calling, message history handling, and model orchestration while Tool Router takes care of discovering and serving the right Clockify tools.

Yes, absolutely. You can configure which Clockify scopes and actions are allowed when connecting your account to Composio. You can also bring your own OAuth credentials or API configuration so you keep full control over what the agent can do.

All sensitive data such as tokens, keys, and configuration is fully encrypted at rest and in transit. Composio is SOC 2 Type 2 compliant and follows strict security practices so your Clockify data and credentials are handled as safely as possible.

Start with Clockify.It takes 30 seconds.

Managed auth, hosted MCP servers, and every Clockify tool your agent needs.Free to start.

Start building