1. How do I use the UI Events Framework?
  2. Extend the Fusion Application Side Pane

Extend the Fusion Application Side Pane

The Fusion application includes an extensible variable called sidePaneButtons. in service center, This enables you to extend the sidePane buttons by assigning their desired sidePane icons to this variable .This variable is an array, of type SidePaneIconProperties. SidePaneIconProperties

"SidePaneIconProperties": { 
    "ariaText": "string", 
    "icon": "string", 
    "label": "string", 
    "sectionId": "string", 
    "tooltip": "string", 
    "visibility": "boolean", 
    "buttonId": "string" 
}
You can attach sections to these newly created sidePane icons by creating sections in the extensible dynamic container available in container-page of the Fusion application.
Note: The sectionId that you create section must match the sectionId you provide in the sidePaneButtons variable value.

Overview of steps to create a SidePane icon named UEF and MCA

To enable the Side Pane, set the isRightPanelCustomisationEnabled variable to TRUE in the container. This enables the basic side pane.

To enable the advanced Side Pane, set the showAdvancedSidePane variable to TRUE in the container page, along with enabling the isRightPanelCustomisationEnabled variable.
  1. In to VB Studio add an array of the Sidepane icon to the SidepaneButtons variable in the container page.

    The workspace in VB studio

  2. Create a new event listener from container page.

    Where you define the event listener

  3. Create a new action chain. We're using VBEnter in this example.

    Creating the action chain.

  4. Create a new action chain for the event listener.

    Creating the new action chain for the event listener.

  5. Add a function and assign a variable to the action chain.

    Adding the function.

    Creating the variable.

  6. Note how the getSidepaneData function returns the sidepane details list.

    Creating the function.

  7. Use the Assign Variables screen to assign result of getSidepaneData function to the SidepaneButtons variable.

    Assigning variables.

  8. To add content to each sidepane item, click the Container rule set 1 from the Page Designer of the container page.

    Adding content to the item.

  9. Now create a new case.

    Creating a new case.

  10. Create a new section from the newly created case.

    Creating a new section for the case.

  11. Create a new section called UEF for the UI Events Container.

    Creating a new section called UEF.

  12. Create two new sections for UEF and MCA.

    Creating another new section.

  13. Click the newly created section and add content from each of the sections.

    Adding content to the new section.