Hi and welcome to Constellation hands-on. Series of articles about Constellation architecture. Me and my colleagues will share our knowledge and experience implementing new Pega UI architecture, Constellation. We will start from basics, explaining architectural building blocks, discussing new parading of building apps. Then we will delve into more advanced topics.
This post will be updated with links to new articles being published. In this post we invite you to join discussion about articles and topics from Constellation that interest you most.
@Kamil Janeczek Its better to give video series,as What ever small things we could do earlier those things are becoming complicated.
Simple launching a pop up with Respected Data using Data Reference Case Reference and Embedded data
@Kamil Janeczek These articles are really great to understand the Constellation in detail. A big thanks for sharing these details.
I have a few very specific questions on the architecture?
What contents are stored in CDN sever? Could you please share a few very specific examples?
What contents are stored in app-static server? Could you please share a few very specific examples?
Who initiates a call to the CDN server and at what point during a transaction? Is it initiated by the browser? What’s the protocol for this communication?
Who initiates a call to the App-static server and at what point during a transaction? Is it initiated by the browser? What’s the protocol for this communication?
How the does the browser process the metadata of the UI and render it? Does it use the Pega Constellation JS libraries which are loaded when the constellation portal is loaded for the first time during a user session?
@Kamil Janeczek Thanks for these articles they are great. One topic I would like to see if how we would embed a web analytics tool (such as Google Tag Manager) into a constellation app.
“When creating Cases and displaying assignments in an application, users are sending requests from their browser to the Infinity Server through the DX API. The Infinity Server requests information from the App-Static UI service, where the JSON definition of the View is stored.”
Aren’t the JSON definition of views stored in pega data base itself? If we do not have any customer specific static asset do we really need App-Static service?
On receipt of the view meta data along with case data I assume the ConstellationJS interprets them with the help of contents available from CDN and renders the HTML? Please confirm on the understanding.
If so, when we develop a custom DX component and publish it, does it get published in the Pega CDN or else how does the ConstellationJS interpret this new implementation? Or although the component is custom but it is bound the broad syntax categories available and interpretable by ConstellationJS?
Now in case of SDK based implementation or Custom client implementations how does the ConstellationJS interpret the ui meta data received from Infinity server, that would not defined by the syntax available in the assets of Pega CDN?
I understand that, according to the current product design, landing pages can only support list views and not form/partial views. However, I’d like to present a scenario: imagine needing a simple search functionality from an external system or the Pega database containing 20-30 million records. In this case, I wouldn’t want the data page to retrieve all 30 million records through the list view and then filter them using the prompt filter.
This is a common use case in most of enterprise suite of Pega applications, which are implemented using Theme-Cosmos/ui-kit. We typically have a simple search button that queries the system of record with a large volume of data and displays the results to the user. Unfortunately, this limitation is forcing us to reconsider some of our apps in Pega Constellation.
It would be very helpful if Pega Constellation could offer the capability to query the database based on user-entered data and fetch the relevant records for display, without fetching the entire dataset.
hoping someone may be able to help me with a DX component configuration I am trying to do for my project. I am using pega 23.1.3 on constellation. I have a business requirement for having users to upload required documents that are dynamic base on information they provide on previous tasks. Due to the fact that pega 23 constellation does not support attachments in data types yet we are uploading the required documents to a child case and displaying the list of child cases on the parent case.
From the parent case the user can create a new document child case, edit or remove the document child case from the parent. I got the DX component working for all the actions, but it refreshes the browser each time when the user edits or remove the document child case while on the parent case and takes them to the confirmation screen for the child case.
The edit and remove actions are casewide local actions on the child case and are being called by using the openLocalAction DX API. To prevent the browser from being refreshed my understanding is that I can set the param “type” to “express” for the openLocalAction DX API because it is a separate context from primary page. However, even when I do this the browser is still refreshing and taking the user to the child confirmation screen.
Would anyone be able to provide any insight on why this may be happening? I am bit unsure what I am missing from either the DXAPI side or from the pega configuration.
@Kamil Janeczek In constellation if a list view is defined for the case type classes then we get the option for setting up “Bulk Actions”. But in the application we are displaying a list from the workbasket that does not allow to configure “Bulk Action” in the view wizard. If the requirement is as simple as show case the assignments from a pre-defined queue and allow the user to do bulk transfer of those assignments how should that be implemented using OOTB constellation options?
@AcharyaMVS8878 when using query field type you have an option to configure the field to appear as a link. this would work well if your refered object is a data or case object. When using embeded data you would get facility to open modal when the field is used in Form View and partial view.
You are rigth view metadata is available in Infinity and synced with App Static only in regards to custom components I will fix it in article to make it clear.
It is correct.
Custom DX Componnets sits on App Statis behind auth not on global and public CDN
If you can clarify this question on some example please.
The OOTB list display patters are like displaying tabular view with predefined actions like Add, Edit, delete, search etc.
Now consider a view in Traditional UI, where with each rows in the result table there is an action icon on-click of which user gets couple of menu options like - Attach File, Change Stage, Update Data etc. In OOTB constellation, we cannot incorporate these actions, so how do you recommend to implement these UI options in constellation, actions are needed against each row record ?
@Kamil JaneczekThank you for providing this resource. I have a requirement where I need to add a button to a table row which would create another case based on the row context. This was very easy in Cosmos, but I can’t see to find the best way to do this in constellation. On the right side of the table, we need a button for each row to launch a new case
A lisview for the child case needs to be created where one of the column needs to display the parent case id and parent case label.
Approach:
A list data page was created which gets loaded based on a report definition defined on child class. The report definition includes an inner join with parent class and the parent pyID and pyLabel are fetched. Using a response data transform parent Id and labels are mapped to child level attributes Primary Case ID and Primary Case Label.
Now, when in the list view the above data page is referred the attributes Primary Case ID and Label never appears and hence those values cannot be included in the table.
Question:
Is the only option for this use case is to copy parent data during child creation or use a case reference field for this use case? If yes, how to use case reference while using a list data page for a table view
@Kamil Janeczek The case types allow us to add case wide actions as well as stage specific optional actions but if somebody wants to implement classical behaviour of one single assignment in a stage having multiple connectors based on likely hood how to implement the same using constellation OOTB options.
use case: A stage has 2 steps to invoke API from 2 systems and client expects fall back management in case of functional exceptions as well. One simple way to implement fallback is to route the flow to a step/assignment tagged to operations queue and build a view to show the list in the portal. The admin can reassign these assignments to support user based on their skills. 2 different API steps should have 2 different fallback assignments so that it can be associated with different skills as well as the instructions can be different. In the flow the assignments are looped back to original integrator shapes. Each fallback assignments should have Actions like - Manual resubmission, Update Data and submit etc.
@Kamil Janeczek I am currently working on implementing a client requirement that involves file uploads, specifically image files. The goal is to allow users to upload an image file and then immediately display the uploaded image (i.e., render the actual picture) below the upload input. Could you please advise on to how achieve this ?
@Kamil Janeczek Is there a way to hide the assignments banner in the review harness? The client has expressed that the banner is confusing to the end user. Even though it is collapsed by default, there is no reason for an end user to see if a case is at a wait shape and we would like to hide it all together.
Thank you for your comment. We will publish a series of short how-to videos. This series of posts is about the architecture of Constellation and the paradigm shift. It is necessary to understand the story behind Constellation and its major principles to be effective in building robust and high-performing applications. I understand the challenge as in Constellation things are achieved differently but clients can achieve the same business outcomes as previously, having many benefits. Benefits that we are describing in detail in this series.
If you have some particular use cases to be covered please put them in a comment or PM me. I will make sure your voice is heard.
@AnupamPegaCLSA Hi , I will share my overview for some of the questions on a high level with single line.
CDN server consists of UI components that you would expect that pega has to have. - house of Pega UI components and design patterns.
2.App static server is a house of non- Pega - customer side UI services and components, it can be any tech, core react, core angular or web components or custom UI tech combinations and flavours.
Who initiates a call to the CDN server and at what point during a transaction? Is it initiated by the browser? What’s the protocol for this communication?
The call to the CDN server happens when you first browse the pega application- open the network and observer the prbootstrap - 2nd transaction in the network trace. this Js code redirects to the CDN url and loads the JS to the browser.
4.Who initiates a call to the App-static server and at what point during a transaction? Is it initiated by the browser? What’s the protocol for this communication?
Same - prbootstrap JS initiates the call to App static server when you hit the Pega server.
5.How the does the browser process the metadata of the UI and render it? Does it use the Pega Constellation JS libraries which are loaded when the constellation portal is loaded for the first time during a user session?
this point I am not 100 % sure. someone may correct it.
yes Pega constellation JS libraries has two public APIs ,pCore and pConnect the JS code in these APIS are responsible to load the metadata .
@Phill99JAs far as I know there is no elegant solution for this. DX Component will not make it as you need to have GTM loaded on every page, let me ask internally what options we have.
