In this article, We will discover more about the brand-new feature that Microsoft unveiled in the 2023 Release Wave 1. The recent records component allows users to view related cases on a form. Compared to the old grid, this component has better visualization of the record list. Also, we will see how we can see customer details in an app’s side pane by using JavaScript.
Steps to Add Recent Records Component:
1. In Power Apps, Select the environment that contains your solution.
2. From the left navigation pane, select Tables -> Select Account -> In Data Experience, Select Forms.
3. Create a new main form or select the existing main form.
4. Click Components in the form designer or on the ribbon bar.
5. On the bottom side, click on Get More Components to import the component; if it is already imported, it will display under the More Components category.
6. After clicking on Get More Components, search for Recent Records and click on Add.
7. Drag the Component onto the form, and the window will appear.
Select Case Table -> Select all cases to view
Now check the checkbox in the column header and select Account Name in the table column field, otherwise, records will not be filtered.
8. Click on Done.
Once you click on done then, all cases will be displayed in component. On the right-hand side, the properties pane check shows the related records checkbox and a popup will appear if you click on the reset component. Again, select tables and view because, as we check the show related records checkbox, the component gets reset.
9. Click on the Save and Publish button.
Now all the recent cases with their information belonging to that record will be displayed in the recent record component. You can click on the Case name to open the Case. Case number, Origin, Customer, and Priority details will be displayed on the component.
Show Customer Details in the app side pane:
To visualize the customer data, Microsoft has added some JavaScript web resources in the customer services module. This will help load Customer details on a side pane.
There are two different events used that we have registered as follow:
1. When a case form is opened (on the Load event)
2. When a customer field is changed (on the Change event)
You need to add these two events to the Case entity main form.
Please follow the below steps to register on load event on case entity form:
1. Go to Power Apps.
2. From the left navigation pane, select Tables -> Select Case -> In Data Experience, Select Forms -> Select existing main form.
3. On right hand side, click on the event tab:
Specify the following details:
a. Click on Event Handler.
b. Select Event Type -> On Load.
c. Select Library.
If the library is not available, then click on add library and search, and click on add.
“ModernCaseManagement/Incident/msdyn_ModernCaseManagement”
d. In the function field, set the function value as:
ModernCaseManagement.ModernCaseManagementLibrary.onCustomerChange(executionContext)
e. Select Enabled and Pass execution context as first parameter checkboxes.
f. Click on Done.
g. Click on Save and Publish.
Please follow the below steps to register on change event in Customer field:
1. Go to Power Apps.
2. From the left navigation pane, select tables -> Select Case -> In Data experience, Select Forms -> Select existing main form.
3. Click on Customer field -> On the right-hand side, click on the event tab.
Specify the following details:
a. Click on Event Handler.
b. Select Event Type -> On Change.
c. Select Library. If the library is not available, then click on add library and search, and click on add.
“ModernCaseManagement/Incident/msdyn_ModernCaseManagement”
d. In the function field, set the function value as:
ModernCaseManagement.ModernCaseManagementLibrary.onCustomerChange
e. Select Enabled and Pass execution context as the first parameter Checkboxes.
f. Click on Done.
Below is a screenshot of the Customer detail pane when the user opens any case record or changes a customer on the case form.
Conclusion
Recent Record component gives a better user experience and visualization, and after configuring events, we can visualize customer details without switching entities.
