twilio-cti-flex
A javascript library
Projects in this solution:
-
twilio-cti
- expose flex part for integration
FLEX:
- Code sample for flex plugin integration
import { Flex as F, Method, Channel, MessageStatus, TaskType, TaskDirection, mapAgentFromWorker } from "twilio-cti";
// logger
const logger = {
debug: (...args: any[]) => console.log('log', ...args)
};
try {
const f = new F('https://local-crm.twilio-cti.com', logger);
f
.on(Method.SUBSCRIBE, (data: any) => {
const state = manager.store.getState();
// Handle callback for agent subscription
if(data.channel === Channel.AGENT) {
const agent = mapAgentFromWorker(state.flex.worker);
f.invokeApiCall({
method: Method.CALLBACK,
channel: data.channel,
id: data.id,
attributes: agent,
status: MessageStatus.SUCCESS
});
}
})
.on(Method.PUBLISH, (data: any) => {
// Catch task publish message to make outboud call
if(data.channel === Channel.TASK) {
if(data.attributes.type === TaskType.CALL && data.attributes.direction === TaskDirection.OUTBOUND) {
// Callback message
const message = {
method: Method.CALLBACK,
channel: data.channel,
id: data.id,
attributes: data.attributes
}
makeCall(data.attributes.attributes.to)
.then(() => {
message.status = MessageStatus.SUCCESS;
f.invokeApiCall(message);
})
.catch((error: any) => {
message.status = MessageStatus.ERROR;
f.invokeApiCall(message);
});
}
}
});
}
catch (error) {
console.log(error);
}
flex will also be exposed on window.twilio.flex
import { combineReducers } from "redux";
// Combine the reducers
export default combineReducers({
crm: (state = {}, action: any) => {
return (window as any).twilio?.flex?.reduce(state, action) ?? state;
},
});