Slawomir Malota (SlawomirMalota)
Senior Manager, Engineering
Pegasystems Inc.
SlawomirMalota Member since 2014 1 post
Posted: 6 days 8 hours ago
Last activity: 6 days 4 hours ago
Posted: 9 Jun 2021 4:02 EDT
Last activity: 9 Jun 2021 8:22 EDT

Preview panel changes in 8.6 and migration guide

In version 8.6 some changes in the preview panel were introduced. This article describes the main changes in the Theme-Cosmos ruleset and provides migration steps in case you have overridden some of these rules.  


Main changes include:

  • moving action buttons to the blue case header
  • aligning actions and "follow star" to the header top row
  • adding assignment list to preview panel
  • separate summary panel and case details in preview
  • add Current stage to the summary panel - displayed only in preview


Overview of changes in preview panel  

Adoption guide

Typical adoption changes include:

    1. pyCasePreviewDetails - if you have overridden this section

  • remove "Case Action Header" section (actions are moved to the blue header in preview panel)
  • add "Assignments list" section displayed conditionally based on "pyShowToDoWidget" when rule
  • change "Case details" section to use "Default" container format and add header to it with "Summary" value

    2.  CaseHeader - if you added custom actions to case header

  • copy those actions also to the new region "Preview case header actions" to be available in the preview panel 

    3.  EditAcitonIcon - if you have overridden EditAction section with some custom edit actions

  • copy EditAction section replacing buttons with icons to be placed on case preview header



In case you overrode the following sections in your application, you have to make sure that changes applied to Theme-Cosmos based rule are also ported to your version. You may also consider removing the override in case it is not needed anymore.  

Section name Purpose                     Summary of changes
pxCaseHeader template section used for CaseHeader
  • “Follow star” and additional actions copied to the top of the section, displayed conditionally in preview panel context.
  • Introduced region for "preview case header actions" after the “follow star” in preview panel.
CaseHeader Case header and preview panel tabs
  • “EditActionIcon”,  “AdditionalPreviewActions”, and "three dot menu" sections added to "preview case header actions" region
  • Removed “preview-details” style class applied to “Case Preview Details” section
  • Renamed tab “Details” -> “Overview”
EditActionIcon equivalent of EditAction section used in summary panel but displaying icon instead of button Section used in CaseHeader to display preview panel “pencil” icon
AdditionalPreviewActions extension point to be used for different case types to add more actions to preview panel (placed before “follow star”) – for example “download” for documents  
pxCaseDetails Case Details UI Template
  • Removed description with “read more” link
  • Added “Stage” section to show current stage on the preview panel
  • Added new parameter to conditionally hide "stage" info
  • Rename tab “Pulse” - > “Activity”
pyToDoItem content of worklist item   
  • added another "Go" button to be used on preview panel with different actions (opening assignment in modal)
pyCasePreviewDetails content of preview panel “Overview” tab
  • Added assignment list
  • Separate case details “summary” and case information “Details”
  • Container format "Default" applied to all sections
  • Header added to all sections 



***Edited by Moderator: Pooja Gadige to add Developer Knowledge Share tag***
Pega Platform 8.6 User Experience Front-End Developer Developer Knowledge Share Upgrade