')
with gr.Row():
prospects_stat = gr.HTML(get_stat_html("0", "Prospects Found", "var(--primary-blue)"))
contacts_stat = gr.HTML(get_stat_html("0", "Decision Makers", "var(--success-green)"))
emails_stat = gr.HTML(get_stat_html("0", "Emails Drafted", "var(--warning-orange)"))
gr.HTML(get_stat_html("Qwen3-32B", "AI Model", "var(--purple)"))
refresh_btn = gr.Button("π Refresh Dashboard", variant="secondary")
# ===== DISCOVERY PAGE =====
with gr.Column(visible=True, elem_id="page-discovery", elem_classes="page-hidden") as discovery_page:
gr.HTML("""
π‘
How Discovery Works
- Step 1: AI searches the web for companies matching your profile
- Step 2: Finds decision-makers (CEOs, VPs, Founders) with verified emails
- Step 3: Drafts personalized outreach emails for each contact
Tip: Start with 2-3 prospects to test, then increase the number.
""")
client_status_2 = gr.HTML(get_client_status_html())
with gr.Row():
with gr.Column(scale=1):
gr.HTML("""
Find Prospects
AI will search for companies, find decision-makers with verified contacts, and draft personalized emails.
""")
num_prospects = gr.Slider(minimum=1, maximum=10, value=3, step=1, label="Number of prospects")
discover_btn = gr.Button("π Find Prospects & Contacts", variant="primary", size="lg")
with gr.Column(scale=2):
discovery_output = gr.HTML("
Click 'Find Prospects' after completing Setup.
")
# ===== PROSPECTS PAGE =====
with gr.Column(visible=True, elem_id="page-prospects", elem_classes="page-hidden") as prospects_page:
gr.HTML("""
π’
Your Prospect Companies
This list shows all companies found by the AI. Each prospect includes company details, industry, and a fit score (0-100) indicating how well they match your ideal customer profile. Higher scores = better fit!
""")
refresh_prospects_btn = gr.Button("π Refresh", variant="secondary", size="sm")
prospects_list = gr.HTML(get_prospects_html())
# ===== CONTACTS PAGE =====
with gr.Column(visible=True, elem_id="page-contacts", elem_classes="page-hidden") as contacts_page:
gr.HTML("""
π€
Decision Maker Contacts
AI finds key decision-makers (CEOs, VPs, Founders, Directors) at each prospect company. Contact info includes name, title, email, and company. Only verified contacts with real email addresses are shown.
""")
refresh_contacts_btn = gr.Button("π Refresh", variant="secondary", size="sm")
contacts_list = gr.HTML(get_contacts_html())
# ===== EMAILS PAGE =====
with gr.Column(visible=True, elem_id="page-emails", elem_classes="page-hidden") as emails_page:
gr.HTML("""
βοΈ
AI-Written Outreach Emails
Each email is personalized based on the prospect's company, industry, and any pain points discovered during research. Review and customize before sending. Emails are designed to start conversations, not close deals.
""")
refresh_emails_btn = gr.Button("π Refresh", variant="secondary", size="sm")
emails_list = gr.HTML(get_emails_html())
# ===== AI CHAT PAGE =====
with gr.Column(visible=True, elem_id="page-chat", elem_classes="page-hidden") as chat_page:
gr.HTML("""""")
with gr.Tabs(elem_classes="chat-subtabs"):
# ----- SUB-TAB 1: Internal Sales Assistant -----
with gr.Tab("π― Sales Assistant", elem_id="tab-sales-assistant"):
gr.HTML("""
π€
Your AI Sales Assistant
Chat with AI to research companies, draft emails, get talking points, or manage your pipeline. The AI has access to all your prospect data and can perform web searches for real-time info.
""")
chatbot = gr.Chatbot(value=[], height=350, label="Sales Assistant Chat")
with gr.Row():
chat_input = gr.Textbox(
label="Message",
placeholder="Ask about prospects, search for companies, draft emails...",
lines=1,
scale=4
)
send_btn = gr.Button("Send", variant="primary", scale=1)
gr.HTML("""
π‘ Try These Prompts
- "Search for DTC fashion brands that raised Series A"
- "Draft an email to the CEO of Warby Parker"
- "Give me talking points for my call with Glossier"
- "Summary of all prospects and their status"
""")
# ----- SUB-TAB 2: Prospect-Facing AI Chat -----
with gr.Tab("π€ Prospect Chat Demo", elem_id="tab-prospect-chat"):
gr.HTML("""
π¬
Prospect Communication Demo
This demonstrates how prospects can interact with your company's AI assistant. The AI can answer questions about your products/services, qualify leads, schedule meetings, and escalate to human agents when needed.
""")
prospect_chatbot = gr.Chatbot(
value=[],
height=350,
label="Prospect Chat",
avatar_images=(None, "https://api.dicebear.com/7.x/bottts/svg?seed=cx-agent")
)
with gr.Row():
prospect_input = gr.Textbox(
label="Prospect Message",
placeholder="Hi, I'm interested in learning more about your services...",
lines=1,
scale=4
)
prospect_send_btn = gr.Button("Send", variant="primary", scale=1)
with gr.Row():
with gr.Column(scale=2):
gr.HTML("""
π Demo Scenario
You are a prospect visiting the client's website. The AI will:
- Answer questions about products and services
- Qualify you as a lead based on your needs
- Offer to schedule a meeting with sales
- Escalate complex inquiries to human agents
""")
with gr.Column(scale=1):
gr.HTML("""
β‘ Quick Actions
""")
generate_handoff_btn = gr.Button("π Generate Handoff Packet", variant="secondary", size="sm")
escalate_btn = gr.Button("π¨ Escalate to Human", variant="stop", size="sm")
schedule_btn = gr.Button("π
Schedule Meeting", variant="secondary", size="sm")
handoff_output = gr.Markdown(visible=False, elem_classes="handoff-packet")
# ===== ABOUT US PAGE =====
with gr.Column(visible=True, elem_id="page-about", elem_classes="page-hidden") as about_page:
gr.HTML("""""")
gr.Markdown("""
# π€ CX AI Agent - B2B Sales Intelligence Platform
[](https://github.com)
[](https://huggingface.co)
[](https://gradio.app)
> **π MCP in Action Track - Enterprise Applications**
>
> Tag: `mcp-in-action-track-enterprise`
---
## π Overview
**CX AI Agent** is an AI-powered B2B sales automation platform that helps sales teams discover prospects, find decision-makers, and draft personalized outreach emailsβall powered by autonomous AI agents using the Model Context Protocol (MCP).
### π― Key Features
| Feature | Description |
|---------|-------------|
| **π AI Discovery** | Automatically find and research prospect companies matching your ideal customer profile |
| **π₯ Contact Finder** | Locate decision-makers (CEOs, VPs, Founders) with verified email addresses |
| **βοΈ Email Drafting** | Generate personalized cold outreach emails based on company research |
| **π¬ AI Chat** | Interactive assistant for pipeline management and real-time research |
| **π€ Prospect Chat** | Demo of prospect-facing AI with handoff & escalation capabilities |
| **π Dashboard** | Real-time pipeline metrics and progress tracking |
---
## ποΈ Architecture
```
βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
β CX AI Agent β
βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ€
β βββββββββββββββ βββββββββββββββ βββββββββββββββ β
β β Gradio β β Autonomousβ β MCP β β
β β UI ββββ Agent ββββ Servers β β
β βββββββββββββββ βββββββββββββββ βββββββββββββββ β
β β β β β
β βΌ βΌ βΌ β
β βββββββββββββββββββββββββββββββββββββββββββββββββββ β
β β MCP Tool Definitions β β
β β β’ Search (Web, News) β β
β β β’ Store (Prospects, Contacts, Facts) β β
β β β’ Email (Send, Thread Management) β β
β β β’ Calendar (Meeting Slots, Invites) β β
β βββββββββββββββββββββββββββββββββββββββββββββββββββ β
ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
```
---
## π Getting Started
### Prerequisites
- Python 3.8+
- HuggingFace API Token ([Get one free](https://huggingface.co/settings/tokens))
- Serper API Key (Optional, for web search)
### Quick Start
1. **Setup**: Enter your API credentials and company name
2. **Discover**: Let AI find prospects matching your profile
3. **Review**: Check discovered companies and contacts
4. **Engage**: Use AI-drafted emails for outreach
---
## π§ MCP Tools Available
### Search MCP Server
- `search_web` - Search the web for company information
- `search_news` - Find recent news about companies
### Store MCP Server
- `save_prospect` / `get_prospect` / `list_prospects` - Manage prospects
- `save_company` / `get_company` - Store company data
- `save_contact` / `list_contacts_by_domain` - Manage contacts
- `save_fact` - Store research insights
- `discover_prospects_with_contacts` - Full discovery pipeline
- `find_verified_contacts` - Find decision-makers
- `check_suppression` - Compliance checking
### Email MCP Server
- `send_email` - Send outreach emails
- `get_email_thread` - Retrieve conversation history
### Calendar MCP Server
- `suggest_meeting_slots` - Generate available times
- `generate_calendar_invite` - Create .ics files
---
## π Prospect Chat Demo
The **Prospect Chat Demo** tab showcases how prospects can interact with your company's AI:
- **Lead Qualification**: AI asks qualifying questions to understand prospect needs
- **Handoff Packets**: Generate comprehensive summaries for human sales reps
- **Escalation Flows**: Automatically escalate complex inquiries to humans
- **Meeting Scheduling**: Integrate with calendar for instant booking
---
## π Technology Stack
| Component | Technology |
|-----------|------------|
| **Frontend** | Gradio 5.x |
| **AI Model** | Qwen3-32B via HuggingFace |
| **Protocol** | Model Context Protocol (MCP) |
| **Search** | Serper API |
| **Language** | Python 3.8+ |
---
## π License
This project is open source and available under the MIT License.
---
## π Acknowledgments
- **Anthropic** - Model Context Protocol specification
- **HuggingFace** - AI model hosting and inference
- **Gradio** - UI framework
- **Serper** - Web search API
---
## π¨βπ» Developer
**Syed Muzakkir Hussain**
[](https://huggingface.co/muzakkirhussain011)
[https://huggingface.co/muzakkirhussain011](https://huggingface.co/muzakkirhussain011)
---
**Built with β€οΈ by [Syed Muzakkir Hussain](https://huggingface.co/muzakkirhussain011) for the Gradio Agents & MCP Hackathon 2025**
`mcp-in-action-track-enterprise`
""")
# Footer
gr.HTML("""
""")
# ===== NAVIGATION HANDLERS =====
all_pages = [setup_page, dashboard_page, discovery_page, prospects_page, contacts_page, emails_page, chat_page, about_page]
def show_page(page_name):
"""Return visibility updates for all pages"""
pages = {
"setup": [True, False, False, False, False, False, False, False],
"dashboard": [False, True, False, False, False, False, False, False],
"discovery": [False, False, True, False, False, False, False, False],
"prospects": [False, False, False, True, False, False, False, False],
"contacts": [False, False, False, False, True, False, False, False],
"emails": [False, False, False, False, False, True, False, False],
"chat": [False, False, False, False, False, False, True, False],
"about": [False, False, False, False, False, False, False, True],
}
visibility = pages.get(page_name, pages["setup"])
return [gr.update(visible=v) for v in visibility]
# When page_selector textbox changes, update page visibility
page_selector.change(fn=show_page, inputs=[page_selector], outputs=all_pages)
# Connect navigation buttons to pages
btn_setup.click(fn=lambda: show_page("setup"), outputs=all_pages)
btn_dashboard.click(fn=lambda: show_page("dashboard"), outputs=all_pages)
btn_discovery.click(fn=lambda: show_page("discovery"), outputs=all_pages)
btn_prospects.click(fn=lambda: show_page("prospects"), outputs=all_pages)
btn_contacts.click(fn=lambda: show_page("contacts"), outputs=all_pages)
btn_emails.click(fn=lambda: show_page("emails"), outputs=all_pages)
btn_chat.click(fn=lambda: show_page("chat"), outputs=all_pages)
btn_about.click(fn=lambda: show_page("about"), outputs=all_pages)
# Navigation JavaScript is now in head_html for earlier loading
# ===== EVENT HANDLERS =====
# Setup button - run setup and then update status indicators
setup_btn.click(
fn=setup_client_company,
inputs=[client_name_input, hf_token_input, serper_key_input],
outputs=[setup_output]
).then(
fn=lambda: (get_client_status_html(), get_client_status_html()),
outputs=[client_status, client_status_2]
)
reset_btn.click(
fn=reset_all_data,
outputs=[prospects_stat, contacts_stat, emails_stat, client_status, prospects_list, emails_list,
contacts_list, client_name_input, setup_output, discovery_output]
)
def refresh_dashboard():
stats = get_dashboard_stats()
return stats[0], stats[1], stats[2], stats[3]
refresh_btn.click(fn=refresh_dashboard, outputs=[prospects_stat, contacts_stat, emails_stat, client_status])
# Discover prospects and then update all lists
discover_btn.click(
fn=discover_prospects,
inputs=[num_prospects],
outputs=[discovery_output]
).then(
fn=lambda: (get_prospects_html(), get_contacts_html(), get_emails_html()),
outputs=[prospects_list, contacts_list, emails_list]
).then(
fn=refresh_dashboard,
outputs=[prospects_stat, contacts_stat, emails_stat, client_status]
)
refresh_prospects_btn.click(fn=get_prospects_html, outputs=[prospects_list])
refresh_contacts_btn.click(fn=get_contacts_html, outputs=[contacts_list])
refresh_emails_btn.click(fn=get_emails_html, outputs=[emails_list])
# Async chat wrapper that uses session token
async def chat_async_wrapper(message, history):
token = session_hf_token.get("token", "")
final_result = (history, "")
async for result in chat_with_ai_async(message, history, token):
final_result = result
return final_result
send_btn.click(fn=chat_async_wrapper, inputs=[chat_input, chatbot], outputs=[chatbot, chat_input])
chat_input.submit(fn=chat_async_wrapper, inputs=[chat_input, chatbot], outputs=[chatbot, chat_input])
# ===== PROSPECT CHAT HANDLERS =====
async def prospect_chat_wrapper(message, history):
"""Handle prospect-facing chat with company representative AI"""
if not message.strip():
return history, ""
# Get client company info for context
client_info = knowledge_base["client"].get("name") or "Our Company"
# Build prospect-facing system context
system_context = f"""You are an AI assistant representing {client_info}. You are speaking with a potential prospect who is interested in learning about the company's products and services.
Your role is to:
1. Answer questions about the company professionally and helpfully
2. Qualify the prospect by understanding their needs, company size, and timeline
3. Offer to schedule meetings with sales representatives when appropriate
4. Escalate complex technical or pricing questions to human agents
Be friendly, professional, and helpful. Focus on understanding the prospect's needs."""
history = history + [[message, None]]
# Use the AI to generate response
token = session_hf_token.get("token", "")
if token:
try:
from huggingface_hub import InferenceClient
client = InferenceClient(token=token)
messages = [{"role": "system", "content": system_context}]
for h in history[:-1]:
if h[0]:
messages.append({"role": "user", "content": h[0]})
if h[1]:
messages.append({"role": "assistant", "content": h[1]})
messages.append({"role": "user", "content": message})
response = client.chat_completion(
model="Qwen/Qwen2.5-72B-Instruct",
messages=messages,
max_tokens=500
)
reply = response.choices[0].message.content
except Exception as e:
reply = f"I apologize, I'm having trouble connecting right now. Please try again or contact us directly. (Error: {str(e)[:50]})"
else:
reply = f"Thank you for your interest in {client_info}! I'd be happy to help you learn more about our solutions. What specific challenges are you looking to address?"
history[-1][1] = reply
return history, ""
def generate_handoff_packet(chat_history):
"""Generate a handoff packet from the prospect conversation"""
if not chat_history:
return gr.update(visible=True, value="**β οΈ No conversation to generate handoff from.** Start a conversation first.")
# Extract key info from conversation
conversation_text = "\n".join([f"Prospect: {h[0]}\nAgent: {h[1]}" for h in chat_history if h[0] and h[1]])
client_name = knowledge_base["client"].get("name") or "Unknown Client"
packet = f"""
## π Handoff Packet
**Generated:** {datetime.now().strftime("%Y-%m-%d %H:%M")}
**Client Company:** {client_name}
---
### π Conversation Summary
{len(chat_history)} messages exchanged with prospect.
### π¬ Full Conversation Log
```
{conversation_text[:1500]}{'...' if len(conversation_text) > 1500 else ''}
```
### π― Recommended Actions
1. Review conversation for prospect pain points
2. Prepare personalized follow-up materials
3. Schedule discovery call within 24-48 hours
### π Lead Score: Pending Assessment
---
*This packet was auto-generated by CX AI Agent*
"""
return gr.update(visible=True, value=packet)
def escalate_to_human(chat_history):
"""Escalate conversation to human agent"""
if not chat_history:
return gr.update(visible=True, value="**π¨ Escalation Created**\n\nNo conversation history to escalate. A human agent will reach out to assist you.")
return gr.update(visible=True, value=f"""
## π¨ Escalation Created
**Status:** Pending Human Review
**Priority:** High
**Timestamp:** {datetime.now().strftime("%Y-%m-%d %H:%M")}
A human sales representative will review this conversation and reach out shortly.
**Messages in thread:** {len(chat_history)}
""")
def schedule_meeting():
"""Generate meeting scheduling info"""
from datetime import timedelta
now = datetime.now()
slots = []
for i in range(1, 4):
day = now + timedelta(days=i)
if day.weekday() < 5: # Weekdays only
slots.append(f"- {day.strftime('%A, %B %d')} at 10:00 AM EST")
slots.append(f"- {day.strftime('%A, %B %d')} at 2:00 PM EST")
return gr.update(visible=True, value=f"""
## π
Meeting Scheduling
**Available Time Slots:**
{chr(10).join(slots[:4])}
To schedule a meeting, please reply with your preferred time slot, or [click here](#) to access our calendar booking system.
*Times shown in EST. Meetings are typically 30 minutes.*
""")
# Connect prospect chat handlers
prospect_send_btn.click(
fn=prospect_chat_wrapper,
inputs=[prospect_input, prospect_chatbot],
outputs=[prospect_chatbot, prospect_input]
)
prospect_input.submit(
fn=prospect_chat_wrapper,
inputs=[prospect_input, prospect_chatbot],
outputs=[prospect_chatbot, prospect_input]
)
# Connect action buttons
generate_handoff_btn.click(fn=generate_handoff_packet, inputs=[prospect_chatbot], outputs=[handoff_output])
escalate_btn.click(fn=escalate_to_human, inputs=[prospect_chatbot], outputs=[handoff_output])
schedule_btn.click(fn=schedule_meeting, outputs=[handoff_output])
return demo
if __name__ == "__main__":
demo = create_app()
demo.launch(server_name="0.0.0.0", server_port=7860, show_error=True)
' if logo_b64 else ''
# Custom head HTML
favicon_html = f'' if favicon_b64 else ''
head_html = f"""
{favicon_html}
"""
with gr.Blocks(
title="CX AI Agent - B2B Sales Intelligence",
theme=gr.themes.Soft(primary_hue="blue", secondary_hue="slate", neutral_hue="slate"),
css=ENTERPRISE_CSS,
head=head_html
) as demo:
# ===== SIDEBAR (HTML) =====
gr.HTML(f"""