twiliotwilio-apitwilio-click-to-calltwilio-flextwilio-taskrouter

How to connect agent to a Twilio outbound call before the customer?


I'm trying to setup a seamless outbound calling experience for a Twilio Flex setup. I have the dialpad outbound as well as a callback feature from previously delivered callback/voicemail request tasks (agent can accept the task and make an outbound within).

I am making the call via deployed Twilio function and it looks like this:

client.calls
            .create({
                url: callHandlerCallbackURL, // to another Twilio function
                to: event.To,
                from: event.From,
                statusCallback: statusCallbackURL,
                statusCallbackEvent: ["ringing", "answered", "completed"]
            })

When the call is connected, Twilio makes a call to another function which is provided through the url property above. Within that function, I enqueue the call with some task attributes and it looks like this:

let twiml = new Twilio.twiml.VoiceResponse();
let enqueue = twiml.enqueue({
    workflowSid: `${context.TWILIO_WORKFLOW_SID}`, 
    waitUrl: ''
});
enqueue.task(JSON.stringify(taskAttributes));
callback(null, twiml);

But the problem is the task comes in to Flex (to the agent) after the call is answered and this causes agent to miss a couple of seconds from the call. So, the customer opens the phone, starts speaking, but there is no one on the other side for a while.

Is there a straight-forward way to prevent this from happening?


Solution

  • I was able to resolve this by using a built-in action in Flex called StartOutboundCall.

    With this action, the agent is transferred to the call canvas before the call starts and is already in the call before the customer answers. Overall, this is a much more "natural" flow to start an outbound call and prevents the confusion I mentioned above.

    It is also simpler as you can start an outbound call with a couple of lines of code:

    function clickToDial(destinationNumber) {
      Flex.Actions.invokeAction("StartOutboundCall", {
        destination: destinationNumber
      });
    }
    

    You can find more information here: https://www.twilio.com/docs/flex/developer/voice/dialpad-click-to-dial#the-outbound-call-action-1