Apricot Research Agent 🧠

A sophisticated AI-powered research assistant that combines intelligent web research, beautiful formatting, and automated email delivery. This full-stack application leverages n8n automation workflows to provide seamless research experiences with professional presentation.

🌟 Features

Intelligent Web Research: Powered by Tavily search API for comprehensive web research
AI-Powered Processing: Dual AI agents for research synthesis and HTML formatting
Beautiful Output: Professional HTML formatting optimized for email clients
PDF Generation: Automatic conversion to PDF format using PDForge
Email Automation: Automated delivery of research results via Gmail integration
Responsive Frontend: Modern React interface with real-time chat functionality
Webhook Integration: RESTful API endpoints for seamless integration

N8N Architecture

🏗️ Architecture

Frontend (`apricot-agent-ui/`)

React 18 with TypeScript for type safety
Vite for fast development and building
Shadcn/ui for beautiful, accessible UI components
Tailwind CSS for responsive styling
React Query for efficient data fetching
React Router for navigation

Backend Automation (`n8n json/Personalized Learning Assistant.json`)

n8n Workflow: Visual automation platform
Webhook Trigger: Receives research requests via POST endpoint
AI Research Agent: Processes queries using OpenAI GPT-4o-mini
Tavily Integration: Performs comprehensive web searches
HTML Styling Agent: Converts research into beautiful, email-safe HTML
PDF Generation: Uses PDForge to create downloadable PDFs
Gmail Integration: Automated email delivery with formatted results

🚀 Quick Start

Prerequisites

Node.js (v16 or higher)
npm or yarn
n8n instance (self-hosted or cloud)
API Keys: OpenAI, Tavily, PDForge, Gmail

1. Clone the Repository

git clone <repository-url>
cd apricot-research-agent

2. Frontend Setup

cd apricot-agent-ui
npm install

3. Environment Configuration

Create a .env file in the apricot-agent-ui directory:

# Add your API keys here if needed
VITE_API_URL=https://your-n8n-instance.com

4. Run Development Server

npm run dev

The application will be available at http://localhost:5173

5. n8n Workflow Setup

Import the Workflow

Copy the Personalized Learning Assistant.json file to your n8n instance
Import it into your n8n dashboard
The workflow will be available as "Personalized Learning Assistant"

Required API Keys & Credentials

OpenAI API Key

Create account at OpenAI Platform
Generate API key
Add as "OpenAI account 2" credential in n8n

Tavily API Key

Create account at Tavily
Generate API key
Add as "Tavily account" credential in n8n

PDForge API Key

Create account at [PDForge]
Generate API key
Add as "PDForge account" credential in n8n

Gmail OAuth2

Enable Gmail API in Google Cloud Console
Create OAuth2 credentials
Add as "Gmail account" credential in n8n

Webhook Configuration

The webhook endpoint is automatically generated when you import the workflow. Update the frontend API call in ChatInterface.tsx if using a different n8n instance:

const response = await fetch(
  "https://your-n8n-instance.com/webhook/66fd6d27-e67d-4600-935b-17b21026c779",
  // ... rest of the code
);

📋 How It Works

Research Flow

User Input: User enters research query and email in the chat interface
Webhook Trigger: Request sent to n8n webhook endpoint
AI Research: Research agent processes query using Tavily search
Content Formatting: Styling agent converts to beautiful HTML
Dual Output:
- Email: Formatted HTML sent to user's email
- PDF: Research compiled into downloadable PDF
- Web Response: Formatted content returned to frontend

AI Agents

Research Agent

Utilizes OpenAI GPT-4o-mini for intelligent research synthesis
Integrates Tavily search for comprehensive web research
Performs multiple search iterations for thorough coverage
Synthesizes information from multiple sources

Styling Agent

Converts research output to email-safe HTML
Uses responsive design principles
Ensures compatibility across email clients
Applies professional formatting and styling

🛠️ Development

Project Structure

apricot-research-agent/
├── apricot-agent-ui/          # React frontend
│   ├── src/
│   │   ├── components/        # UI components
│   │   ├── pages/            # Page components
│   │   ├── hooks/            # Custom React hooks
│   │   └── lib/              # Utilities
│   ├── public/               # Static assets
│   └── package.json          # Dependencies
└── n8n json/
    └── Personalized Learning Assistant.json  # n8n workflow

Key Components

ChatInterface.tsx

Main chat interface with email input
Handles API communication with n8n
Manages message state and loading states

ResearchContentDisplay.tsx

Displays formatted research results
Handles markdown rendering
Provides download and sharing options

MarkdownRenderer.tsx

Custom markdown rendering component
Supports research-specific formatting

Customization

Modifying the Research Agent

Edit the system prompt in the n8n workflow to customize research behavior:

Adjust search strategies
Modify output formatting
Add new research capabilities

Styling Customization

Update the styling agent prompt to change:

HTML structure
CSS styling
Email compatibility settings

🔧 API Reference

Webhook Endpoint

POST /webhook/66fd6d27-e67d-4600-935b-17b21026c779
Content-Type: application/json

{
  "prompt": "Your research query",
  "email": "user@example.com"
}

Response Format

{
  "formatted-research-content": "HTML formatted research results"
}

📧 Email Integration

The system automatically sends two emails:

Research Results: Formatted HTML with research findings
PDF Download: Link to downloadable PDF version

Email templates are optimized for:

Gmail compatibility
Mobile responsiveness
Professional presentation
Accessibility standards

🔐 Security & Privacy

All API communications use HTTPS
Credentials stored securely in n8n
No personal data stored in frontend
Webhook endpoints use unique identifiers

🤝 Contributing

Fork the repository
Create a feature branch
Make your changes
Test thoroughly
Submit a pull request

📄 License

This project is created by Madhav S Baidya. Please respect the intellectual property and give appropriate credit when using or referencing this work.

🙏 Acknowledgments

n8n for the automation platform
OpenAI for AI capabilities
Tavily for web search functionality
PDForge for PDF generation
Shadcn/ui for beautiful UI components

📞 Support

For questions or support, please contact Madhav S Baidya or create an issue in the repository.

Built with ❤️ by Madhav S Baidya

Name		Name	Last commit message	Last commit date
assets		assets
n8n json		n8n json
public		public
src		src
.gitignore		.gitignore
README.md		README.md
bun.lockb		bun.lockb
components.json		components.json
eslint.config.js		eslint.config.js
index.html		index.html
package-lock.json		package-lock.json
package.json		package.json
postcss.config.js		postcss.config.js
tailwind.config.ts		tailwind.config.ts
tsconfig.app.json		tsconfig.app.json
tsconfig.json		tsconfig.json
tsconfig.node.json		tsconfig.node.json
vite.config.ts		vite.config.ts

Latest commit

History

Folders and files

Repository files navigation