test: Enhance documentation search with agentic chatbot

cleanup-logs.js

@@ -0,0 +1,38 @@
+// Simple script to replace console.log statements with debug calls
+const fs = require('fs');
+const path = require('path');
+
+const fileToClean = './www/src/components/VectaraEnhanced/hooks/useProductionChat.ts';
+
+// Read the file
+let content = fs.readFileSync(fileToClean, 'utf8');
+
+// Replace console.log statements with debug calls
+const replacements = [
+  // Replace various console.log patterns
+  { from: /console\.log\('Source filtering:',/g, to: "debugAPI('Source filtering:'," },
+  { from: /console\.log\(`📄 RESULT \${index \+ 1}:`,/g, to: "debugAPI(`📄 RESULT ${index + 1}:`," },
+  { from: /console\.log\(`🔑 Metadata for Result \${index \+ 1}:`\);/g, to: "debugAPI(`🔑 Metadata for Result ${index + 1}:`);" },
+  { from: /console\.log\(\s*`  - \${m\.name}: "\${m\.value}"`\s*\);/g, to: "debugAPI(`  - ${m.name}: \"${m.value}\"`);" },
+  { from: /console\.log\(`❌ No metadata available for Result \${index \+ 1}`\);/g, to: "debugAPI(`❌ No metadata available for Result ${index + 1}`);" },
+  { from: /console\.log\('Code detection debug:',/g, to: "debugCodeGeneration('Code detection debug:'," },
+  { from: /console\.log\('🚀 showCodeExamples called:',/g, to: "debugCodeGeneration('🚀 showCodeExamples called:'," },
+  { from: /console\.log\('✅ Target message found:',/g, to: "debugCodeGeneration('✅ Target message found:'," },
+  { from: /console\.log\('Generating code snippets for message content...\');/g, to: "debugCodeGeneration('Generating code snippets for message content...');" },
+  { from: /console\.log\('Generated', allSnippets\.length, 'total snippets'\);/g, to: "debugCodeGeneration('Generated', allSnippets.length, 'total snippets');" },
+  { from: /console\.log\('Filtered to', codeSnippets\.length, 'snippets for', language \|\| 'all languages'\);/g, to: "debugCodeGeneration('Filtered to', codeSnippets.length, 'snippets for', language || 'all languages');" },
+  { from: /console\.log\('📝 Updating state with', codeSnippets\.length, 'code snippets'\);/g, to: "debugCodeGeneration('📝 Updating state with', codeSnippets.length, 'code snippets');" },
+  { from: /console\.log\('✅ Updating message:', msg\.id, 'with', codeSnippets\.length, 'code snippets for', language \|\| 'all languages'\);/g, to: "debugCodeGeneration('✅ Updating message:', msg.id, 'with', codeSnippets.length, 'code snippets for', language || 'all languages');" },
+  { from: /console\.log\('🎉 Successfully updated message with code snippets'\);/g, to: "debugCodeGeneration('🎉 Successfully updated message with code snippets');" },
+  { from: /console\.log\('⚠️ No code snippets to show'\);/g, to: "debugCodeGeneration('⚠️ No code snippets to show');" },
+];
+
+// Apply replacements
+replacements.forEach(({ from, to }) => {
+  content = content.replace(from, to);
+});
+
+// Write the cleaned file back
+fs.writeFileSync(fileToClean, content);
+
+console.log('✅ Cleaned up console.log statements in useProductionChat.ts');

www/10-06-25-example-agent-interaction.sh

@@ -0,0 +1,189 @@
+a# Vectara Agent Interaction Example
+# Date: 10-06-25
+# Demonstrates the hybrid search approach used in the UI
+
+# This example shows how the chatbot searches both corpora simultaneously
+# to provide comprehensive answers with code examples
+
+echo "=== Vectara Agent Interaction Example ==="
+echo "Date: 10-06-25"
+echo "Demonstrating hybrid corpus search for: 'How to create a corpus'"
+echo ""
+
+# ============================================================================
+# PART 1: Agent Platform Search (technical_writing_assistant corpus)
+# ============================================================================
+echo "1. AGENT PLATFORM SEARCH"
+echo "Corpus: technical_writing_assistant"
+echo "Method: Vectara Agent API"
+echo ""
+
+curl -X POST "https://api.vectara.io/v2/agents/agt_documentation_assistant_ed3f/sessions/YOUR_SESSION_KEY/events" \
+  -H "Content-Type: application/json" \
+  -H "x-api-key: YOUR_TESTING_API_KEY" \
+  -H "customer-id: YOUR_TESTING_CUSTOMER_ID" \
+  -d '{
+    "type": "message",
+    "content": "How to create a corpus",
+    "timestamp": '$(date +%s)000'
+  }' | jq '.' > agent_response.json
+
+echo "Agent Response Structure:"
+echo "- Uses Agent Platform for context-aware responses"
+echo "- Maintains conversation history in session"
+echo "- Automatically includes code examples in markdown format"
+echo ""
+
+# ============================================================================
+# PART 2: Direct API Search (ofer-bm-moma-docs_232 corpus)
+# ============================================================================
+echo "2. DIRECT API SEARCH (Hybrid)"
+echo "Corpus: ofer-bm-moma-docs_232"
+echo "Method: Vectara Query API v1"
+echo ""
+
+curl -X POST "https://api.vectara.io/v1/query" \
+  -H "Content-Type: application/json" \
+  -H "x-api-key: zqt_WvU_2ewh7ZGRwq8LdL2SV8B9RJmVGyUm1VAuOw" \
+  -H "customer-id: 1526022105" \
+  -d '{
+    "query": [
+      {
+        "text": "How to create a corpus",
+        "context": ""
+      }
+    ],
+    "num_results": 5,
+    "corpus_key": [
+      {
+        "customer_id": "1526022105",
+        "corpus_id": 232,
+        "metadata": {}
+      }
+    ]
+  }' | jq '.' > direct_search_response.json
+
+echo "Direct Search Response Structure:"
+echo "- Provides raw document snippets"
+echo "- Used to supplement agent responses with additional context"
+echo ""
+
+# ============================================================================
+# PART 3: Sample Combined Response (What the UI shows)
+# ============================================================================
+echo "3. COMBINED UI RESPONSE"
+echo "This is what users see in the chatbot interface:"
+echo ""
+
+cat << 'EOF'
+To create a new corpus in Vectara, you can use the following approaches:
+
+## Using JavaScript (v2 API)
+
+```javascript
+// Create a new Vectara corpus
+const createCorpus = async (corpusName, customerId, apiKey) => {
+  const response = await fetch('https://api.vectara.io/v2/corpora', {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      'Authorization': 'Bearer ${apiKey}',
+      'customer-id': '${customerId}'
+    },
+    body: JSON.stringify({
+      name: '${corpusName}',
+      description: 'Corpus created via API'
+    })
+  });
+
+  if (!response.ok) {
+    throw new Error(`Failed to create corpus: ${response.statusText}`);
+  }
+
+  return await response.json();
+};
+
+// Usage example
+const result = await createCorpus('my-new-corpus', 'YOUR_CUSTOMER_ID', 'YOUR_API_KEY');
+console.log('Corpus created:', result);
+```
+
+## Using Python (v2 API)
+
+```python
+import requests
+import json
+
+def create_corpus(corpus_name, customer_id, api_key):
+    """Create a new Vectara corpus using v2 API"""
+    url = "https://api.vectara.io/v2/corpora"
+
+    headers = {
+        'Content-Type': 'application/json',
+        'Authorization': f'Bearer {api_key}',
+        'customer-id': customer_id
+    }
+
+    data = {
+        'name': corpus_name,
+        'description': 'Corpus created via API'
+    }
+
+    response = requests.post(url, headers=headers, json=data)
+
+    if response.status_code != 200:
+        raise Exception(f"Failed to create corpus: {response.text}")
+
+    return response.json()
+
+# Usage example
+result = create_corpus('my-new-corpus', 'YOUR_CUSTOMER_ID', 'YOUR_API_KEY')
+print(f"Corpus created: {result}")
+```
+
+## Using cURL
+
+```bash
+curl -X POST "https://api.vectara.io/v2/corpora" \
+  -H "Content-Type: application/json" \
+  -H "Authorization: Bearer YOUR_API_KEY" \
+  -H "customer-id: YOUR_CUSTOMER_ID" \
+  -d '{
+    "name": "my-new-corpus",
+    "description": "Corpus created via API"
+  }'
+```
+
+## Key Points:
+
+1. **Authentication**: Use your API key and customer ID
+2. **API Version**: The v2 API is recommended for new implementations
+3. **Error Handling**: Always check response status codes
+4. **Permissions**: Ensure your API key has corpus creation permissions
+
+The response will include corpus details like corpus ID, creation timestamp, and configuration settings.
+
+**Sources:**
+- Vectara API Documentation [vectara_1]
+- Corpus Management Guide [vectara_2]
+- v2 API Reference [vectara_3]
+
+EOF
+
+echo ""
+echo "=== Key Features Demonstrated ==="
+echo "✅ Hybrid Search: Agent Platform + Direct API"
+echo "✅ Embedded Code Examples: No button clicking required"
+echo "✅ Multiple Languages: JavaScript, Python, cURL"
+echo "✅ Conversation Context: Follow-up questions maintain context"
+echo "✅ Source Citations: Automatic reference linking"
+echo ""
+echo "=== Architecture Notes ==="
+echo "• Agent searches technical_writing_assistant corpus for contextual responses"
+echo "• Direct API searches ofer-bm-moma-docs_232 for additional documentation"
+echo "• Results are combined and formatted in the UI"
+echo "• Session persistence maintains conversation context across interactions"
+echo ""
+
+# Clean up sample files
+rm -f agent_response.json direct_search_response.json

www/ENHANCED_CHATBOT_TESTING.md

@@ -0,0 +1,134 @@
+# Enhanced Chatbot Testing - platform/react-chatbot Branch
+
+## Overview
+This branch contains the enhanced Vectara chatbot with intelligent code generation and search integration features.
+
+## What's New
+
+### 🤖 Intelligent Code Generation
+- **Smart Detection**: Only generates code examples when users explicitly ask for them
+- **Multi-language Support**: JavaScript, TypeScript, Python, and cURL
+- **Interactive Parameters**: Users can customize API credentials directly in the interface
+- **On-demand Generation**: Clean UX with "Show code examples" button
+
+### 🔍 Enhanced Search Integration
+- **Floating Chat Button**: AI assistant accessible from any page
+- **Search Context**: Chat remembers what you were searching for
+- **Seamless Handoff**: Easy transition from search results to AI conversation
+
+### ⚡ Enhanced Performance
+- **Optimized API Parameters**: Lexical interpolation 0.005 and latest summarizer
+- **Better Context**: 2 sentences before/after for comprehensive responses
+- **Analytics**: Comprehensive event tracking for insights
+
+## File Structure
+
+```
+src/components/VectaraEnhanced/
+├── components/
+│   ├── VectaraEnhancedChatbot.tsx      # Main chatbot component
+│   └── SearchChatIntegration.tsx       # Search integration
+├── hooks/
+│   ├── useProductionChat.ts            # v1 API hook (active)
+│   └── useProductionChatV2.ts          # v2 API hook (ready)
+├── utils/
+│   └── codeTemplates.ts                # Code generation system
+├── types/
+│   └── index.ts                        # TypeScript definitions
+└── config/
+    └── vectaraConfig.ts                # API configuration
+```
+
+## Testing the Enhanced Features
+
+### 1. **Start Development Server**
+```bash
+cd www
+npm start
+```
+
+### 2. **Look for the Floating Chat Button**
+- You'll see a 💬 button in the bottom-right corner
+- Click it to open the AI assistant
+
+### 3. **Test Code Generation**
+Try asking questions like:
+- "How do I search my corpus?"
+- "Show me a JavaScript example"
+- "Give me Python code for uploading documents"
+- "How to implement search in TypeScript?"
+
+### 4. **Test Interactive Features**
+- Click "Show code examples" when it appears
+- Customize the API credentials in code snippets
+- Copy code to clipboard
+- Watch the console for analytics events
+
+### 5. **Test Search Integration**
+- Use the regular search at the top
+- Look for enhanced AI features integrated with search results
+
+## Configuration
+
+The enhanced features use the same API credentials as the original search:
+- **Customer ID**: 1526022105
+- **Corpus ID**: 232  
+- **API Key**: (configured in vectaraConfig.ts)
+
+## API Version Switching
+
+The system is ready for v2 API migration:
+```typescript
+// In config/vectaraConfig.ts
+export const USE_V2_API = false; // Change to true when v2 is ready
+```
+
+## Rollback Instructions
+
+If you need to revert to the original SearchBar:
+```bash
+cd src/theme
+mv SearchBar.tsx SearchBar.enhanced.tsx
+mv SearchBar.original.tsx SearchBar.tsx
+```
+
+## What to Test
+
+### ✅ Basic Functionality
+- [ ] Floating chat button appears
+- [ ] Chat opens when clicked
+- [ ] Can send messages and get responses
+- [ ] Responses include source references
+
+### ✅ Code Generation
+- [ ] Ask "Show me JavaScript code" - should auto-generate
+- [ ] Ask "How do I search?" - should show "Show code examples" button
+- [ ] Click "Show code examples" - should generate multiple languages
+- [ ] Customize parameters in code snippets
+- [ ] Copy code to clipboard
+
+### ✅ Enhanced Features
+- [ ] Analytics events logged to console
+- [ ] Integration events tracked
+- [ ] Error handling works (try invalid queries)
+- [ ] Chat context preserved during session
+
+### ✅ Performance
+- [ ] Fast response times
+- [ ] Better answer quality (enhanced summarizer)
+- [ ] Comprehensive source references
+
+## Known Issues
+- None currently - this is a stable implementation
+
+## Next Steps
+1. **Test thoroughly** with various queries
+2. **Gather feedback** on UX and functionality  
+3. **Coordinate v2 API migration** with team
+4. **Consider publishing** as `@vectara/react-chatbot-search`
+
+---
+
+**Branch**: `platform/react-chatbot`
+**Plugin Location**: `/Users/paulwozniczka/Documents/cc/react-chatbot-august/`
+**Status**: Ready for testing ✅