apunkt/dograh
1
0
Fork 0
mirror of https://github.com/dograh-hq/dograh.git synced 2026-06-19 08:28:10 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat: telephony call transfer (#155)

Browse source 
* transfer call

* fix: ignore completed call status

* chore: refactor telephony

* chore: refactor pipecat engine custom tools and other telephony services

* chore: code refactor

* chore: put back office ambient sound files

* chore: remove transport from engine

* fix: fix alembic revision

* chore: remove set_transferring_call from engine

* fix: send OutputAudio frame and let transport chunk it

* fix: reinstate docker compose

* chore: remove unused transfer-twmil route for caller

* chore: update pipecat submodule

---------

Co-authored-by: Abhishek Kumar <abhishek@a6k.me>
This commit is contained in:
Sabiha Khan 2026-02-16 14:33:33 +05:30 • committed by GitHub
parent 5d14d17ceb
commit c711920165
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
30 changed files with 1965 additions and 128 deletions
Download patch file Download diff file Expand all files Collapse all files

170
ui/src/app/tools/[toolUuid]/components/TransferCallToolConfig.tsx Normal file
View file

@ -0,0 +1,170 @@
"use client";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import { Textarea } from "@/components/ui/textarea";
import { type EndCallMessageType } from "../../config";
export interface TransferCallToolConfigProps {
name: string;
onNameChange: (name: string) => void;
description: string;
onDescriptionChange: (description: string) => void;
destination: string;
onDestinationChange: (destination: string) => void;
messageType: EndCallMessageType;
onMessageTypeChange: (messageType: EndCallMessageType) => void;
customMessage: string;
onCustomMessageChange: (message: string) => void;
timeout?: number; // Make optional to match API type
onTimeoutChange: (timeout: number) => void;
}
export function TransferCallToolConfig({
name,
onNameChange,
description,
onDescriptionChange,
destination,
onDestinationChange,
messageType,
onMessageTypeChange,
customMessage,
onCustomMessageChange,
timeout,
onTimeoutChange,
}: TransferCallToolConfigProps) {
// Basic E.164 validation pattern
const isValidPhoneNumber = (phone: string): boolean => {
const e164Pattern = /^\+[1-9]\d{1,14}$/;
return e164Pattern.test(phone);
};
const phoneNumberError = destination && !isValidPhoneNumber(destination);
return (
<Card>
<CardHeader>
<CardTitle>Transfer Call Configuration</CardTitle>
<CardDescription>
Configure call transfer settings (Twilio only)
</CardDescription>
</CardHeader>
<CardContent className="space-y-6">
<div className="grid gap-2">
<Label>Tool Name</Label>
<Label className="text-xs text-muted-foreground">
A descriptive name for this tool
</Label>
<Input
value={name}
onChange={(e) => onNameChange(e.target.value)}
placeholder="e.g., Transfer Call"
/>
</div>
<div className="grid gap-2">
<Label>Description</Label>
<Label className="text-xs text-muted-foreground">
Helps the LLM understand when to use this tool
</Label>
<Textarea
value={description}
onChange={(e) => onDescriptionChange(e.target.value)}
placeholder="When should the AI transfer the call?"
rows={3}
/>
</div>
<div className="grid gap-2 pt-4 border-t">
<Label>Destination Phone Number</Label>
<Label className="text-xs text-muted-foreground">
Phone number to transfer the call to (E.164 format with country code)
</Label>
<Input
value={destination}
onChange={(e) => onDestinationChange(e.target.value)}
placeholder="+1234567890"
className={phoneNumberError ? "border-red-500 focus:border-red-500" : ""}
/>
{phoneNumberError && (
<Label className="text-xs text-red-500">
Please enter a valid phone number in E.164 format (e.g., +1234567890)
</Label>
)}
</div>
<div className="grid gap-4 pt-4 border-t">
<Label>Pre-Transfer Message</Label>
<Label className="text-xs text-muted-foreground">
Choose whether to play a message before transferring
</Label>
<RadioGroup
value={messageType}
onValueChange={(v) => onMessageTypeChange(v as EndCallMessageType)}
className="space-y-3"
>
<label
htmlFor="none"
className="flex items-center space-x-3 p-3 border rounded-lg hover:bg-muted/50 cursor-pointer"
>
<RadioGroupItem value="none" id="none" />
<div className="flex-1">
<span className="font-medium">No Message</span>
<p className="text-xs text-muted-foreground">
Transfer the call immediately without any message
</p>
</div>
</label>
<div className="flex items-start space-x-3 p-3 border rounded-lg hover:bg-muted/50">
<RadioGroupItem value="custom" id="custom" className="mt-1" />
<label htmlFor="custom" className="flex-1 space-y-2 cursor-pointer">
<span className="font-medium">Custom Message</span>
<p className="text-xs text-muted-foreground">
Play a custom message before transferring
</p>
</label>
</div>
{messageType === "custom" && (
<div className="pl-8">
<Textarea
value={customMessage}
onChange={(e) => onCustomMessageChange(e.target.value)}
placeholder="e.g., Please hold while I transfer your call."
rows={2}
/>
</div>
)}
</RadioGroup>
</div>
<div className="grid gap-2 pt-4 border-t">
<Label>Transfer Timeout</Label>
<Label className="text-xs text-muted-foreground">
Maximum time to wait for destination to answer (5-120 seconds)
</Label>
<Input
type="number"
value={timeout ?? 30}
onChange={(e) => {
const value = parseInt(e.target.value) || 30;
// Clamp value between 5 and 120 seconds
const clampedValue = Math.min(Math.max(value, 5), 120);
onTimeoutChange(clampedValue);
}}
placeholder="30"
min="5"
max="120"
className="w-32"
/>
<Label className="text-xs text-muted-foreground">
Default: 30 seconds
</Label>
</div>
</CardContent>
</Card>
);
}

1
ui/src/app/tools/[toolUuid]/components/index.ts
View file

@ -1,2 +1,3 @@
export { EndCallToolConfig, type EndCallToolConfigProps } from "./EndCallToolConfig";
export { HttpApiToolConfig, type HttpApiToolConfigProps } from "./HttpApiToolConfig";
export { TransferCallToolConfig, type TransferCallToolConfigProps } from "./TransferCallToolConfig";

120
ui/src/app/tools/[toolUuid]/page.tsx
View file

@ -8,7 +8,7 @@ import {
getToolApiV1ToolsToolUuidGet,
updateToolApiV1ToolsToolUuidPut,
} from "@/client/sdk.gen";
import type { ToolResponse } from "@/client/types.gen";
import type { ToolResponse, TransferCallConfig as APITransferCallConfig } from "@/client/types.gen";
import { type HttpMethod, type KeyValueItem, type ToolParameter, validateUrl } from "@/components/http";
import { Button } from "@/components/ui/button";
import {
@ -29,7 +29,7 @@ import {
renderToolIcon,
type ToolCategory,
} from "../config";
import { EndCallToolConfig, HttpApiToolConfig } from "./components";
import { EndCallToolConfig, HttpApiToolConfig, TransferCallToolConfig } from "./components";
// Extended HttpApiConfig with parameters (until client types are regenerated)
interface HttpApiConfigWithParams {
@ -69,6 +69,12 @@ export default function ToolDetailPage() {
const [endCallMessageType, setEndCallMessageType] = useState<EndCallMessageType>("none");
const [endCallCustomMessage, setEndCallCustomMessage] = useState("");
// Transfer Call form state
const [transferDestination, setTransferDestination] = useState("");
const [transferMessageType, setTransferMessageType] = useState<EndCallMessageType>("none");
const [transferCustomMessage, setTransferCustomMessage] = useState("");
const [transferTimeout, setTransferTimeout] = useState(30);
// Redirect if not authenticated
useEffect(() => {
if (!loading && !user) {
@ -117,6 +123,20 @@ export default function ToolDetailPage() {
setEndCallMessageType("none");
setEndCallCustomMessage("");
}
} else if (tool.category === "transfer_call") {
// Populate transfer call specific fields
const config = tool.definition?.config as APITransferCallConfig | undefined;
if (config) {
setTransferDestination(config.destination || "");
setTransferMessageType(config.messageType || "none");
setTransferCustomMessage(config.customMessage || "");
setTransferTimeout(config.timeout ?? 30);
} else {
setTransferDestination("");
setTransferMessageType("none");
setTransferCustomMessage("");
setTransferTimeout(30);
}
} else {
// Populate HTTP API specific fields
const config = tool.definition?.config as HttpApiConfigWithParams | undefined;
@ -163,7 +183,14 @@ export default function ToolDetailPage() {
if (!tool) return;
// Validation based on tool type
if (tool.category !== "end_call") {
if (tool.category === "transfer_call") {
// Validate destination phone number for Transfer Call tools
const e164Pattern = /^\+[1-9]\d{1,14}$/;
if (!transferDestination || !e164Pattern.test(transferDestination)) {
setError("Please enter a valid phone number in E.164 format (e.g., +1234567890)");
return;
}
} else if (tool.category !== "end_call") {
// Validate URL for HTTP API tools
const urlValidation = validateUrl(url);
if (!urlValidation.valid) {
@ -201,6 +228,22 @@ export default function ToolDetailPage() {
},
},
};
} else if (tool.category === "transfer_call") {
// Build transfer call request body
requestBody = {
name,
description: description || undefined,
definition: {
schema_version: 1,
type: "transfer_call",
config: {
destination: transferDestination,
messageType: transferMessageType,
customMessage: transferMessageType === "custom" ? transferCustomMessage : undefined,
timeout: transferTimeout,
},
},
};
} else {
// Build HTTP API request body
const headersObject: Record<string, string> = {};
@ -331,6 +374,7 @@ const data = await response.json();`;
}
const isEndCallTool = tool.category === "end_call";
const isTransferCallTool = tool.category === "transfer_call";
const categoryConfig = getCategoryConfig(tool.category as ToolCategory);
return (
@ -366,7 +410,7 @@ const data = await response.json();`;
</div>
</div>
<div className="flex items-center gap-2">
{!isEndCallTool && (
{!isEndCallTool && !isTransferCallTool && (
<Button
variant="outline"
onClick={() => setShowCodeDialog(true)}
@ -375,34 +419,9 @@ const data = await response.json();`;
View Code
</Button>
)}
<Button onClick={handleSave} disabled={isSaving}>
{isSaving ? (
<>
<Loader2 className="w-4 h-4 mr-2 animate-spin" />
Saving...
</>
) : (
<>
<Save className="w-4 h-4 mr-2" />
Save
</>
)}
</Button>
</div>
</div>
{error && (
<div className="mb-4 p-4 bg-destructive/10 border border-destructive/20 rounded-lg text-destructive">
{error}
</div>
)}
{saveSuccess && (
<div className="mb-4 p-4 bg-green-500/10 border border-green-500/20 rounded-lg text-green-600">
Tool saved successfully!
</div>
)}
{isEndCallTool ? (
<EndCallToolConfig
name={name}
@ -414,6 +433,21 @@ const data = await response.json();`;
customMessage={endCallCustomMessage}
onCustomMessageChange={setEndCallCustomMessage}
/>
) : isTransferCallTool ? (
<TransferCallToolConfig
name={name}
onNameChange={setName}
description={description}
onDescriptionChange={setDescription}
destination={transferDestination}
onDestinationChange={setTransferDestination}
messageType={transferMessageType}
onMessageTypeChange={setTransferMessageType}
customMessage={transferCustomMessage}
onCustomMessageChange={setTransferCustomMessage}
timeout={transferTimeout}
onTimeoutChange={setTransferTimeout}
/>
) : (
<HttpApiToolConfig
name={name}
@ -434,6 +468,34 @@ const data = await response.json();`;
onTimeoutMsChange={setTimeoutMs}
/>
)}
{error && (
<div className="mt-4 p-4 bg-destructive/10 border border-destructive/20 rounded-lg text-destructive">
{error}
</div>
)}
{saveSuccess && (
<div className="mt-4 p-4 bg-green-500/10 border border-green-500/20 rounded-lg text-green-600">
Tool saved successfully!
</div>
)}
<div className="flex justify-end mt-6">
<Button onClick={handleSave} disabled={isSaving}>
{isSaving ? (
<>
<Loader2 className="w-4 h-4 mr-2 animate-spin" />
Saving...
</>
) : (
<>
<Save className="w-4 h-4 mr-2" />
Save
</>
)}
</Button>
</div>
</div>
</div>

51
ui/src/app/tools/config.tsx
View file

@ -1,9 +1,9 @@
"use client";
import { Cog, Globe, type LucideIcon,PhoneOff, Puzzle } from "lucide-react";
import { Cog, Globe, type LucideIcon, PhoneForwarded, PhoneOff, Puzzle } from "lucide-react";
import { type ReactNode } from "react";
export type ToolCategory = "http_api" | "end_call" | "native" | "integration";
export type ToolCategory = "http_api" | "end_call" | "transfer_call" | "native" | "integration";
export type EndCallMessageType = "none" | "custom";
@ -42,6 +42,18 @@ export const TOOL_CATEGORIES: ToolCategoryConfig[] = [
description: "End the call when either user asks to disconnect the call, or when you believe its time to end the conversation",
},
},
{
value: "transfer_call",
label: "Transfer Call",
description: "Transfer the call to another phone number (Twilio only)",
icon: PhoneForwarded,
iconName: "phone-forwarded",
iconColor: "#10B981",
autoFill: {
name: "Transfer Call",
description: "Transfer the caller to another phone number when requested",
},
},
{
value: "native",
label: "Native (Coming Soon)",
@ -85,6 +97,8 @@ export function getToolTypeLabel(category: string): string {
switch (category) {
case "end_call":
return "End Call Tool";
case "transfer_call":
return "Transfer Call Tool";
case "http_api":
return "HTTP API Tool";
case "native":
@ -107,6 +121,21 @@ export const DEFAULT_END_CALL_CONFIG: EndCallConfig = {
customMessage: "",
};
// Transfer Call tool specific configuration
export interface TransferCallConfig {
destination: string;
messageType: EndCallMessageType; // Reuse the same type
customMessage?: string;
timeout: number;
}
export const DEFAULT_TRANSFER_CALL_CONFIG: TransferCallConfig = {
destination: "",
messageType: "none",
customMessage: "",
timeout: 30,
};
// Tool definition types for different categories
export interface HttpApiToolDefinition {
schema_version: number;
@ -132,7 +161,13 @@ export interface EndCallToolDefinition {
config: EndCallConfig;
}
export type ToolDefinition = HttpApiToolDefinition | EndCallToolDefinition;
export interface TransferCallToolDefinition {
schema_version: number;
type: "transfer_call";
config: TransferCallConfig;
}
export type ToolDefinition = HttpApiToolDefinition | EndCallToolDefinition | TransferCallToolDefinition;
export function createEndCallDefinition(config: EndCallConfig): EndCallToolDefinition {
return {
@ -142,6 +177,14 @@ export function createEndCallDefinition(config: EndCallConfig): EndCallToolDefin
};
}
export function createTransferCallDefinition(config: TransferCallConfig): TransferCallToolDefinition {
return {
schema_version: 1,
type: "transfer_call",
config,
};
}
export function createHttpApiDefinition(): HttpApiToolDefinition {
return {
schema_version: 1,
@ -157,6 +200,8 @@ export function createToolDefinition(category: ToolCategory): ToolDefinition {
switch (category) {
case "end_call":
return createEndCallDefinition(DEFAULT_END_CALL_CONFIG);
case "transfer_call":
return createTransferCallDefinition(DEFAULT_TRANSFER_CALL_CONFIG);
case "http_api":
default:
return createHttpApiDefinition();

34
ui/src/client/sdk.gen.ts
View file

File diff suppressed because one or more lines are too long

115
ui/src/client/types.gen.ts
View file

@ -259,7 +259,9 @@ export type CreateToolRequest = {
type?: 'http_api';
} & HttpApiToolDefinition) | ({
type?: 'end_call';
} & EndCallToolDefinition);
} & EndCallToolDefinition) | ({
type?: 'transfer_call';
} & TransferCallToolDefinition);
};
export type CreateWorkflowRequest = {
@ -857,6 +859,57 @@ export type ToolResponse = {
created_by?: CreatedByResponse | null;
};
/**
* Configuration for Transfer Call tools.
*/
export type TransferCallConfig = {
/**
* Phone number to transfer the call to (E.164 format, e.g., +1234567890)
*/
destination: string;
/**
* Type of message to play before transfer
*/
messageType?: 'none' | 'custom';
/**
* Custom message to play before transferring the call
*/
customMessage?: string | null;
/**
* Maximum time in seconds to wait for destination to answer (5-120 seconds)
*/
timeout?: number;
};
/**
* Request model for initiating a call transfer.
*/
export type TransferCallRequest = {
destination: string;
organization_id: number;
transfer_id: string;
conference_name: string;
timeout?: number | null;
};
/**
* Tool definition for Transfer Call tools.
*/
export type TransferCallToolDefinition = {
/**
* Schema version
*/
schema_version?: number;
/**
* Tool type
*/
type: 'transfer_call';
/**
* Transfer Call configuration
*/
config: TransferCallConfig;
};
/**
* Request model for triggering a call via API
*/
@ -945,7 +998,9 @@ export type UpdateToolRequest = {
type?: 'http_api';
} & HttpApiToolDefinition) | ({
type?: 'end_call';
} & EndCallToolDefinition)) | null;
} & EndCallToolDefinition) | ({
type?: 'transfer_call';
} & TransferCallToolDefinition)) | null;
status?: string | null;
};
@ -1527,6 +1582,62 @@ export type HandleCloudonixCdrApiV1TelephonyCloudonixCdrPostResponses = {
200: unknown;
};
export type InitiateCallTransferApiV1TelephonyCallTransferPostData = {
body: TransferCallRequest;
path?: never;
query?: never;
url: '/api/v1/telephony/call-transfer';
};
export type InitiateCallTransferApiV1TelephonyCallTransferPostErrors = {
/**
* Not found
*/
404: unknown;
/**
* Validation Error
*/
422: HttpValidationError;
};
export type InitiateCallTransferApiV1TelephonyCallTransferPostError = InitiateCallTransferApiV1TelephonyCallTransferPostErrors[keyof InitiateCallTransferApiV1TelephonyCallTransferPostErrors];
export type InitiateCallTransferApiV1TelephonyCallTransferPostResponses = {
/**
* Successful Response
*/
200: unknown;
};
export type CompleteTransferFunctionCallApiV1TelephonyTransferResultTransferIdPostData = {
body?: never;
path: {
transfer_id: string;
};
query?: never;
url: '/api/v1/telephony/transfer-result/{transfer_id}';
};
export type CompleteTransferFunctionCallApiV1TelephonyTransferResultTransferIdPostErrors = {
/**
* Not found
*/
404: unknown;
/**
* Validation Error
*/
422: HttpValidationError;
};
export type CompleteTransferFunctionCallApiV1TelephonyTransferResultTransferIdPostError = CompleteTransferFunctionCallApiV1TelephonyTransferResultTransferIdPostErrors[keyof CompleteTransferFunctionCallApiV1TelephonyTransferResultTransferIdPostErrors];
export type CompleteTransferFunctionCallApiV1TelephonyTransferResultTransferIdPostResponses = {
/**
* Successful Response
*/
200: unknown;
};
export type ImpersonateApiV1SuperuserImpersonatePostData = {
body: ImpersonateRequest;
headers?: {