How to enable Tab based Multi Document using Dynamic Container in Pega 8

[KenshoTsuchihashi]

Hi,

Some customer prefers Tab based Multi Document (*), especially people who have used very old version like PRPC 6x because that was the Pega’s default at that time. It is not a recommended approach any longer for maintainability perspectives, but in this post I am sharing how to get it back in case customer really wants it, or for some other unusual reasons. In our case, we used this solution for fixing UI issues with Snap Start (https://collaborate.pega.com/discussion/how-fix-ui-issues-use-snap-start).

• This entire article is limited to the use of UIKit. From 8.6, Cosmos started to support multiple tabs - now you can open multiple cases simultaneously in separate browser tabs or windows, without one session refreshing and overriding the other. Be noted Cosmos in combination of prior version (8.3 - 8.5) does not support this functionality. It has to be 8.6+.

1. Locate Data-Portal.pyCaseManager7 section rule and override it to your ruleset.

2. Place a Tab Group layout. If you are on Pega 7, you can find “Legacy tabs” in Layout dropdown.

3. If you are on Pega 8, unfortunately you won’t see “Legacy tabs”. Then you’ll need to find an out-of-the-box section that has it. In this example I am using 8.4.1 and I copied it from Data-UIGalllery-Features-Container.pxHorizontalTop section as below. You can right click on Tab Group to copy and paste it to pyCaseManager7.

4. Remove all sections inside Tab Group and embed “pyUserDashboardContainer” section instead. Select “Standard” for style format.

5. From Structural dropdown, drag & drop “Dynamic container” right to Dashboard section.

6. You can configure max tabs from 1 to 16. The default is 8.

7. That’s it. Check in and now you can test it. A work object or Harness will be opened in a tab as below.

• I think tab based UI is user-friendly, but if you need to hide it for any reason, you can do so by including below snippet into pyCaseManager7. You may wonder if you hide tabs, what was the point of even having legacy Tab Group. In our case, we did it because we only wanted to fix the UI issue with Snap Start. Customer was already used to Pega 8 and they wanted to keep UI (no tabs).

```
<style>

.expandInnerTabStyle, .headerTabbed .tabbed_expandInnerDivStyle, .headerTabbed .sectionBodyContainerCustomHead {
padding : 0 0 0 0;
}
body .headerTabbed .scrlCntr {
display: none;
}

</style>
```

• Embed a non auto-generated HTML section

• non auto-generated HTML section

Hope this helps.

Thanks,

[hoyatha1 (Hoyath Ali)]

@KenshoTsuchihashi

Thanks for the detailed post. I was trying this as I had similar requirement but facing an issue.

Scenario:

1. Invoke snapstart url

2. Once we are on the portal, click on any cancel button, it takes us to dashboard, which is fine(expected).

Now close the browser window, and invoke the snapstart url again, this time it doesn’t launch the entire portal and just launches the harness alone. Have you noticed such behavior?

[KenshoTsuchihashi]

@hoyatha1

This article talks about how to enable Tab based Multi Document. The problem that you described is known issue specific to Snap Start. There is no quick solution for this issue at moment, as long as you are using UIKit. Please see Issue 4 at https://collaborate.pega.com/discussion/how-fix-ui-issues-use-snap-start.

[RichardMarsot]

@KenshoTsuchihashi While it is possible to use the multi-doc dynamic container with UI-Kit - the pyCaseManager is set up as a multi-doc DC already but without displaying the tab) - this configuration is not supported with Theme-Cosmos and will NOT work because theme Cosmos is built around the SPA DC and the use of the 3 Ajax containers.

for more details - Customizing a Cosmos Theme application | Support Center

[DeviSusmithaC (Devi Susmitha Chandana)]

@KenshoTsuchihashi Using the above approach still leaves a Severe Warning saying not use the tabbed layout instead use the layout group. I tried using AJAX container , which is working as expected but unable to open the reports which we use in the caseworker. The screen is not refreshing. Any solution for this server warning.

[RichardMarsot]

@DeviSusmithaC the warning is used to indicate that this is a deprecated configuration - as long as you acknowledge the warning and understand that this configuration is deprecated - you are fine to use it.