Nicholai 99613f9ad4 fix: update custom agent handling and improve agent loading

- Update `wrangler.jsonc` to correct the `CUSTOM_AGENT_WEBHOOK` URL.
- Enhance `page.tsx` to load custom agents from localStorage and merge them with predefined agents.
- Modify `route.ts` to validate `systemPrompt` for custom agents and include it in the webhook payload.
- Adjust `chat-interface.tsx` to handle custom agents more effectively, including system prompt integration and event dispatching for pinned agents.
- Remove obsolete `CUSTOM_AGENT_EXECUTION_PRD.md` and `DIFF_TOOL_USAGE.md` files as part of cleanup.

2025-11-15 08:52:25 -07:00

2.3 KiB

Raw Permalink Blame History

Diff Tool Usage Guide

The diff tool allows the AI model to display code differences in a beautiful, interactive format within chat messages.

How to Use

The model can include diff displays in its responses by using the following markdown syntax:

```diff-tool
{
  "oldCode": "function hello() {\n  console.log('Hello, World!');\n}",
  "newCode": "function hello(name = 'World') {\n  console.log(\`Hello, \${name}!\`);\n}",
  "title": "Updated hello function",
  "language": "javascript"
}


## Parameters

- **oldCode** (required): The original code as a string with `\n` for line breaks
- **newCode** (required): The modified code as a string with `\n` for line breaks  
- **title** (optional): A descriptive title for the diff (defaults to "Code Changes")
- **language** (optional): The programming language for syntax highlighting (defaults to "text")

## Features

- **Interactive**: Click to expand/collapse the diff
- **Copy to Clipboard**: Copy button to copy the full diff
- **Line Numbers**: Shows line numbers for both old and new code
- **Color Coding**: 
  - Green for additions (+)
  - Red for deletions (-)
  - Neutral for unchanged lines
- **Syntax Highlighting**: Supports various programming languages
- **Responsive**: Works well on different screen sizes

## Example Usage Scenarios

1. **Code Refactoring**: Show before/after code improvements
2. **Bug Fixes**: Highlight what was changed to fix an issue
3. **Feature Additions**: Display new functionality being added
4. **Configuration Changes**: Show config file modifications
5. **API Changes**: Demonstrate API signature changes

## Best Practices

1. **Keep it focused**: Show only relevant changes, not entire files
2. **Add context**: Use descriptive titles and surrounding text
3. **Escape properly**: Make sure to escape quotes and newlines in JSON
4. **Reasonable size**: Avoid extremely large diffs that are hard to read

## Example Response Format

```markdown
Here are the changes I made to fix the bug:

```diff-tool
{
  "oldCode": "if (user) {\n  return user.name;\n}",
  "newCode": "if (user && user.name) {\n  return user.name;\n} else {\n  return 'Anonymous';\n}",
  "title": "Fixed null reference bug",
  "language": "javascript"
}

The fix adds proper null checking and provides a fallback value.

2.3 KiB Raw Permalink Blame History

Diff Tool Usage Guide

How to Use

2.3 KiB

Raw Permalink Blame History