feat: add web phone call for cal ai (calcom#23527)

* feat: add web phone call for cal ai

* fix: web call

* refactor: improvements

* chore

* refactor: web call improvements

* chore: error message

* refactor: improvements

* fix: err

* refactor: feedback and improvements

* fix: type errors

* refactor: hasAvailable

* chore: use orgid

* fix: types

---------

Co-authored-by: Peer Richelsen <peeroke@gmail.com>

Author: Udit-takkar

apps/web/package.json

@@ -139,6 +139,7 @@
     "react-use-intercom": "1.5.1",
     "recoil": "^0.7.7",
     "remove-markdown": "^0.5.0",
+    "retell-client-js-sdk": "^2.0.0",
     "retell-sdk": "^4.40.0",
     "rrule": "^2.7.1",
     "sanitize-html": "^2.10.0",

apps/web/public/icons/sprite.svg

@@ -860,6 +860,7 @@
   "phone_number_for_ai_call": "Phone number (for our agent to call)",
   "buy_a_phone_number_or_import_one_you_already_have": "Buy a phone number or import one you already have on twilio",
   "test_agent": "Test Agent",
+  "test_web_call": "Test Web Call",
   "phone_numbers": "Phone Numbers",
   "unsubscribe": "Unsubscribe",
   "delete_workflow_step": "Delete Workflow Step",
@@ -1479,6 +1480,24 @@
   "app_removed_successfully": "App removed successfully",
   "error_removing_app": "Error removing app",
   "web_conference": "Web conference",
+  "web_call": "Web call",
+  "start_web_call": "Start web call",
+  "end_call": "End call",
+  "test_your_agent_with_web_call": "Test your agent with a web call without requiring a phone number",
+  "phone_call": "Phone call",
+  "connecting_to_agent": "Connecting to agent...",
+  "call_active": "Call active",
+  "call_ended": "Call ended",
+  "call_error": "Call error",
+  "ready_to_start_call": "Ready to start call",
+  "failed_to_start_web_call_try_again": "Failed to start web call. Please try again.",
+  "call_encountered_error_try_again": "Call encountered an error. Please try again.",
+  "failed_initialize_web_call_microphone_permissions": "Failed to initialize web call. Please ensure microphone permissions are granted.",
+  "start_call_to_see_conversation": "Start a call to see the conversation",
+  "waiting_for_conversation": "Waiting for conversation...",
+  "ai_agent": "AI Agent",
+  "live": "Live",
+  "connecting": "Connecting...",
   "requires_confirmation": "Requires confirmation",
   "requires_confirmation_threshold": "Requires confirmation if booked with < {{time}} $t({{unit}}_timeUnit) notice",
   "may_require_confirmation": "May require confirmation",
@@ -1714,6 +1733,7 @@
   "transcription_enabled": "Transcriptions are enabled now",
   "transcription_stopped": "Transcriptions are stopped now",
   "download_transcript": "Download Transcript",
+  "transcript": "Transcript",
   "recording_from_your_recent_call": "A recording from your recent call on {{appName}} is ready for download",
   "transcript_from_previous_call": "Transcript from your recent call on {{appName}} is ready to download. Links are valid only for 1 Hour",
   "you_can_download_transcript_from_attachments": "You can also download transcript from attachments",
@@ -3622,6 +3642,11 @@
   "send_another_message": "Send another message",
   "sending": "Sending",
   "no_variables_found": "No variables found",
+  "credits_required": "Credits Required",
+  "web_call_credits_info": "Web calls consume credits. Make sure you have enough credits to start a call.",
+  "web_call_no_credits": "Web calls require credits. You have 0 credits remaining.",
+  "purchase_credits": "Purchase Credits",
+  "credits_required_tooltip": "This action requires credits to proceed",
   "api_key_name_too_long": "Name must not exceed {{max}} characters",
   "auto_charge_for_last_minute_cancellation": "Auto charge no-show fee for last minute cancellations",
   "before_scheduled_start_time": "Before scheduled start time",

apps/web/public/static/locales/en/common.json

@@ -327,6 +327,21 @@ export interface AIPhoneServiceProvider<T extends AIPhoneServiceProviderType = A
     message: string;
   }>;
 
+  /**
+   * Create a web call
+   */
+  createWebCall(params: {
+    agentId: string;
+    userId: number;
+    teamId?: number;
+    timeZone: string;
+    eventTypeId: number;
+  }): Promise<{
+    callId: string;
+    accessToken: string;
+    agentId: string;
+  }>;
+
   /**
    * Update tools from event type ID
    */

packages/features/calAIPhone/interfaces/AIPhoneService.interface.ts

@@ -266,6 +266,20 @@ export class RetellAIPhoneServiceProvider
     return await this.service.createTestCall(params);
   }
 
+  async createWebCall(params: {
+    agentId: string;
+    userId: number;
+    teamId?: number;
+    timeZone: string;
+    eventTypeId: number;
+  }): Promise<{
+    callId: string;
+    accessToken: string;
+    agentId: string;
+  }> {
+    return await this.service.createWebCall(params);
+  }
+
   async updateToolsFromAgentId(
     agentId: string,
     data: { eventTypeId: number | null; timeZone: string; userId: number | null; teamId?: number | null }

packages/features/calAIPhone/providers/retellAI/RetellAIPhoneServiceProvider.ts

@@ -220,6 +220,16 @@ export class RetellAIService {
     return this.callService.createTestCall(params);
   }
 
+  async createWebCall(params: {
+    agentId: string;
+    userId: number;
+    teamId?: number;
+    timeZone: string;
+    eventTypeId: number;
+  }) {
+    return this.callService.createWebCall(params);
+  }
+
   async generatePhoneNumberCheckoutSession(params: {
     userId: number;
     teamId?: number;

packages/features/calAIPhone/providers/retellAI/RetellAIService.ts

@@ -12,6 +12,7 @@ import type {
   RetellAgent,
   CreatePhoneNumberParams,
   CreatePhoneCallParams,
+  CreateWebCallParams,
   ImportPhoneNumberParams,
 } from "./types";
 
@@ -234,4 +235,17 @@ export class RetellSDKClient implements RetellAIRepository {
       throw error;
     }
   }
+
+  async createWebCall(data: CreateWebCallParams) {
+    try {
+      const response = await this.client.call.createWebCall({
+        agent_id: data.agentId,
+        retell_llm_dynamic_variables: data.dynamicVariables,
+      });
+      return response;
+    } catch (error) {
+      this.logger.error("Failed to create web call", { error });
+      throw error;
+    }
+  }
 }

packages/features/calAIPhone/providers/retellAI/RetellSDKClient.ts

@@ -166,6 +166,93 @@ export class CallService {
     };
   }
 
+  async createWebCall({
+    agentId,
+    userId,
+    teamId,
+    timeZone,
+    eventTypeId,
+  }: {
+    agentId: string;
+    userId: number;
+    teamId?: number;
+    timeZone: string;
+    eventTypeId: number;
+  }) {
+    if (!agentId?.trim()) {
+      throw new HttpError({
+        statusCode: 400,
+        message: "Agent ID is required and cannot be empty",
+      });
+    }
+
+    await this.validateCreditsForTestCall({ userId, teamId });
+
+    await checkRateLimitAndThrowError({
+      rateLimitingType: "core",
+      identifier: `web-call:${userId}`,
+    });
+
+    const agent = await this.agentRepository.findByIdWithCallAccess({
+      id: agentId,
+      userId,
+    });
+
+    if (!agent) {
+      throw new HttpError({
+        statusCode: 404,
+        message: "Agent not found or you don't have permission to use it.",
+      });
+    }
+
+    if (!agent.providerAgentId) {
+      throw new HttpError({
+        statusCode: 400,
+        message: "Agent provider ID not found.",
+      });
+    }
+
+    const dynamicVariables = {
+      EVENT_NAME: "Web Call Test with Agent",
+      EVENT_DATE: "Monday, January 15, 2025",
+      EVENT_TIME: "2:00 PM",
+      EVENT_END_TIME: "2:30 PM",
+      TIMEZONE: timeZone,
+      LOCATION: "Web Call",
+      ORGANIZER_NAME: "Cal.com AI Agent",
+      ATTENDEE_NAME: "Test User",
+      ATTENDEE_FIRST_NAME: "Test",
+      ATTENDEE_LAST_NAME: "User",
+      ATTENDEE_EMAIL: "testuser@example.com",
+      ATTENDEE_TIMEZONE: timeZone,
+      ADDITIONAL_NOTES: "This is a test web call to verify the AI phone agent",
+      EVENT_START_TIME_IN_ATTENDEE_TIMEZONE: "2:00 PM",
+      EVENT_END_TIME_IN_ATTENDEE_TIMEZONE: "2:30 PM",
+      eventTypeId: eventTypeId.toString(),
+    };
+
+    try {
+      const webCall = await this.retellRepository.createWebCall({
+        agentId: agent.providerAgentId,
+        dynamicVariables,
+      });
+      return {
+        callId: webCall.call_id,
+        accessToken: webCall.access_token,
+        agentId: webCall.agent_id,
+      };
+    } catch (error) {
+      this.logger.error("Failed to create web call in external AI service", {
+        agentId: agent.providerAgentId,
+        error,
+      });
+      throw new HttpError({
+        statusCode: 500,
+        message: "Failed to create web call",
+      });
+    }
+  }
+
   private async validateCreditsForTestCall({ userId, teamId }: { userId: number; teamId?: number }) {
     try {
       const { CreditService } = await import("@calcom/features/ee/billing/credit-service");

packages/features/calAIPhone/providers/retellAI/services/CallService.ts

@@ -86,6 +86,11 @@ export type CreatePhoneCallParams = {
   toNumber: string;
   dynamicVariables?: RetellDynamicVariables;
 };
+
+export type CreateWebCallParams = {
+  agentId: string;
+  dynamicVariables?: RetellDynamicVariables;
+};
 export type UpdatePhoneNumberParams = Retell.PhoneNumberUpdateParams;
 export type ImportPhoneNumberParams = Retell.PhoneNumberImportParams;
 export type RetellLLMGeneralTools = Retell.LlmCreateParams["general_tools"];
@@ -171,4 +176,7 @@ export interface RetellAIRepository {
 
   // Call operations
   createPhoneCall(data: CreatePhoneCallParams): Promise<RetellCall>;
+  createWebCall(
+    data: CreateWebCallParams
+  ): Promise<{ call_id: string; access_token: string; agent_id: string }>;
 }