Enable Guidance Panel and Orchestration Subviews and Test the Runtime

Orchestration steps that require salespeople to act appear on the Guidance panel in your Sales object overview pages. Orchestration creates tasks and appointments to support manual steps as well. The guidance panel gets displayed only if there's an active orchestration running on specific records.

Follow these steps to enable the guidance panel and subview for your Agreements custom object. Start by creating a variable for the Agreements detail page as follows:

In Visual Builder Studio, click the App UIs tab.
Expand cx-custom > agreements_c, then click the agreements_c-detail node.
On the agreements_c-detail tab, click the Variables subtab.
Click + Variable.
In the Create Variable dialog, make sure the Variable option is selected and, in the ID field, enter orchPanelPollingAttributes.
In the Type field, select Object.
Click Create and create the following fields.
1. orchPanelNumberOfPolls of Type Number
2. orchPanelPollIntervals of Type Number
3. orchPanelPollStartAfter of Type Number

Provide default values as shown for the orchPanelPollingAttributes variable

{
    "orchPanelNumberOfPolls": 5,
    "orchPanelPollIntervals": 1,
    "orchPanelPollStartAfter": 2
}

On the agreements_c-detail tab, click the Page Designer subtab.
Click the Code button.

Select the Templates tab and add the Orchestration Guidance Panel Template for the guidance panel as follows:

<template id="orchestrationPanelTemplate">
  <oj-bind-if test="[[ $functions.isOrchestrationOptedIn() === true && $variables.isOrchestrationAssociated === true ]]">
    <oj-vb-fragment name="oracle_cx_fragmentsUI:cx-orchestration" bridge="[[ vbBridge ]]" class="oj-flex oj-sp-foldout-layout-panel">
      <oj-vb-fragment-param name="resource"
        value="[[ { 'name': 'Agreements_c', 'endpoint': 'custom', 'id': $page.variables.id, 'puid': $page.variables.puid } ]]">
      </oj-vb-fragment-param>
      <oj-vb-fragment-param name="extensionId" value="[[ $application.constants.extensionId ]]"></oj-vb-fragment-param>
      <oj-vb-fragment-param name="style" value="[[ 'panel' ]]"></oj-vb-fragment-param>
      <oj-vb-fragment-param name="orchPanelNumberOfPolls"
        value="[[ $application.constants.orchPanelPollingAttributes.orchPanelNumberOfPolls ]]"></oj-vb-fragment-param>
      <oj-vb-fragment-param name="orchPanelPollIntervals"
        value="[[ $application.constants.orchPanelPollingAttributes.orchPanelPollIntervals ]]"></oj-vb-fragment-param>
      <oj-vb-fragment-param name="orchPanelPollStartAfter"
        value="[[ $application.constants.orchPanelPollingAttributes.orchPanelPollStartAfter ]]"></oj-vb-fragment-param>
      <oj-vb-fragment-param name="isOrchestrationAssociated" value="{{ $variables.isOrchestrationAssociated }}">
      </oj-vb-fragment-param>
    </oj-vb-fragment>
  </oj-bind-if>
</template>

Add the Orchestration Guidance Subview Template and templates for the guidance subview as follows:

<template id="orchestrationSubviewTemplate">
  <oj-bind-if test="[[ $functions.isOrchestrationOptedIn() === true && $variables.isOrchestrationAssociated === true ]]">
    <oj-vb-fragment name="oracle_cx_fragmentsUI:cx-orchestration" bridge="[[ vbBridge ]]">
      <oj-vb-fragment-param name="resource"
        value="[[ { 'name': 'Agreements_c', 'endpoint': 'custom', 'id': $page.variables.id, 'puid': $page.variables.puid } ]]">
      </oj-vb-fragment-param>
      <oj-vb-fragment-param name="extensionId" value="[[ $application.constants.extensionId ]]"></oj-vb-fragment-param>
      <oj-vb-fragment-param name="style" value="[[ 'subview' ]]"></oj-vb-fragment-param>
    </oj-vb-fragment>
  </oj-bind-if>
</template>

Add the following parameter to the cx-detail code.

<oj-vb-fragment-param name="resource" value="[[ { 'name': 'Agreements_c', 'endpoint': 'custom', 'id': $page.variables.id, 'puid': $page.variables.puid } ]]">

Note:
The resource name must be the custom object name for which the files were generated.
Next, click the JSON tab and search for PanelsContainerLayout.

After displayProperties, add the entry for the orchestration panel to make it available in the foldout page. Also after the sectionTemplateMap, provide the orchestrationPanel template ID.

PanelsContainerLayout Example

"PanelsContainerLayout": {
      "label": "Container Rule Set 1",
      "layoutType": "container",
      "layouts": {
        "case1": {
          "label": "Case 1",
          "layoutType": "container",
          "layout": {
            "displayProperties": [
              "orchestrations",
              "AgreementContacts_Src_Agreements_cToAgreementContacts_c_Tgt",
              "Note"
            ],
            "sectionTemplateMap": {
              "AgreementContacts_Src_Agreements_cToAgreementContacts_c_Tgt": "AgreementContacts_Src_Agreements_cToAgreementContacts_c_TgtPanelTemplate",
              "Attachment": "AttachmentPanelTemplate",
              "Note": "NotePanelTemplate",
              "orchestrations": "orchestrationPanelTemplate",
              "Resource": "AgreementResource_Src_Agreements_cToAgreementResource_c_TgtPanelTemplate"
            }
          }
        }
      },
      "rules": [
        "PanelsContainerLayout-rule1"
      ]
    }

Similar to the PanelsContainerLayout example, search for SubviewContainerLayout.

After displayProperties, add the entry for the orchestration subview. Also, after the sectionTemplateMap, provide the orchestration subview template ID.

SubviewContainerLayout Example

"SubviewContainerLayout": {
      "label": "Container Rule Set 1",
      "layoutType": "container",
      "layouts": {
        "case1": {
          "label": "Case 1",
          "layoutType": "container",
          "layout": {
            "sectionTemplateMap": {
              "AgreementContacts_Src_Agreements_cToAgreementContacts_c_Tgt": "AgreementContacts_Src_Agreements_cToAgreementContacts_c_Tgt",
              "Note": "Note",
              "orchestrations": "orchestrationSubviewTemplate"
            },
            "displayProperties": [
              "orchestrations",
              "AgreementContacts_Src_Agreements_cToAgreementContacts_c_Tgt",
              "Attachment",
              "Note"
            ]
          }
        }
      },
      "rules": [
        "SubviewContainerLayout-rule1"
      ]
    }

Click the JavaScript tab and add the following code snippet to check if the orchestration is opted in.

customobject_c-detail-page.js

define(['vx/oracle_cx_salesUI/ui/self/applications/cx-sales/resources/utils/CrmCommonUtils'], (CrmCommonUtils) => {
  'use strict';
 
  class PageModule {
 
    constructor(context) {
      // default intialize..
      this.eventHelper = context.getEventHelper();
    };
 
    /**
     * function to check if orchestration opted in.
     */
    isOrchestrationOptedIn() {
      const isOrchestrationEnabled = CrmCommonUtils.getProfileValue(this.profileOptions, 'ORA_ZCA_ENABLE_ORCHESTRATION');
      const isFunctionalPrivilegeEnabled = cxcore?.utils?.userInfo?.getPermissions()?.includes('ZCA_VIEW_SALES_ORCHESTRATION_PRIV');
      return (isOrchestrationEnabled !== "N" && isFunctionalPrivilegeEnabled == true);
    };
  }
   
  return PageModule;
});

Confirm that the Gruntfile.js has the following code after the vb-require-bundle entry. "vx/oracle_cx_fragmentsUI/ui/self/resources/js/utils/callbackHelper"
Test the runtime using these high-level steps:
1. Create an Agreements custom object record and populate the attributes used in the Orchestration's Condition field to automate the associated orchestration.
2. Navigate to the record of the Agreements foldout page and the associated Guidance panel.
3. From the Guidance panel, click the View All Objectives link to go to the Orchestration subview.