Agents

An AI agent in InAppAI is an intelligent chat assistant powered by large language models (LLMs) like GPT-4, Claude, or Gemini.

What Makes It an “Agent”?

Unlike simple chatbots that only respond with text, InAppAI agents can:

Understand Context - See information about your application’s current state
Execute Actions - Call JavaScript functions to perform tasks
Reason and Plan - Break down complex requests into steps
Provide Feedback - Explain what they’re doing and why

Example: Not Just Answering Questions

Traditional Chatbot:

User: "Show me my overdue invoices"
Bot: "You can find overdue invoices in the Billing section."

InAppAI Agent:

User: "Show me my overdue invoices"
Agent: *calls filterInvoices({ status: 'overdue' })*
Agent: *calls sortBy({ field: 'dueDate', order: 'desc' })*
Agent: "I've filtered your invoices to show 12 overdue items,
       sorted by due date. The oldest is from March 15th."

The agent actually performed actions instead of just describing them.

How Agents Work

1. User Input

User asks a question or requests an action:

“What’s in my cart?”
“Add ‘Buy groceries’ to my todo list”
“Find all high-priority tasks”

2. Agent Reasoning

The AI analyzes the request and determines:

What information is needed
Which tools (functions) to call
What parameters to use

3. Tool Execution

Agent calls your JavaScript functions:

// Agent decides to call this function
getCart() → { items: 3, total: 119.97 }

4. Response Generation

Agent uses the results to respond:

"You have 3 items in your cart totaling $119.97"

Agent Components

An InAppAI agent consists of:

1. Language Model (LLM)

The “brain” that understands and generates responses:

OpenAI: GPT-4o, GPT-4o Mini
Anthropic: Claude 3.5 Sonnet, Claude 3.5 Haiku
Google: Gemini 2.0 Flash

Choose your model in the backend settings.

2. Tool Registry

JavaScript functions you define that the agent can call:

tools={[
  { name: 'getCart', handler: async () => { ... } },
  { name: 'addToCart', handler: async ({ productId }) => { ... } },
]}

Learn more: Function Calling

3. Knowledge Base (Optional)

Custom documentation the agent can search:

Your product docs
FAQ pages
API reference
Help articles

Learn more: Knowledge Base

4. Conversation Memory

The agent remembers previous messages in the conversation:

User: "Show me sales from last quarter"
Agent: "Here are Q3 sales: $1.2M"

User: "How does that compare to the previous quarter?"
Agent: *remembers Q3 was mentioned*
Agent: "Q2 was $980K, so Q3 increased by 22%"

Multi-Step Reasoning

Agents can break down complex tasks:

Example: Adding a High-Priority Todo

User: "Remind me to call the client tomorrow morning, mark it urgent"

Agent reasoning:
1. Extract task: "Call the client"
2. Extract due date: "tomorrow morning" → 2024-03-16 09:00
3. Extract priority: "urgent" → priority: 'high'
4. Call addTodo({ text: "Call the client", dueDate: "...", priority: "high" })
5. Confirm: "I've added 'Call the client' to your high-priority tasks for tomorrow at 9am"

What Agents Can Do

Information Retrieval

Answer questions about your application
Search through data
Provide explanations
Reference documentation (from Knowledge Base)

Data Manipulation

Filter and sort lists
Update records
Create new entries
Delete items

Workflow Automation

Multi-step processes
Conditional logic
Error recovery
Status updates

User Assistance

Guided tutorials
Troubleshooting
Recommendations
Contextual help

Best Practices

1. Define Clear Tools

Give your agent well-defined capabilities:

// ✅ Clear purpose
{ name: 'addTodoItem', description: 'Add a new todo with text and priority' }

// ❌ Too vague
{ name: 'doStuff', description: 'Does things' }

2. Provide Helpful Descriptions

Help the agent understand when to use tools:

description: 'Mark a todo as completed when user indicates task is done'

3. Return Useful Information

Give the agent data it can reference:

handler: async ({ id }) => {
  const todo = markComplete(id);
  return { success: true, todo: todo, message: `Completed: ${todo.text}` };
}

4. Handle Errors Gracefully

handler: async ({ id }) => {
  try {
    const result = await updateDatabase(id);
    return { success: true, result };
  } catch (error) {
    return { success: false, message: 'Failed to update. Please try again.' };
  }
}

Next Steps

Context - How agents understand your application
Tools - Define actions agents can perform
Getting Started - Install and integrate InAppAI

Documentation