WhatsApp Bot Platform

A complete AI-powered WhatsApp chatbot solution with an admin dashboard for management and analytics. This platform enables businesses to automate customer support, provide instant responses, and learn from interactions.

🚀 System Architecture

This project consists of two main components:

Frontend

• Modern admin dashboard built with Next.js 15 and Tailwind CSS
• Responsive Material Design-inspired UI
• Theme support (light/dark mode)
• Interactive components for bot testing and management

Backend

• WhatsApp integration using WhatsApp Web.js
• AI-powered conversational agent using GPT models
• Vector database for knowledge retrieval
• File upload and document processing
• Analytics and data collection

✨ Key Features

• AI-Powered Chat: Intelligent responses using advanced language models
• Knowledge Base: Upload documents to train the bot with custom information
• WhatsApp Web Integration: Seamless connection using the WhatsApp Web.js library
• Analytics Dashboard: Track user engagement and bot performance
• Admin Controls: Manage bot settings, users, and configurations
• Conversation Management: View and analyze message history
• Customizable Responses: Fine-tune how your bot responds to users
• Multi-user Support: Different access levels for team members

🛠 Getting Started

Prerequisites

• Node.js 18.0 or later
• npm or yarn
• MongoDB (for backend database)
• OpenAI API key
• Chrome or Chromium browser (for WhatsApp Web.js)

Installation

1. Clone the repository:

git clone https://github.com/RaheesAhmed/WhatsApp-Bot.git
cd whatsapp-bot

2. Set up the backend:

cd backend
npm install

Create a .env file in the backend directory with the following:

#JWT SECRET
JWT_SECRET_KEY=

#OPENAI API KEYs
OPENAI_API_KEY=

# SUPABASE API KEYs
SUPABASE_URL=
SUPABASE_SERVICE_KEY=
SUPABASE_ANON_KEY=
SUPABASE_PRIVATE_KEY=

# Connect to Supabase via connection pooling with Supavisor.
DATABASE_URL=

# Direct connection to the database. Used for migrations.
DIRECT_URL=

TAVILY_API_KEY=
PORT=8000

3. Set up the frontend:

cd ../frontend
npm install

Create a .env.local file in the frontend directory with:

NEXT_PUBLIC_API_URL=

4. Start both services:

For backend:

cd backend
npm run dev

For frontend:

cd frontend
npm run dev

Access the admin dashboard at http://localhost:3000

📁 Project Structure

whatsapp_bot/
├── backend/               # Backend services
│   ├── agent/             # AI agent implementation
│   ├── config/            # Configuration files
│   ├── loaders/           # Service initialization modules
│   ├── tools/             # Agent tools and capabilities
│   ├── uploads/           # Uploaded files storage
│   ├── utils/             # Utility functions
│   └── vectorstore/       # Vector database for AI knowledge
├── frontend/              # Next.js 15 frontend
│   ├── app/               # Next.js app router pages
│   ├── components/        # Reusable UI components
│   ├── hooks/             # Custom React hooks
│   ├── lib/               # Utility functions
│   └── public/            # Static assets
└── README.md              # This file

🔍 How It Works

1. WhatsApp Connection: The backend connects to WhatsApp Web via the WhatsApp Web.js library
2. Authentication: QR code scanning for WhatsApp Web authentication
3. Message Processing: Incoming messages are processed by the AI agent
4. Knowledge Retrieval: The agent searches the vector database for relevant information
5. Response Generation: Using both retrieved knowledge and AI capabilities, a response is generated
6. WhatsApp Reply: The response is sent back to the user via WhatsApp
7. Analytics Tracking: Interactions are recorded for analysis in the admin dashboard

📊 Analytics and Monitoring

The platform provides detailed analytics on:

• User engagement metrics
• Popular questions and topics
• Response times and quality
• Bot performance and accuracy
• Conversation volumes and patterns

🔒 Security

• WhatsApp's end-to-end encryption for messages
• Secure session management
• Role-based access control for admin users
• Data encryption for sensitive information
• GDPR-compliant data storage options

🚢 Deployment

Backend Deployment

The backend can be deployed to any Node.js hosting platform:

1. Containerization:

   cd backend
   docker build -t whatsapp-bot-backend .
   docker run -p 3001:3001 whatsapp-bot-backend

2. Cloud Hosting (AWS, Google Cloud, Azure):

   • Deploy as a containerized service
   • Set up environment variables
   • Configure database connection
   • Ensure browser dependencies for WhatsApp Web.js are installed

Frontend Deployment

The frontend is optimized for deployment on Vercel:

1. Push your code to a GitHub repository
2. Import the project in Vercel
3. Configure your environment variables
4. Deploy

📄 License

MIT

🤝 Support

For support, email [email protected] or open an issue in the GitHub repository.