Overview

AgentKit is a framework for building AI agents with tools, memory, and autonomous behavior. It provides a structured way to define what an agent can do and how it makes decisions, enabling developers to build flexible, task-oriented agents.

By integrating with GBox, AgentKit agents gain the ability to control managed headless browsers, enabling them to autonomously search the web, extract data, and interact with websites. This makes them well-suited for real-time information retrieval and robust web automation.

Getting Started

1

Install Dependencies

Install the necessary dependencies for your project.

npm install gbox-sdk @inngest/agent-kit playwright-core dotenv typescript tsx @types/node
2

Add Environment Variables

Create a .env file in your project root and add your Gbox API key:

GBOX_API_KEY=your_gbox_api_key
ANTHROPIC_API_KEY=your_anthropic_api_key
3

Setup an AgentKit Network with an Agent

Create a new file agent.ts and set up your AgentKit network with an agent that can use Gbox:

import {
    anthropic,
    createAgent,
    createNetwork,
    createTool,
} from "@inngest/agent-kit";

// Create the search agent
const searchAgent = createAgent({
    name: "reddit_searcher",
    description:
        "An intelligent agent that searches Reddit for relevant information and provides summarized insights",
    system: `You are a helpful Reddit search assistant. When searching for information:
    1. Use the search_reddit tool to find relevant posts
    2. Summarize the key findings from multiple posts
    3. Highlight different perspectives or opinions found
    4. Provide context about the discussions
    5. If no results are found, suggest alternative search terms`,
    tools: [searchReddit],
});

// Create the network with proper API key configuration
const redditSearchNetwork = createNetwork({
    name: "reddit_search_network",
    description:
        "A network that intelligently searches Reddit and provides insights",
    agents: [searchAgent],
    maxIter: 5, // Allow more iterations for better results
    defaultModel: anthropic({
        model: "claude-3-5-sonnet-latest",
        apiKey: requiredEnvVars.ANTHROPIC_API_KEY,
        defaultParameters: {
            max_tokens: 4096,
        },
    }),
});
4

Define the Search Tool

Define the searchReddit tool that uses Gbox to search Reddit:

import GboxSDK from "gbox-sdk";
import { chromium } from "playwright-core";
import dotenv from "dotenv";
import { z } from "zod";

// Load environment variables
dotenv.config();

// Validate required environment variables
const requiredEnvVars = {
    GBOX_API_KEY: process.env.GBOX_API_KEY,
    ANTHROPIC_API_KEY: process.env.ANTHROPIC_API_KEY,
};

// Create a tool to search Reddit using Gbox SDK
if (!requiredEnvVars.GBOX_API_KEY || !requiredEnvVars.ANTHROPIC_API_KEY) {
    throw new Error(
        "Missing required environment variables: GBOX_API_KEY and ANTHROPIC_API_KEY"
    );
}

const searchReddit = createTool({
    name: "search_reddit",
    description: "Search Reddit posts and comments using PullPush API",
    parameters: z.object({
        query: z.string().describe("The search query for Reddit"),
    }),
    handler: async ({ query }) => {
        console.log(`🔍 Searching Reddit for: "${query}"`);

        const gboxSDK = new GboxSDK({
            apiKey: requiredEnvVars.GBOX_API_KEY,
        });
        const box = await gboxSDK.create({ type: "linux" });
        const cdpUrl = await box.browser.cdpUrl();

        try {
            const browser = await chromium.connectOverCDP(cdpUrl);
            const browserContext = await browser.newContext();
            const page = await browserContext.newPage();

            // Construct the search URL
            const searchUrl = `https://search-new.pullpush.io/?type=submission&q=${query}`;
            await page.goto(searchUrl);

            // Wait for results to load
            await page.waitForSelector("div.results", { timeout: 10000 });

            // Extract search results
            const results = await page.evaluate(() => {
                const posts = document.querySelectorAll(
                    "div.results div:has(h1)"
                );
                return Array.from(posts).map((post) => ({
                    title: post.querySelector("h1")?.textContent?.trim(),
                    content: post.querySelector("div")?.textContent?.trim(),
                }));
            });

            // Close the browser
            await browser.close();
            console.log("Browser closed");

            // Terminate the box
            await box.terminate();
            console.log("Box terminated");

            return results.slice(0, 5); // Return top 5 results
        } catch (error) {
            console.error("Error connecting to browser:", error);
            throw new Error("Failed to connect to browser for Reddit search");
        }
    },
});
5

Put It All Together

Now, combine everything in your agent.ts file to create a complete AgentKit network that can search Reddit:

// Helper function to extract the final agent response from AgentKit's response format
function extractFinalResponse(response) {
    try {
        // Check if response has the new state structure
        if (response && response.state && response.state._results) {
            // Get the last result from _results array
            const results = response.state._results;
            if (results.length > 0) {
                const lastResult = results[results.length - 1];

                // Extract the content from the output array
                if (lastResult.output && Array.isArray(lastResult.output)) {
                    for (const outputItem of lastResult.output) {
                        if (outputItem.type === "text" && outputItem.content) {
                            return outputItem.content;
                        }
                    }
                }
            }
        }

        // If we can't find a clear text response, return a message
        return "Unable to extract response content from agent output.";
    } catch (error) {
        console.error("Error extracting response:", error);
        return "Error occurred while processing agent response.";
    }
}

// Main execution function with combined formatting and search
async function searchRedditWithAgent(
    query = "Best programming languages for beginners"
) {
    try {
        console.log(`\n${"=".repeat(75)}`);
        console.log(`\t Query: ${query}`);
        console.log(`${"=".repeat(75)}`);

        console.log(`🚀 Starting Reddit search for: "${query}"`);
        console.log("⏳ This may take a moment...\n");

        // Run the agent network
        const response = await redditSearchNetwork.run(query);

        console.log("✅ Search completed!");

        // Extract the final text response using our helper function
        const finalResponse = extractFinalResponse(response);

        console.log("📊 Results:", finalResponse.slice(0, 50) + "...");

        // Log the clean result for user consumption
        console.log("\n" + "-".repeat(60));
        console.log("\t\t 🎯 Final Clean Response");
        console.log("-".repeat(60));
        console.log(finalResponse);

        return finalResponse;
    } catch (error) {
        console.error(`❌ Failed to process query "${query}":`, error.message);
        throw error;
    }
}

// Run the example
searchRedditWithAgent().catch(console.error);
6

Run Your Agent

You can run your agent using the following command:

npx tsx agent.ts

This will execute the agent, which will search Reddit for the specified query and return summarized results.