WrapUp Synchronization

For details about wrapUp and availability in startComm and closeComm, see the getWrapupContext section.

Different suppliers implement the WrapUp UI in the media toolbar and Fusion Service based on their specific use cases. To ensure consistency, agents need to update both the media toolbar Wrap Up and the Fusion service Wrap Up to reflect the same value in both locations. In such cases, agents must perform the same actions in both UIs to update the data. The following examples show how to optimize this process. With UEF, agents can carry out the operation in one UI, and the action are automatically propagated to the other Wrap Up through Wrap Up synchronization.

Here are some use cases:

  • To detect the change in Wrapup from the external Toolbar, use the Field value change event.
  • To set a value to a particular field in Wrapup from the external toolbar, use the Set Field Value operation.
  • To get a value to a particular field from external toolbar, use the Get Field Value operation.
  • To save wrapUp from external toolbar, use the Save operation.
  • To find save completed after successfully saving a wrapUp use OnAfter save event.
  • To get complete control on the save event from external Toolbar, use the OnBeforeSave Event.

Get WrapUp Context from StartComm

Here's a Typescript example:

const uiEventsFrameworkInstance: IUiEventsFrameworkProvider = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
        const multiChannelAdaptorContext: IMultiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
        const phoneContext: IPhoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
        const request: IMcaStartCommEventActionRequest = uiEventsFrameworkInstance.requestHelper.createPublishRequest('startCommEvent') as IMcaStartCommEventActionRequest;
        request.setAppClassification('self.appClassfication');
        request.getInData().setChannelId('');
        const response: IMcaStartComActionResponse = await phoneContext.publish(request) as IMcaStartComActionResponse;
        const engagementContext: IEngagementContext = response.getResponseData().getEngagementContext();
        const wrapUpRecordContext: IRecordContext = await engagementContext.getWrapupContext();

Here's a JavaScript example:

const uiEventsFrameworkInstance = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
        const multiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
        const phoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
        const request = uiEventsFrameworkInstance.requestHelper.createPublishRequest('startCommEvent');
        request.setAppClassification('self.appClassfication');
        request.getInData().setChannelId('');
        const response = await phoneContext.publish(request) as IMcaStartComActionResponse;
        const engagementContext = response.getResponseData().getEngagementContext();
        const wrapUpRecordContext = await engagementContext.getWrapupContext();

Get WrapUp Context from CloseComm

Here's a Typescript example:

/// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance: IUiEventsFrameworkProvider = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext: IMultiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext: IPhoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request: IMcaCloseCommEventActionRequest = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent') as IMcaCloseCommEventActionRequest;
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response: IMcaCloseComActionResponse = await phoneContext.publish(request) as IMcaCloseComActionResponse;
	const engagementContext: IEngagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext: IRecordContext = await engagementContext.getWrapupContext();

Here's a JavaScript example:

 const uiEventsFrameworkInstance = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent');
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response = await phoneContext.publish(request);
	const engagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext = await engagementContext.getWrapupContext();

Set Field value operation

Outcome (WrapUp.ResolutionCd) and Notes (WrapUp.CallNotes) are default fields in WrapUp, as shown in the following examples. Using Visual Basic (VB), you can configure the WrapUp UI. In addition to default fields, customers can also incorporate custom fields into the UI. Any field, whether default or custom, that's added to the UI can also be used with the APIs shown in the following examples.

Here's a Typescript example showing how to get WrapUpRecordContext from CloseComm and perform the set field value operation in wrapup:

/// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance: IUiEventsFrameworkProvider = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext: IMultiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext: IPhoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request: IMcaCloseCommEventActionRequest = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent') as IMcaCloseCommEventActionRequest;
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response: IMcaCloseComActionResponse = await phoneContext.publish(request) as IMcaCloseComActionResponse;
	const engagementContext: IEngagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext: IRecordContext = await engagementContext.getWrapupContext();
    const requestObject: ISetFieldValueOperationRequest = (uiEventsFrameworkInstance.requestHelper.createPublishRequest('cxEventBusSetFieldValueOperation') as ISetFieldValueOperationRequest);
    requestObject.field().setValue('WrapUp.ResolutionCd', 'ORA_SVC_DS_POSITIVE_OUTCOME');
    requestObject.field().setValue('WrapUp.CallNotes', 'New Description');
    wrapUpRecordContext.publish(requestObject).then((message) => {
        const response = message as ISetFieldValueResponse;
        // custom code
    }).catch((error: IErrorData) => {
        // custom code
    });

Here's a JavaScript example showing how to get WrapUpRecordContext from CloseComm and perform set field value operation in wrapup:

 /// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent');
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response = await phoneContext.publish(request);
	const engagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext = await engagementContext.getWrapupContext();
    const requestObject = uiEventsFrameworkInstance.requestHelper.createPublishRequest('cxEventBusSetFieldValueOperation');
    requestObject.field().setValue('WrapUp.ResolutionCd', 'ORA_SVC_DS_POSITIVE_OUTCOME');
    requestObject.field().setValue('WrapUp.CallNotes', 'New Description');
    wrapUpRecordContext.publish(requestObject).then((message) => {
        const response = message;
        // custom code
    }).catch((error) => {
        // custom code
    });

Get Field value operation

Outcome (WrapUp.ResolutionCd) and Notes (WrapUp.CallNotes) are default fields in WrapUp, as shown in the following examples. Using Visual Basic (VB), you can configure the WrapUp UI. In addition to default fields, customers can also incorporate custom fields into the UI. Any field, whether default or custom, that's added to the UI can also be used with the APIs shown in the following examples.

Here's a Typescript example showing how to get WrapUpRecordContext from CloseComm and perform the get field value operation in wrapup:

/// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance: IUiEventsFrameworkProvider = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext: IMultiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext: IPhoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request: IMcaCloseCommEventActionRequest = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent') as IMcaCloseCommEventActionRequest;
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response: IMcaCloseComActionResponse = await phoneContext.publish(request) as IMcaCloseComActionResponse;
	const engagementContext: IEngagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext: IRecordContext = await engagementContext.getWrapupContext();
    const requestObject: IGetFieldValueOperationRequest = (uiEventsFrameworkInstance.requestHelper.createPublishRequest('cxEventBusGetFieldValueOperation') as IGetFieldValueOperationRequest);
    requestObject.setFields(['WrapUp.ResolutionCd', 'WrapUp.CallNotes']);
    wrapUpRecordContext.publish(requestObject).then((message) => {
        const response = message as ISetFieldValueResponse;
        // custom code
    }).catch((error: IErrorData) => {
        // custom code
    });

Here's a JavaScript example showing how to get WrapUpRecordContext from CloseComm and perform set field value operation in wrapup:

 /// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent');
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response = await phoneContext.publish(request);
	const engagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext = await engagementContext.getWrapupContext();
    const requestObject = uiEventsFrameworkInstance.requestHelper.createPublishRequest('cxEventBusGetFieldValueOperation');
    requestObject.setFields(['WrapUp.ResolutionCd', 'WrapUp.CallNotes']);
    wrapUpRecordContext.publish(requestObject).then((message) => {
        const response = message;
        // custom code
    }).catch((error) => {
        // custom code
    });

Save operation

Here's a Typescript example of how to get WrapUpRecordContext from CloseComm and perform save operation in wrapup:

/// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance: IUiEventsFrameworkProvider = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext: IMultiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext: IPhoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request: IMcaCloseCommEventActionRequest = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent') as IMcaCloseCommEventActionRequest;
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response: IMcaCloseComActionResponse = await phoneContext.publish(request) as IMcaCloseComActionResponse;
	const engagementContext: IEngagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext: IRecordContext = await engagementContext.getWrapupContext();
    const requestObject: IOperationRequest = (uiEventsFrameworkInstance.requestHelper.createPublishRequest('cxEventBusSaveRecordOperation') as IOperationRequest);
    wrapUpRecordContext.publish(requestObject).then((message) => {
        const response = message as ISetFieldValueResponse;
        // custom code
    }).catch((error: IErrorData) => {
        // custom code
    });

Here's a JavaScript example of how to get WrapUpRecordContext from CloseComm and perform save operation in wrapup:

/// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent');
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response = await phoneContext.publish(request);
	const engagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext = await engagementContext.getWrapupContext();
    const requestObject = uiEventsFrameworkInstance.requestHelper.createPublishRequest('cxEventBusSaveRecordOperation');
    wrapUpRecordContext.publish(requestObject).then((message) => {
        const response = message;
        // custom code
    }).catch((error) => {
        // custom code
    });

Field value change event

Outcome (WrapUp.ResolutionCd) and Notes (WrapUp.CallNotes) are default fields in WrapUp, as shown in the following examples. Using Visual Basic (VB), you can configure the WrapUp UI. In addition to default fields, customers can also incorporate custom fields into the UI. Any field, whether default or custom, that's added to the UI can also be used with the APIs shown in the following examples.

Here's a Typescript example showing how to get WrapUpRecordContext from CloseComm and perform the subscribe field value change event from wrapup:

/// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance: IUiEventsFrameworkProvider = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext: IMultiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext: IPhoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request: IMcaCloseCommEventActionRequest = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent') as IMcaCloseCommEventActionRequest;
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response: IMcaCloseComActionResponse = await phoneContext.publish(request) as IMcaCloseComActionResponse;
	const engagementContext: IEngagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext: IRecordContext = await engagementContext.getWrapupContext();
    const requestObject: IFieldValueChangeEventRequest = uiEventsFrameworkInstance.requestHelper.createSubscriptionRequest('cxEventBusFieldValueChangeEvent') as IFieldValueChangeEventRequest;
    requestObject.setFields(['WrapUp.ResolutionCd', 'WrapUp.CallNotes']);
    wrapUpRecordContext.subscribe(requestObject, (message: IEventResponse) => {
        const response = message as IFieldValueChangeEventResponse;
        const fieldName: string = response.getResponseData().getFieldName();
        const newValue: string | boolean | number = response.getResponseData().getNewValue();
        const oldValue: string | boolean | number = response.getResponseData().getOldValue();
    });

Here's a JavaScript example showing how to get WrapUpRecordContext from CloseComm and perform the subscribe field value change event from wrapup:

const uiEventsFrameworkInstance = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent');
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response = await phoneContext.publish(request) as IMcaCloseComActionResponse;
	const engagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext = await engagementContext.getWrapupContext();
    const requestObject = uiEventsFrameworkInstance.requestHelper.createSubscriptionRequest('cxEventBusFieldValueChangeEvent');
    requestObject.setFields(['WrapUp.ResolutionCd', 'WrapUp.CallNotes']);
    wrapUpRecordContext.subscribe(requestObject, (response) => {
        const fieldName = response.getResponseData().getFieldName();
        const newValue = response.getResponseData().getNewValue();
        const oldValue = response.getResponseData().getOldValue();
    });

OnAfter Save event

Here's a Typescript example showing how to get WrapUpRecordContext from CloseComm and perform the subscribe onAfter change event from wrapup:

/// <reference path="uiEventsFramework.d.ts"/>     
const uiEventsFrameworkInstance: IUiEventsFrameworkProvider = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext: IMultiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext: IPhoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request: IMcaCloseCommEventActionRequest = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent') as IMcaCloseCommEventActionRequest;
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response: IMcaCloseComActionResponse = await phoneContext.publish(request) as IMcaCloseComActionResponse;
	const engagementContext: IEngagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext: IRecordContext = await engagementContext.getWrapupContext();
    const requestObject: IEventRequest = uiEventsFrameworkInstance.requestHelper.createSubscriptionRequest('cxEventBusOnAfterSaveEvent') as IEventRequest;
    wrapUpRecordContext.subscribe(requestObject, (message) => {
        const oldObjectId: string = response.getResponseData().getOldObjectId();
        const newObjectId: string = response.getResponseData().getObjectId();
        const objectType: string = response.getResponseData().getObjectType();
    });

Here's a JavaScript example showing how to get WrapUpRecordContext from CloseComm and perform the subscribe onAfter change event from wrapup:

const uiEventsFrameworkInstance = await CX_SVC_UI_EVENTS_FRAMEWORK.uiEventsFramework.initialize('appname', 'v1');
    const multiChannelAdaptorContext = await uiEventsFrameworkInstance.getMultiChannelAdaptorContext();
    const phoneContext = await multiChannelAdaptorContext.getCommunicationChannelContext('PHONE');
    const request = uiEventsFrameworkInstance.requestHelper.createPublishRequest('closeCommEvent');
    request.setAppClassification('appClassfication');
    request.setInputData({eventId: 'id'}); //input data and required details
    request.setReason('WRAPUP'); 
    const inData = request.getInData();
	const response = await phoneContext.publish(request);
	const engagementContext = response.getResponseData().getEngagementContext();
	const wrapUpRecordContext = await engagementContext.getWrapupContext();
    const requestObject = uiEventsFrameworkInstance.requestHelper.createSubscriptionRequest('cxEventBusOnAfterSaveEvent');
    wrapUpRecordContext.subscribe(requestObject, (message) => {
        const oldObjectId = response.getResponseData().getOldObjectId();
        const newObjectId = response.getResponseData().getObjectId();
        const objectType = response.getResponseData().getObjectType();
    });