Now add the sync UI and JS in index.php and app.js. Let me add the sync panel in index.php, inside the contacts tab before the contacts list:


199→                To: <input type="date" id="contact-date-to" style="padding:6px;border-radius:4px;border:1px solid #d1d5db;">
   200→                <button class="btn btn-sm" onclick="loadContacts(1)">Apply</button>
   201→                <button class="btn btn-sm" style="background:#e5e7eb;color:#374151;" onclick="clearContactFilters()">Clear</button>
   202→                <button class="btn btn-sm" style="background:#fef2f2;color:#ef4444;border:1px solid #ef4444;margin-left:auto;" onclick="promptBulkDeleteByEmail()">Bulk Delete by Email/Domain</button>
   203→

   204→

   205→
Loading contacts...

   206→

   207→

   208→

To: <input type="date" id="contact-date-to" style="padding:6px;border-radius:4px;border:1px solid #d1d5db;">
                <button class="btn btn-sm" onclick="loadContacts(1)">Apply</button>
                <button class="btn btn-sm" style="background:#e5e7eb;color:#374151;" onclick="clearContactFilters()">Clear</button>
                <button class="btn btn-sm" style="background:#fef2f2;color:#ef4444;border:1px solid #ef4444;margin-left:auto;" onclick="promptBulkDeleteByEmail()">Bulk Delete by Email/Domain</button>

Loading contacts...


Edit

                    Import from Gmail:
                    <input type="text" id="sync-domain-input" placeholder="e.g. delta-engineering.be or ddb@delta-engineering.be" style="flex:1;padding:8px;border-radius:4px;border:1px solid #93c5fd;">
                    <button class="btn btn-primary" onclick="searchByDomain()">Search Gmail</button>

Loading contacts...


The file /var/www/mssql.danmarcrm.com/dev1/extension2v1/public/index.php has been updated successfully.

                    Import from Gmail:
                    <input type="text" id="sync-domain-input" placeholder="e.g. delta-engineering.be or ddb@delta-engineering.be" style="flex:1;padding:8px;border-radius:4px;border:1px solid #93c5fd;">
                    <button class="btn btn-primary" onclick="searchByDomain()">Search Gmail</button>

Loading contacts...

<?php
/**
 * Email Intelligence Dashboard
 *
 * Main web interface for viewing contacts, emails, and analysis results.
 *
 * CALLING MAP:
 * - Entry point: Web browser
 * - Uses: api.php for data (via AJAX)
 * - Uses: oauth_callback.php for Gmail connection
 *
 * @package EmailIntelligence
 */

// Load configuration
require_once dirname(__DIR__) . '/config/config.php';
require_once dirname(__DIR__) . '/vendor/autoload.php';

use EmailIntelligence\Database;
use EmailIntelligence\GmailClient;

// Start session for flash messages
session_start();

// If contact parameter is present, redirect to contact view
if (isset($_GET['contact']) && is_numeric($_GET['contact'])) {
    header('Location: contact_view.php?contact=' . (int)$_GET['contact']);
    exit;
}

// Get flash message if any
$flashMessage = $_SESSION['flash_message'] ?? null;
unset($_SESSION['flash_message']);

// Get initial status
try {
    $db = Database::getInstance();
    $syncStatus = $db->fetchOne("SELECT * FROM sync_status WHERE id = 1");
    $stats = [
        'emails' => $db->fetchColumn("SELECT COUNT(*) FROM emails"),
        'contacts' => $db->fetchColumn("SELECT COUNT(*) FROM contacts"),
        'analyzed' => $db->fetchColumn("SELECT COUNT(*) FROM emails WHERE is_analyzed = 1"),
        'pending' => $db->fetchColumn("SELECT COUNT(*) FROM emails WHERE is_analyzed = 0"),
    ];

    $gmail = new GmailClient();
    $gmailStatus = $gmail->getAuthStatus();
    $authUrl = $gmail->hasCredentials() ? $gmail->getAuthUrl() : null;

} catch (Exception $e) {
    $error = $e->getMessage();
    $stats = ['emails' => 0, 'contacts' => 0, 'analyzed' => 0, 'pending' => 0];
    $gmailStatus = ['isAuthenticated' => false];
    $syncStatus = null;
    $authUrl = null;
}
?>
<!DOCTYPE html>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Email Intelligence Dashboard</title>
    <link rel="stylesheet" href="assets/style.css">

Email Intelligence

AI-Powered Email Analysis for <?= htmlspecialchars(GMAIL_USER_EMAIL) ?>

        <?php if (isset($error)): ?>

            Error: <?= htmlspecialchars($error) ?>

        <?php endif; ?>

        <?php if ($flashMessage): ?>
        <div class="alert alert-<?= $flashMessage['type'] ?>">
            <?= htmlspecialchars($flashMessage['text']) ?>

        <?php endif; ?>

            <div class="status-card <?= $gmailStatus['isAuthenticated'] ? 'status-ok' : 'status-warning' ?>">

Gmail

                <?php if ($gmailStatus['isAuthenticated']): ?>

Connected

<?= htmlspecialchars($gmailStatus['userEmail']) ?>

                <?php elseif (!$gmailStatus['hasCredentials']): ?>

Not Configured

OAuth credentials missing

                <?php else: ?>

Not Connected

                    <?php if ($authUrl): ?>
                    <a href="<?= htmlspecialchars($authUrl) ?>" class="btn btn-primary">Connect Gmail
                    <?php endif; ?>
                <?php endif; ?>

Sync Status

<?= htmlspecialchars($syncStatus['status'] ?? 'unknown') ?>

                    Last: <?= $syncStatus['last_sync_at'] ? date('M j, H:i', strtotime($syncStatus['last_sync_at'])) : 'Never' ?>

                <?php if ($gmailStatus['isAuthenticated']): ?>
                <button class="btn btn-small" onclick="triggerSync()">Sync Now</button>
                <?php endif; ?>

Emails

<?= number_format($stats['emails']) ?>

                    <?= number_format($stats['analyzed']) ?> analyzed,
                    <?= number_format($stats['pending']) ?> pending

Contacts

<?= number_format($stats['contacts']) ?>

Clients & Suppliers

AI Thread Analysis

                    Threads
                    -

                    Analyzed
                    -

                    Pending
                    -

                    Progress
                    -

                <button class="btn btn-primary" onclick="triggerAnalysis()" id="btn-analyze">Analyze Threads</button>
                <button class="btn btn-small" onclick="refreshAnalysisStatus()">Refresh Status</button>

            <button class="tab-btn active" data-tab="contacts">Contacts</button>
            <button class="tab-btn" data-tab="emails">Threads</button>

            <button class="tab-btn" data-tab="gmail-accounts">📧 Gmail Accounts</button>
            <button class="tab-btn" data-tab="enrichment">🔬 Enrichment</button>
            <button class="tab-btn" data-tab="patterns">📊 Patterns</button>
            <button class="tab-btn" data-tab="business">💼 Business</button>
            <button class="tab-btn" data-tab="alerts">⚠ Alerts</button>
            <button class="tab-btn" data-tab="search">🔍 AI Search</button>
            <button class="tab-btn" data-tab="quotes">Quotes</button>
            <button class="tab-btn" data-tab="filters">Filters</button>
            <button class="tab-btn" data-tab="business-ideas">💡 Business Ideas</button>

                <input type="text" id="contact-search" placeholder="Search contacts..." class="search-input">
                <select id="contact-type-filter">
                    <option value="">All Types</option>
                    <option value="client">Clients</option>
                    <option value="supplier">Suppliers</option>
                    <option value="other">Other</option>
                </select>
                <select id="contact-sort" style="padding:8px;border-radius:4px;border:1px solid #d1d5db;">
                    <option value="name:ASC">Name (A-Z)</option>
                    <option value="name:DESC">Name (Z-A)</option>
                    <option value="last_contact:DESC" selected>Last Activity (Newest)</option>
                    <option value="last_contact:ASC">Last Activity (Oldest)</option>
                </select>
                <button class="btn btn-small" onclick="loadContacts()">Refresh</button>

                From: <input type="date" id="contact-date-from" style="padding:6px;border-radius:4px;border:1px solid #d1d5db;">
                To: <input type="date" id="contact-date-to" style="padding:6px;border-radius:4px;border:1px solid #d1d5db;">
                <button class="btn btn-sm" onclick="loadContacts(1)">Apply</button>
                <button class="btn btn-sm" style="background:#e5e7eb;color:#374151;" onclick="clearContactFilters()">Clear</button>
                <button class="btn btn-sm" style="background:#fef2f2;color:#ef4444;border:1px solid #ef4444;margin-left:auto;" onclick="promptBulkDeleteByEmail()">Bulk Delete by Email/Domain</button>

Loading contacts...

                <input type="text" id="email-search" placeholder="Search threads..." class="search-input">
                <select id="thread-sort" style="padding:8px;border-radius:4px;border:1px solid #d1d5db;">
                    <option value="last_date:DESC" selected>Last Activity (Newest)</option>
                    <option value="last_date:ASC">Last Activity (Oldest)</option>
                    <option value="email_count:DESC">Most Emails</option>
                    <option value="first_date:DESC">Newest Thread</option>
                </select>
                <button class="btn btn-small" onclick="loadEmails()">Refresh</button>

                <input type="text" id="thread-contact-filter" placeholder="Contact name..." style="padding:8px;border-radius:4px;border:1px solid #d1d5db;width:150px;">
                From: <input type="date" id="thread-date-from" style="padding:6px;border-radius:4px;border:1px solid #d1d5db;">
                To: <input type="date" id="thread-date-to" style="padding:6px;border-radius:4px;border:1px solid #d1d5db;">
                <select id="thread-status-filter" style="padding:8px;border-radius:4px;border:1px solid #d1d5db;">
                    <option value="">All Status</option>
                    <option value="analyzed">Analyzed</option>
                    <option value="not_analyzed">Not Analyzed</option>
                </select>
                <button class="btn btn-sm" onclick="loadEmails(1)">Apply</button>
                <button class="btn btn-sm" style="background:#e5e7eb;color:#374151;" onclick="clearThreadFilters()">Clear</button>

Click Refresh to load email threads

🛒 Product Search with AI

Search products from Amazon & AliExpress with advanced filters and AI recommendations

                        Search Query
                        <input type="text" id="quick-product-search" placeholder="e.g., LED strip lights COB waterproof" class="search-input" style="width: 100%;">

                        IP Rating
                        <select id="quick-filter-ip" class="search-input" style="width: 100%;">
                            <option value="">Any</option>
                            <option value="ip65">IP65</option>
                            <option value="ip67">IP67</option>
                            <option value="ip68">IP68</option>
                            <option value="ip6+">IP6+</option>
                        </select>

                        Length
                        <select id="quick-filter-length" class="search-input" style="width: 100%;">
                            <option value="">Any</option>
                            <option value="5m">5m</option>
                            <option value="10m">10m</option>
                            <option value="5m+">5m+</option>
                            <option value="10m+">10m+</option>
                        </select>

                        <button class="btn btn-primary" onclick="window.location.href='product_search.php'" style="background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); border: none;">
                            Open Full Search
                        </button>

🎯 Smart Filters

                        Filter by IP rating (IP65, IP 65, ip6, etc.), length (5m, 5 m, 10 meters), and more.
                        Handles all format variations automatically.

🤖 AI Recommendations

                        Send your product list to AI and get best picks categorized as Best Value, Top Rated, and Recommended.

➕ Custom Filters

                        Add custom filters for COB type, wattage, voltage, or any text search. Extensible filter system.

                    🔍 Open Product Search Dashboard

📧 Gmail Account Management

Manage multiple Gmail accounts for email synchronization

Add New Gmail Account

                        Email Address
                        <input type="email" id="new-account-email" placeholder="account@gmail.com"
                               class="search-input" style="width: 100%;">

                        Display Name (Optional)
                        <input type="text" id="new-account-name" placeholder="Account Name"
                               class="search-input" style="width: 100%;">

                        <button class="btn btn-primary" onclick="addGmailAccount()" style="width: 100%;">Add Account</button>

Total Accounts

-

Active

-

Authenticated

-

Total Emails

-

                <button class="btn btn-primary" onclick="syncAllAccounts()">🔄 Sync All Accounts</button>
                <button class="btn btn-small" onclick="loadGmailAccounts()">Refresh</button>

Loading Gmail accounts...

🔬 Data Enrichment

Enrich contacts and companies with data from Apollo.io and web scraping

0

Pending

0

Processing

0

Completed

0

Failed

🔍 Enrich Single Contact

                    <input type="text" id="enrich-single-email" placeholder="Enter email address..." style="width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; margin-bottom: 10px; box-sizing: border-box;">
                    <button class="btn btn-primary" onclick="enrichSingleContact()" style="width: 100%; background: #10b981; border: none; padding: 10px; border-radius: 6px; color: white; cursor: pointer;">
                        Enrich Contact
                    </button>

🏢 Enrich Single Company

                    <input type="text" id="enrich-single-domain" placeholder="Enter company domain..." style="width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; margin-bottom: 10px; box-sizing: border-box;">
                    <button class="btn btn-primary" onclick="enrichSingleCompany()" style="width: 100%; background: #3b82f6; border: none; padding: 10px; border-radius: 6px; color: white; cursor: pointer;">
                        Enrich Company
                    </button>

📦 Batch Enrichment

                    <button class="btn" onclick="enrichAllContacts()" style="background: #10b981; color: white; border: none; padding: 12px; border-radius: 6px; cursor: pointer;">
                        👥 Enrich All Contacts
                    </button>
                    <button class="btn" onclick="enrichAllCompanies()" style="background: #3b82f6; color: white; border: none; padding: 12px; border-radius: 6px; cursor: pointer;">
                        🏢 Enrich All Companies
                    </button>
                    <button class="btn" onclick="processEnrichmentQueue()" style="background: #8b5cf6; color: white; border: none; padding: 12px; border-radius: 6px; cursor: pointer;">
                        ⚡ Process Queue
                    </button>
                    <button class="btn" onclick="loadEnrichmentStatus()" style="background: #6b7280; color: white; border: none; padding: 12px; border-radius: 6px; cursor: pointer;">
                        🔄 Refresh Status
                    </button>

📋 Recent Enrichment Activity

Click Refresh Status to load logs...

📊 Behavioral Pattern Detection

AI-powered detection of risky patterns across all email communications

Loading pattern statistics...

💼 Business Opportunities

AI-identified business opportunities, cross-sell suggestions, and deal insights from email analysis

Total Opportunities

-

Active Quotes

-

Cross-sell Ideas

-

Avg Deal Value

-

Loading business opportunities...

⚠ Risk Alerts

Automated alerts for high-risk behavioral patterns detected in communications

                <select id="alert-severity-filter" style="padding: 10px; border-radius: 6px; border: 1px solid #e0e0e0;">
                    <option value="">All Severities</option>
                    <option value="critical">Critical</option>
                    <option value="high">High</option>
                    <option value="medium">Medium</option>
                    <option value="low">Low</option>
                </select>
                <select id="alert-status-filter" style="padding: 10px; border-radius: 6px; border: 1px solid #e0e0e0;">
                    <option value="unread">Unread</option>
                    <option value="all">All</option>
                    <option value="read">Read</option>
                </select>
                <button class="btn btn-small" onclick="loadAlerts()">Refresh</button>

Loading alerts...

🔍 Semantic Search

Search across all emails using natural language. Find patterns, behaviors, and similar situations.

                    <input type="text" id="semantic-search-input" placeholder="e.g., 'payment delays', 'lies about deadlines', 'scope creep'..."
                           style="flex: 1; min-width: 300px; padding: 12px; border-radius: 6px; border: none; font-size: 1em;">
                    <select id="search-type" style="padding: 12px; border-radius: 6px; border: none;">
                        <option value="">All Types</option>
                        <option value="email">Emails</option>
                        <option value="thread_summary">Thread Summaries</option>
                        <option value="pattern">Detected Patterns</option>
                    </select>
                    <button class="btn" onclick="semanticSearch()" style="background: white; color: #667eea; padding: 12px 24px;">Search</button>

                Example searches:

                    <button class="btn btn-small" onclick="quickSearch('payment delay excuses')">Payment delays</button>
                    <button class="btn btn-small" onclick="quickSearch('changed story inconsistency')">Story changes</button>
                    <button class="btn btn-small" onclick="quickSearch('price negotiation aggressive')">Price negotiation</button>
                    <button class="btn btn-small" onclick="quickSearch('blame shifting responsibility')">Blame shifting</button>
                    <button class="btn btn-small" onclick="quickSearch('scope creep additional work')">Scope creep</button>
                    <button class="btn btn-small" onclick="quickSearch('competitor mention shopping around')">Competitor mentions</button>

                Index Management:

                    <button class="btn btn-small" onclick="indexVectors('all')">Index All Emails</button>
                    <button class="btn btn-small" onclick="checkVectorStatus()">Check Status</button>

Enter a search query above to find relevant emails and patterns.

                <select id="quote-outcome-filter">
                    <option value="">All Outcomes</option>
                    <option value="pending">Pending</option>
                    <option value="accepted">Accepted</option>
                    <option value="rejected">Rejected</option>
                    <option value="negotiated">Negotiated</option>
                </select>
                <button class="btn btn-small" onclick="loadQuotes()">Refresh</button>

Loading quotes...

                <input type="text" id="new-filter" placeholder="Email or @domain.com" class="search-input">
                <input type="text" id="filter-description" placeholder="Description (optional)" class="search-input">
                <button class="btn btn-primary" onclick="addFilter()">Add Filter</button>

                Add email addresses or domains (starting with @) to filter which emails are synced.
                Only emails to/from these addresses will be downloaded.

Loading filters...

💡 Business Ideas Research

AI-powered research into business verticals, horizontals, and growth scenarios using web scraping and analysis

📊 Your Business Context

                    Click to set/update your financial goals (helps AI provide better recommendations)

                            Revenue Target
                            <input type="text" id="owner-revenue-target" placeholder="e.g., $500K/year, 2x current revenue" style="width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; box-sizing: border-box;">

                            Investment Capacity
                            <input type="text" id="owner-investment-capacity" placeholder="e.g., $50K available for new ventures" style="width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; box-sizing: border-box;">

                            Growth Objectives
                            <input type="text" id="owner-growth-objectives" placeholder="e.g., Expand to new markets, diversify products" style="width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; box-sizing: border-box;">

                            Timeline
                            <input type="text" id="owner-timeline" placeholder="e.g., 12-18 months" style="width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; box-sizing: border-box;">

                            Additional Notes
                            <textarea id="owner-notes" placeholder="Any other relevant information about your business situation..." style="width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; min-height: 60px; box-sizing: border-box;"></textarea>

                            <button class="btn btn-primary" onclick="saveOwnerStatus()" style="background: #8b5cf6;">Save Business Context</button>

Start New Research Project

                    Research Query
                    <textarea id="business-ideas-query"
                        placeholder="e.g., Research 50 business verticals related to LED lighting and smart home technology. For each vertical, identify 20-30 horizontal market segments. Focus on B2B opportunities, emerging markets, and areas with high growth potential."
                        style="width: 100%; min-height: 100px; padding: 12px; border: 1px solid #d1d5db; border-radius: 6px; resize: vertical; box-sizing: border-box;"></textarea>

                    Advanced Options

                                Target Verticals
                                <input type="number" id="param-verticals" value="50" min="1" max="100" style="width: 100%; padding: 8px; border: 1px solid #d1d5db; border-radius: 4px; box-sizing: border-box;">

                                Horizontals per Vertical
                                <input type="number" id="param-horizontals" value="25" min="1" max="50" style="width: 100%; padding: 8px; border: 1px solid #d1d5db; border-radius: 4px; box-sizing: border-box;">

                                Research Depth
                                <select id="param-depth" style="width: 100%; padding: 8px; border: 1px solid #d1d5db; border-radius: 4px; box-sizing: border-box;">
                                    <option value="shallow">Shallow (Fast)</option>
                                    <option value="medium" selected>Medium</option>
                                    <option value="deep">Deep (Thorough)</option>
                                </select>

                                Scenario Depth
                                <select id="param-scenario-depth" style="width: 100%; padding: 8px; border: 1px solid #d1d5db; border-radius: 4px; box-sizing: border-box;">
                                    <option value="high_level" selected>High-Level Strategic</option>
                                    <option value="detailed">Detailed Action Plans</option>
                                    <option value="financial">Financial Projections</option>
                                </select>

                <button class="btn btn-primary" onclick="createBusinessIdeasProject()" style="background: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%); padding: 12px 24px;">
                    🚀 Start Research Project
                </button>

0

Pending

0

Running

0

Completed

0

Failed

0

Findings

                <button class="btn btn-primary" onclick="processBusinessIdeasQueue()" style="background: #8b5cf6;">
                    ⚡ Process Queue
                </button>
                <button class="btn btn-small" onclick="loadBusinessIdeasProjects()">🔄 Refresh</button>

Loading research projects...

                ×

                ×

                ×

                    AI

AI Assistant

General Chat

                    <button onclick="startNewSession()" title="New chat" style="background:rgba(255,255,255,0.15); border:none; color:#fff; border-radius:6px; padding:4px 8px; cursor:pointer; font-size:0.7em;">+ New</button>
                    <button onclick="loadChatSessions()" title="Chat history" style="background:rgba(255,255,255,0.15); border:none; color:#fff; border-radius:6px; padding:4px 8px; cursor:pointer; font-size:0.7em;">History</button>
                    <button onclick="clearAiChat()" title="Clear chat" style="background:rgba(255,255,255,0.15); border:none; color:#fff; border-radius:6px; padding:4px 8px; cursor:pointer; font-size:0.7em;">Clear</button>
                    <button onclick="toggleAiChat()" style="background:rgba(255,255,255,0.15); border:none; color:#fff; border-radius:6px; padding:4px 8px; cursor:pointer; font-size:1em;">X</button>

                    <select id="ai-chat-provider" onchange="updateAiModelDropdown()" style="width:100px; background:#1e1e2e; color:#e2e8f0; border:1px solid #3d3d5c; border-radius:6px; padding:3px 6px; font-size:0.72em; cursor:pointer;">

                    </select>
                    <select id="ai-chat-model" style="flex:1; background:#1e1e2e; color:#e2e8f0; border:1px solid #3d3d5c; border-radius:6px; padding:3px 6px; font-size:0.72em; cursor:pointer;">

                    </select>

                    <button class="ai-agent-btn" data-agent="general" onclick="selectAgent('general')" style="background:#6366f1; color:#fff; border:none; border-radius:5px; padding:3px 8px; font-size:0.68em; cursor:pointer;">General</button>
                    <button class="ai-agent-btn" data-agent="quote_analyst" onclick="selectAgent('quote_analyst')" style="background:#2d2d4e; color:#94a3b8; border:none; border-radius:5px; padding:3px 8px; font-size:0.68em; cursor:pointer;">Quotes</button>
                    <button class="ai-agent-btn" data-agent="deception_detector" onclick="selectAgent('deception_detector')" style="background:#2d2d4e; color:#94a3b8; border:none; border-radius:5px; padding:3px 8px; font-size:0.68em; cursor:pointer;">Deception</button>
                    <button class="ai-agent-btn" data-agent="contact_profiler" onclick="selectAgent('contact_profiler')" style="background:#2d2d4e; color:#94a3b8; border:none; border-radius:5px; padding:3px 8px; font-size:0.68em; cursor:pointer;">Profiler</button>
                    <button class="ai-agent-btn" data-agent="email_composer" onclick="selectAgent('email_composer')" style="background:#2d2d4e; color:#94a3b8; border:none; border-radius:5px; padding:3px 8px; font-size:0.68em; cursor:pointer;">Composer</button>

                    Search contacts/threads to add context...
                    +

                        <input id="ai-context-search-input" type="text" placeholder="Search contacts or threads by name, email, subject..."
                               style="flex:1; background:#252540; color:#e2e8f0; border:1px solid #3d3d5c; border-radius:6px; padding:5px 8px; font-size:0.72em; outline:none;"
                               onkeydown="if(event.key==='Enter')searchContextContacts()">
                        <button onclick="searchContextContacts()" style="background:#6366f1; color:#fff; border:none; border-radius:6px; padding:4px 10px; font-size:0.7em; cursor:pointer;">Search</button>

AI

Search a contact, add threads, select an agent, and ask away.

Or open a thread/contact first for quick context.

                    <textarea id="ai-chat-input" placeholder="Ask anything... (Enter to send, Shift+Enter for newline)" style="flex:1; background:#1e1e2e; color:#e2e8f0; border:1px solid #3d3d5c; border-radius:8px; padding:8px 10px; font-size:0.82em; resize:none; height:50px; font-family:inherit; outline:none;" onkeydown="handleAiChatKey(event)"></textarea>
                    <button onclick="sendAiChat()" id="ai-chat-send-btn" style="background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; border:none; border-radius:8px; padding:8px 14px; cursor:pointer; font-size:1.1em; height:50px; min-width:44px; transition:opacity 0.2s;">Send</button>

        <button id="ai-chat-fab" onclick="toggleAiChat()" title="AI Assistant" style="position:fixed; bottom:20px; right:20px; width:56px; height:56px; background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; border:none; border-radius:50%; font-size:1.5em; cursor:pointer; box-shadow:0 4px 20px rgba(99,102,241,0.5); z-index:9998; transition:transform 0.2s; display:flex; align-items:center; justify-content:center;" onmouseover="this.style.transform='scale(1.1)'" onmouseout="this.style.transform='scale(1)'">AI</button>

Processing...

+            <!-- Import by Domain/Email -->

+            <div style="margin-bottom:15px;padding:15px;background:linear-gradient(135deg,#eff6ff,#dbeafe);border-radius:8px;border:1px solid #bfdbfe;">

+                <div style="display:flex;gap:10px;align-items:center;">

+                    <input type="text" id="sync-domain-input" placeholder="e.g. delta-engineering.be or ddb@delta-engineering.be" style="flex:1;padding:8px;border-radius:4px;border:1px solid #93c5fd;">

+                    <button class="btn btn-primary" onclick="searchByDomain()">Search Gmail</button>


Now add the `searchByDomain` and `importAllDomainThreads` functions to app.js:


  4096→    var contactSort = document.getElementById('contact-sort');
  4097→    if (contactSort) contactSort.addEventListener('change', function() { loadContacts(1); });
  4098→    var threadSort = document.getElementById('thread-sort');
  4099→    if (threadSort) threadSort.addEventListener('change', function() { loadEmails(1); });
  4100→});

    var contactSort = document.getElementById('contact-sort');
    if (contactSort) contactSort.addEventListener('change', function() { loadContacts(1); });
    var threadSort = document.getElementById('thread-sort');
    if (threadSort) threadSort.addEventListener('change', function() { loadEmails(1); });
});


    var contactSort = document.getElementById('contact-sort');
    if (contactSort) contactSort.addEventListener('change', function() { loadContacts(1); });
    var threadSort = document.getElementById('thread-sort');
    if (threadSort) threadSort.addEventListener('change', function() { loadEmails(1); });
});

var contactSort = document.getElementById('contact-sort');
    if (contactSort) contactSort.addEventListener('change', function() { loadContacts(1); });
    var threadSort = document.getElementById('thread-sort');
    if (threadSort) threadSort.addEventListener('change', function() { loadEmails(1); });
});

// ============================================
// SYNC BY DOMAIN/EMAIL
// ============================================
async function searchByDomain() {
    var query = document.getElementById('sync-domain-input').value.trim();
    if (!query) { alert('Enter an email or domain to search'); return; }

    var container = document.getElementById('sync-domain-results');
    container.innerHTML = '
Searching Gmail for threads involving "' + escapeHtml(query) + '"...
';

    try {
        var data = await apiCall('search_gmail_threads', {query: query, max_results: 30});

        if (!data.threads || data.threads.length === 0) {
            container.innerHTML = '
No threads found in Gmail for "' + escapeHtml(query) + '"
';
            return;
        }

        var newCount = data.threads.filter(function(t) { return !t.already_imported; }).length;
        var html = '
' + data.threads.length + ' threads found (' + newCount + ' new). ';
        if (newCount > 0) {
            html += '<button class="btn btn-sm btn-primary" onclick="importSelectedDomainThreads()">Import Selected (' + newCount + ')</button>';
        }
        html += '
';
        html += '
';

        data.threads.forEach(function(t) {
            var imported = t.already_imported;
            var bg = imported ? '#f0fdf4' : '#ffffff';
            var badge = imported ? ' Already imported (' + t.email_count + ' emails)' : '';
            var cb = imported ? '' : '<input type="checkbox" class="domain-thread-cb" value="' + escapeHtml(t.id) + '" checked style="margin-right:8px;">';
            html += '
' +
                cb + '' + escapeHtml(t.snippet || t.id) + '' + badge + '
';
        });

        html += '
';
        container.innerHTML = html;
    } catch(e) {
        container.innerHTML = '
Error: ' + escapeHtml(e.message) + '
';
    }
}

async function importSelectedDomainThreads() {
    var checkboxes = document.querySelectorAll('.domain-thread-cb:checked');
    var threadIds = Array.from(checkboxes).map(function(cb) { return cb.value; });

    if (threadIds.length === 0) { alert('No threads selected'); return; }
    if (!confirm('Import ' + threadIds.length + ' threads from Gmail?')) return;

    var container = document.getElementById('sync-domain-results');
    container.innerHTML += '
Importing ' + threadIds.length + ' threads... This may take a moment.
';

    try {
        var response = await fetch('api.php?action=import_gmail_threads', {
            method: 'POST',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({thread_ids: threadIds})
        });
        var data = await response.json();

        if (data.success) {
            var successCount = data.imported || 0;
            alert('Imported ' + successCount + ' of ' + threadIds.length + ' threads successfully.');
            container.innerHTML = '
Import complete: ' + successCount + ' threads imported.
';
            loadContacts(1);
            loadEmails(1);
        } else {
            alert('Import error: ' + (data.error || 'Unknown'));
        }
    } catch(e) {
        alert('Import error: ' + e.message);
    }
}