ttp-agent-sdk 2.5.3 → 2.5.5

package/ENHANCED_WIDGET_GUIDE.md

@@ -1,20 +1,29 @@
-# Enhanced AgentWidget - Complete Customization Guide
+# TTPChatWidget - Complete Customization Guide
 
-The `EnhancedAgentWidget` provides extensive customization options while maintaining sensible defaults. Users can customize icons, positioning, colors, animations, and much more.
+The `TTPChatWidget` provides extensive customization options while maintaining sensible defaults. Users can customize icons, positioning, colors, animations, and much more.
 
 ## Quick Start
 
 ```javascript
-import { EnhancedAgentWidget } from 'ttp-agent-sdk';
+import { TTPChatWidget } from 'ttp-agent-sdk';
 
-// Minimal configuration (uses all defaults)
-new EnhancedAgentWidget({
+// Minimal configuration with signed URL (uses all defaults)
+new TTPChatWidget({
   agentId: 'your_agent_id',
-  getSessionUrl: async ({ agentId, variables }) => {
+  signedUrl: 'wss://speech.talktopc.com/ws/conv?signed_token=eyJ...' // Direct signed URL
+});
+```
+
+Or use a function to fetch the signed URL:
+
+```javascript
+new TTPChatWidget({
+  agentId: 'your_agent_id',
+  signedUrl: async () => {
     const response = await fetch('/api/get-session', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ agentId, variables })
+      body: JSON.stringify({ agentId: 'your_agent_id' })
     });
     const data = await response.json();
     return data.signedUrl;
@@ -29,10 +38,14 @@ new EnhancedAgentWidget({
 ```javascript
 {
   agentId: 'your_agent_id',           // Required: Your agent ID
-  getSessionUrl: async ({ agentId, variables }) => { ... }  // Required: Function to get signed URL
+  signedUrl: 'wss://speech.talktopc.com/ws/conv?signed_token=...'  // Required: Signed URL (string or async function)
 }
 ```
 
+**Signed URL Options:**
+- **Direct string**: `signedUrl: 'wss://speech.talktopc.com/ws/conv?signed_token=...'`
+- **Function**: `signedUrl: async () => { const data = await fetch(...); return data.signedUrl; }`
+
 ### Icon/Image Configuration
 
 ```javascript
@@ -194,7 +207,7 @@ position: {
 ```javascript
 {
   customStyles: `
-    #enhanced-agent-widget {
+    #text-chat-panel {
       /* Your custom CSS here */
     }
   `
@@ -204,20 +217,20 @@ position: {
 ## Complete Example
 
 ```javascript
-import { EnhancedAgentWidget } from 'ttp-agent-sdk';
+import { TTPChatWidget } from 'ttp-agent-sdk';
+
+// Get signed URL from backend
+const response = await fetch('/api/get-session', {
+  method: 'POST',
+  headers: { 'Content-Type': 'application/json' },
+  body: JSON.stringify({ agentId: 'my_agent_123' })
+});
+const data = await response.json();
 
-const widget = new EnhancedAgentWidget({
+const widget = new TTPChatWidget({
   // Required
   agentId: 'my_agent_123',
-  getSessionUrl: async ({ agentId, variables }) => {
-    const response = await fetch('/api/get-session', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ agentId, variables })
-    });
-    const data = await response.json();
-    return data.signedUrl;
-  },
+  signedUrl: data.signedUrl, // Use signed URL directly
   
   // Custom icon (company logo)
   icon: {
@@ -302,22 +315,23 @@ widget.updateConfig({
 widget.destroy();
 ```
 
-## Migration from Original AgentWidget
+## Widget Modes
 
-The enhanced widget is fully backward compatible. Simply replace:
+The `TTPChatWidget` supports three modes:
 
-```javascript
-// Old
-import { AgentWidget } from 'ttp-agent-sdk';
-new AgentWidget({ ... });
+- `'unified'` (default) - Shows landing screen with both voice and text options
+- `'voice-only'` - Only voice interface, no text chat
+- `'text-only'` - Only text chat interface, no voice
 
-// New
-import { EnhancedAgentWidget } from 'ttp-agent-sdk';
-new EnhancedAgentWidget({ ... });
+```javascript
+new TTPChatWidget({
+  agentId: 'your_agent_id',
+  behavior: {
+    mode: 'unified' // or 'voice-only' or 'text-only'
+  }
+});
 ```
 
-All existing configurations will work with sensible defaults applied.
-
 ## Browser Support
 
 - Chrome 66+

package/GETTING_STARTED.md

@@ -30,11 +30,11 @@ npm install ttp-agent-sdk
     // Initialize the voice widget
     TTPAgentSDK.AgentWidget.init({
       agentId: 'your_agent_id',
-      getSessionUrl: async ({ agentId, variables }) => {
+      signedUrl: async () => {
         const response = await fetch('/api/get-session', {
           method: 'POST',
           headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ agentId, variables })
+          body: JSON.stringify({ agentId: 'your_agent_id' })
         });
         const data = await response.json();
         return data.signedUrl;
@@ -143,7 +143,7 @@ const voiceSDK = new VoiceSDK({
 ```javascript
 TTPAgentSDK.AgentWidget.init({
   agentId: 'your_agent_id',           // Required
-  getSessionUrl: 'https://...',       // Required - URL or function
+  signedUrl: 'wss://speech.talktopc.com/ws/conv?signed_token=...', // Required - Signed URL (string or async function)
   variables: {                        // Optional - dynamic variables
     userName: 'John Doe',
     page: 'homepage'

package/README.md

@@ -65,20 +65,36 @@ await voiceSDK.connect();
 ```html
 <script src="https://unpkg.com/ttp-agent-sdk/dist/agent-widget.js"></script>
 <script>
-  TTPAgentSDK.AgentWidget.init({
+  // Get signed URL from your backend first
+  const response = await fetch('/api/get-session', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ agentId: 'your_agent_id' })
+  });
+  const data = await response.json();
+
+  // Use the signed URL directly
+  new TTPAgentSDK.TTPChatWidget({
+    agentId: 'your_agent_id',
+    signedUrl: data.signedUrl
+  });
+</script>
+```
+
+Or use a function to fetch the signed URL:
+
+```html
+<script>
+  new TTPAgentSDK.TTPChatWidget({
     agentId: 'your_agent_id',
-    getSessionUrl: async ({ agentId, variables }) => {
+    signedUrl: async () => {
       const response = await fetch('/api/get-session', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ agentId, variables })
+        body: JSON.stringify({ agentId: 'your_agent_id' })
       });
       const data = await response.json();
       return data.signedUrl;
-    },
-    variables: {
-      userName: 'John Doe',
-      page: 'homepage'
     }
   });
 </script>

package/SIGNED_LINK_GUIDE.md

@@ -28,7 +28,7 @@ User's Frontend → User's Backend → TTP UI Backend → TTP Conversation Backe
 ### ❌ **Direct Agent ID (Insecure)**
 ```javascript
 // DON'T DO THIS IN PRODUCTION
-new EnhancedAgentWidget({
+new TTPChatWidget({
   agentId: 'agent_12345', // ❌ Visible in network traffic
   websocketUrl: 'wss://speech.talktopc.com/ws/conv'
 });
@@ -42,15 +42,23 @@ new EnhancedAgentWidget({
 
 ### ✅ **Signed Link (Secure)**
 ```javascript
-// PRODUCTION-READY APPROACH
-new EnhancedAgentWidget({
-  agentId: 'agent_12345',
-  getSessionUrl: async ({ agentId, variables }) => {
+// PRODUCTION-READY APPROACH - Option 1: Direct signed URL
+new TTPChatWidget({
+  agentId: 'agent_12345', // Still needed for widget initialization
+  signedUrl: 'wss://speech.talktopc.com/ws/conv?signed_token=eyJ...' // ✅ Direct signed URL
+});
+```
+
+```javascript
+// PRODUCTION-READY APPROACH - Option 2: Get signed URL from backend
+new TTPChatWidget({
+  agentId: 'your_agent_id',
+  signedUrl: async () => {
     // User's Frontend calls User's Backend
     const response = await fetch('/api/get-voice-session', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ agentId, variables })
+      body: JSON.stringify({ agentId: 'your_agent_id' })
     });
     const data = await response.json();
     return data.signedUrl; // ✅ Secure, time-limited URL from TTP
@@ -120,73 +128,96 @@ app.post('/api/get-voice-session', async (req, res) => {
 
 ### Step 2: User's Frontend Integration
 
+**Option 1: Direct Signed URL (Simplest)**
+
 ```javascript
-import { EnhancedAgentWidget } from 'ttp-agent-sdk';
+import { TTPChatWidget } from 'ttp-agent-sdk';
+
+// Get signed URL from your backend first
+const response = await fetch('/api/get-voice-session', {
+  method: 'POST',
+  headers: {
+    'Content-Type': 'application/json',
+    'Authorization': `Bearer ${getAuthToken()}`
+  },
+  body: JSON.stringify({
+    agentId: 'your_agent_id',
+    variables: {
+      page: 'homepage',
+      userType: 'customer'
+    }
+  })
+});
+
+const data = await response.json();
 
-new EnhancedAgentWidget({
+// Use the signed URL directly
+new TTPChatWidget({
+  agentId: 'your_agent_id', // Still needed for widget initialization
+  signedUrl: data.signedUrl // ✅ Direct signed URL
+});
+```
+
+**Option 2: Function that Returns Signed URL**
+
+```javascript
+import { TTPChatWidget } from 'ttp-agent-sdk';
+
+new TTPChatWidget({
   agentId: 'your_agent_id',
   
-  // User's Frontend calls User's Backend
-  getSessionUrl: async ({ agentId, variables }) => {
-    try {
-      const response = await fetch('/api/get-voice-session', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-          'Authorization': `Bearer ${getAuthToken()}` // User's auth token
-        },
-        body: JSON.stringify({
-          agentId,
-          variables: {
-            ...variables,
-            page: 'homepage',
-            userType: 'customer'
-          }
-        })
-      });
-
-      if (!response.ok) {
-        throw new Error(`Your backend responded with ${response.status}`);
-      }
-
-      const data = await response.json();
-      return data.signedUrl; // This connects directly to TTP Conversation Backend
-      
-    } catch (error) {
-      console.error('Failed to get signed URL from your backend:', error);
-      throw error;
+  // Function that fetches and returns signed URL
+  signedUrl: async () => {
+    const response = await fetch('/api/get-voice-session', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${getAuthToken()}`
+      },
+      body: JSON.stringify({
+        agentId: 'your_agent_id',
+        variables: {
+          page: 'homepage',
+          userType: 'customer'
+        }
+      })
+    });
+
+    if (!response.ok) {
+      throw new Error(`Your backend responded with ${response.status}`);
     }
-  },
-  
-  variables: {
-    page: 'homepage',
-    userType: 'customer',
-    language: 'en'
+
+    const data = await response.json();
+    return data.signedUrl; // This connects directly to TTP Conversation Backend
   }
 });
 ```
 
 ## 🔧 Your Current Implementation
 
-Based on your setup, you're already using this pattern:
+Based on your setup, you can use signed URLs like this:
 
 ```javascript
-// Your current LandingPageWidget.jsx
-getSessionUrl: async ({ agentId, variables }) => {
-  const response = await fetch(buildApiUrl('/api/landing/signed-url'), {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify({
-      agentId: agentId,
-      variables: variables,
+// Get signed URL from your backend
+const response = await fetch(buildApiUrl('/api/landing/signed-url'), {
+  method: 'POST',
+  headers: { 'Content-Type': 'application/json' },
+  body: JSON.stringify({
+    agentId: 'your_agent_id',
+    variables: {
       page: 'landing',
       userType: 'visitor'
-    })
-  });
-  
-  const data = await response.json();
-  return data.signedUrl; // This connects to conversation backend
-}
+    }
+  })
+});
+
+const data = await response.json();
+
+// Use the signed URL directly
+new TTPChatWidget({
+  agentId: 'your_agent_id',
+  signedUrl: data.signedUrl // ✅ Direct signed URL
+});
 ```
 
 ## 🎯 Key Points

package/WORDPRESS_WIX_GUIDE.md

@@ -173,12 +173,15 @@ For production, use **signed links** instead of exposing agent IDs. Here's how:
     appId: 'app_bQHDFqydfNPl75MZNijXc4dUyHGqnHeX9e5l',
     behavior: { mode: 'unified' },
     
-    // Use your backend to generate signed URLs
-    getSessionUrl: async ({ agentId, appId, variables }) => {
+    // Use signed URL from your backend
+    signedUrl: async () => {
       const response = await fetch('https://your-backend.com/api/get-session', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ agentId, appId, variables })
+        body: JSON.stringify({ 
+          agentId: 'agent_f676e962a',
+          appId: 'app_bQHDFqydfNPl75MZNijXc4dUyHGqnHeX9e5l'
+        })
       });
       const data = await response.json();
       return data.signedUrl;