docs: add video for vonage config (#40)

README.md

@@ -42,7 +42,7 @@ The only command you need to run:
 > We collect anonymous usage data to improve the product. You can opt out by setting the `ENABLE_TELEMETRY` to `false` in the below command.
 
 ```bash
-curl -o docker-compose.yaml https://raw.githubusercontent.com/dograh-hq/dograh/main/docker-compose.yaml && REGISTRY=ghcr.io/dograh-hq ENABLE_TELEMETRY=true docker compose up
+curl -o docker-compose.yaml https://raw.githubusercontent.com/dograh-hq/dograh/main/docker-compose.yaml && REGISTRY=ghcr.io/dograh-hq ENABLE_TELEMETRY=true docker compose up --pull always
 ```
 
 > **Note**

docs/getting-started/index.mdx

@@ -10,7 +10,7 @@ Get the stack up and running using Docker with a single command.
 <Note>We collect anonymous usage data to improve the product. You can opt out by setting the `ENABLE_TELEMETRY` to `false` in the below command.</Note>
 
 ```bash
-curl -o docker-compose.yaml https://raw.githubusercontent.com/dograh-hq/dograh/main/docker-compose.yaml && REGISTRY=ghcr.io/dograh-hq ENABLE_TELEMETRY=true docker compose up
+curl -o docker-compose.yaml https://raw.githubusercontent.com/dograh-hq/dograh/main/docker-compose.yaml && REGISTRY=ghcr.io/dograh-hq ENABLE_TELEMETRY=true docker compose up --pull always
 ```
 
 Please check [Prerequisites](getting-started/prerequisites) for the system requirements and [Troubleshooting](getting-started/troubleshooting) for common issues.

docs/getting-started/prerequisites.mdx

@@ -1,9 +1,9 @@
 ---
 title: "Prerequisites"
-description: "System requirements and setup needed to run Dograh AI"
+description: "System requirements and setup needed to run Dograh AI locally"
 ---
 
-## System Requirements
+## System Requirements (Local Setup)
 
 ### Minimum Requirements
 - **RAM**: 8 GB (4 GB available for Docker)
@@ -78,8 +78,8 @@ To use a specific registry, set the `REGISTRY` environment variable:
 
 ```bash
 # Using GitHub Container Registry (recommended)
-REGISTRY=ghcr.io/dograh-hq docker compose up
+REGISTRY=ghcr.io/dograh-hq docker compose up --pull always
 
 # Using Docker Hub
-REGISTRY=dograhai docker compose up
+REGISTRY=dograhai docker compose up --pull always
 ```

docs/integrations/telephony/overview.mdx

@@ -28,23 +28,27 @@ The telephony integration system uses a provider abstraction pattern that ensure
 ```python
 # All providers implement this interface
 class TelephonyProvider(ABC):
-    async def initiate_call(to_number: str, webhook_url: str, workflow_run_id: Optional[int] = None, **kwargs)
+    async def initiate_call(to_number: str, webhook_url: str, workflow_run_id: Optional[int] = None, **kwargs) -> CallInitiationResult
     async def get_call_status(call_id: str) -> Dict[str, Any]
     async def get_available_phone_numbers() -> List[str]
     def validate_config() -> bool
     async def verify_webhook_signature(url: str, params: Dict, signature: str) -> bool
     async def get_webhook_response(workflow_id: int, user_id: int, workflow_run_id: int) -> str
     async def get_call_cost(call_id: str) -> Dict[str, Any]
+    def parse_status_callback(data: Dict[str, Any]) -> Dict[str, Any]
+    async def handle_websocket(websocket: WebSocket, workflow_id: int, user_id: int, workflow_run_id: int) -> None
 ```
 
 ## Configuration
 
 Dograh AI uses database configuration for all telephony providers. Configure providers through the web interface:
 
-1. Navigate to **Settings** → **Integrations** → **Telephony**
-2. Select your provider
-3. Enter credentials
-4. Test connection
+1. Navigate to **Workflow** → **Phone Call** → **Configure Telephony**
+2. Select your provider (Twilio or Vonage)
+3. Watch the provider-specific video tutorial for setup guidance
+4. Enter your credentials
+5. Save configuration
+6. Test with a phone call
 
 ## Common Features
 
@@ -73,10 +77,10 @@ result = await provider.initiate_call(
 )
 
 # Check call status
-status = await provider.get_call_status(result["call_id"])
+status = await provider.get_call_status(result.call_id)
 
 # Get call cost after completion
-cost_info = await provider.get_call_cost(result["call_id"])
+cost_info = await provider.get_call_cost(result.call_id)
 ```
 
 ## API Endpoints
@@ -86,20 +90,17 @@ The telephony system exposes these unified endpoints:
 | Endpoint | Method | Description |
 |----------|---------|-------------|
 | `/api/v1/telephony/initiate-call` | POST | Start an outbound call |
-| `/api/v1/telephony/status-callback/{id}` | POST | Receive call status updates |
-| `/api/v1/telephony/webhook/{id}` | GET/POST | Handle initial webhook |
-| `/api/v1/telephony/ws/{id}` | WebSocket | Real-time audio streaming |
+| `/api/v1/telephony/twilio/status-callback/{id}` | POST | Receive Twilio status updates |
+| `/api/v1/telephony/vonage/events/{id}` | POST | Receive Vonage event updates |
+| `/api/v1/telephony/twiml` | POST | Handle Twilio webhook (TwiML) |
+| `/api/v1/telephony/ncco` | GET | Handle Vonage webhook (NCCO) |
+| `/api/v1/telephony/ws/{workflow_id}/{user_id}/{workflow_run_id}` | WebSocket | Real-time audio streaming |
 
 ## Implementation Status
 
 - **Twilio**: ✅ Fully implemented and tested
 - **Vonage**: ✅ Fully implemented with 16kHz audio support
 - **Custom Providers**: The abstraction layer supports adding new providers by implementing the `TelephonyProvider` interface
-- **API Endpoints**: All telephony operations use the unified `/api/v1/telephony/*` endpoints:
-  - `/api/v1/telephony/initiate-call` - Start outbound calls
-  - `/api/v1/telephony/status-callback/{id}` - Receive call status updates  
-  - `/api/v1/telephony/webhook/{workflow_id}/{user_id}/{workflow_run_id}` - Initial call webhook
-  - `/api/v1/telephony/ws/{workflow_id}/{user_id}/{workflow_run_id}` - WebSocket for audio streaming
 
 ## Troubleshooting
 

docs/integrations/telephony/twilio.mdx

@@ -39,14 +39,14 @@ Watch this step-by-step guide to set up Twilio with Dograh AI:
 
 ### Step 2: Configure in Dograh AI
 
-1. Navigate to **Settings** → **Integrations** → **Telephony**
-2. Select **Twilio** as your provider
-3. Enter your credentials:
+1. Navigate to **Workflow** → **Phone Call** → **Configure Telephony**
+2. Watch the Twilio setup video tutorial above for detailed guidance
+3. Select **Twilio** as your provider
+4. Enter your credentials:
    - Account SID
    - Auth Token
-   - Phone Numbers (comma-separated if multiple)
-4. Click **Test Connection**
-5. Save configuration
+   - From Phone Number (with country code, e.g., +1234567890)
+5. Click **Save Configuration**
 
 ### Step 3: Test Your Configuration
 

docs/integrations/telephony/vonage.mdx

@@ -17,6 +17,18 @@ Before setting up Vonage integration, you'll need:
 - At least one Vonage phone number
 - Dograh AI instance running and accessible
 
+## Video Tutorial
+
+Watch this step-by-step guide to set up Vonage with Dograh AI:
+
+<iframe
+  className="w-full aspect-video rounded-xl"
+  src="https://www.tella.tv/video/configuring-telephony-on-dograh-with-vonage-3wvo/embed?b=1&title=1&a=1&loop=0&t=0&muted=0&wt=1"
+  title="Dograh Vonage Setup"
+  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+  allowFullScreen
+></iframe>
+
 ## Configuration
 
 ### Step 1: Create Vonage Application
@@ -29,23 +41,23 @@ Before setting up Vonage integration, you'll need:
 
 ### Step 2: Get API Credentials
 
-1. Find your **API Key** and **API Secret** in the dashboard
+1. Find your **API Key** and **API Secret** in the dashboard under **API Settings**
 2. Navigate to **Numbers** → **Your Numbers**
 3. Copy your phone number(s)
 4. Link your numbers to your application
 
 ### Step 3: Configure in Dograh AI
 
-1. Navigate to **Settings** → **Integrations** → **Telephony**
-2. Select **Vonage** as your provider
-3. Enter your credentials:
+1. Navigate to **Workflow** → **Phone Call** → **Configure Telephony**
+2. Watch the Vonage setup video tutorial above for detailed guidance
+3. Select **Vonage** as your provider
+4. Enter your credentials:
    - Application ID
    - Private Key (entire key including BEGIN/END lines)
-   - API Key
-   - API Secret  
-   - Phone Numbers (comma-separated if multiple)
-4. Click **Test Connection**
-5. Save configuration
+   - API Key (Optional - for some operations)
+   - API Secret (Optional - for webhook verification)
+   - From Phone Number (without '+' prefix, e.g., 14155551234)
+5. Click **Save Configuration**
 
 ### Step 4: Test Your Configuration
 
@@ -121,7 +133,7 @@ Vonage uses higher quality audio (16kHz) which provides:
   </Accordion>
   
   <Accordion title="Invalid phone number error">
-    - Remove the '+' prefix for Vonage (use `1234567890` not `+1234567890`)
+    - Remove the '+' prefix for Vonage (use `14155551234` not `+14155551234`)
     - Ensure numbers are in E.164 format without the '+'
     - Verify numbers are active in your Vonage account
   </Accordion>

ui/src/app/configure-telephony/page.tsx

@@ -175,9 +175,11 @@ export default function ConfigureTelephonyPage() {
         <div>
             <Card className="h-full">
               <CardHeader>
-                <CardTitle>Setup Guide</CardTitle>
+                <CardTitle>
+                  {selectedProvider === "twilio" ? "Twilio" : "Vonage"} Setup Guide
+                </CardTitle>
                 <CardDescription>
-                  Watch this video to learn how to setup telephony
+                  Watch this video to learn how to setup {selectedProvider === "twilio" ? "Twilio" : "Vonage"}
                 </CardDescription>
               </CardHeader>
               <CardContent>
@@ -186,7 +188,11 @@ export default function ConfigureTelephonyPage() {
                     style={{ border: 0 }}
                     width="100%"
                     height="100%"
-                    src="https://www.tella.tv/video/cmgbvzkrt00jk0clacu16blm3/embed?b=0&title=1&a=1&loop=0&t=0&muted=0&wt=0"
+                    src={
+                      selectedProvider === "twilio"
+                        ? "https://www.tella.tv/video/cmgbvzkrt00jk0clacu16blm3/embed?b=0&title=1&a=1&loop=0&t=0&muted=0&wt=0"
+                        : "https://www.tella.tv/video/configuring-telephony-on-dograh-with-vonage-3wvo/embed?b=0&title=1&a=1&loop=0&t=0&muted=0&wt=0"
+                    }
                     allowFullScreen
                     allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                   />