Article published on the 23rd of November 2020.
Contents
1. Introduction
The WorkPoint Embed webpart is useful for displaying web elements, such as Power Apps directly on entity sites. Using the Embed webpart, data from the entity can be passed into the web element. This is useful e.g. on a Company site for displaying a Power App which includes entity details such as Address, contact information, or even a map displaying the company's location based on the address fields from the entity.
2. Requirements
The Embed webpart is available on WorkPoint 365 solutions using Modern UI.
3. Configuration
In the following section, we will go through an example of embedding a Microsoft Power App on an entity site.
For the purpose of this example, we have set up the following Microsoft Power App to display some information about a company on an Project Management solution:
The Power App has also been set up in the WorkPoint Administration with the following configuration:
Note that we have added a set of parameters to send to the Power App. These are the ones we will display in the text fields in the Power App. The map in the Power App will use the address in the "Address" parameter to display the location of the company.
- The Power App includes an Image control which is used to display a map based on the input from the Address data from the entity.
- Various labels and corresponding text input controls help display some information from the the entity. The example here shows the text input control displaying the entity title, in this case the title of the company on which the Power App is displayed. For more information on how to display data from entities or documents in a Power App, please visit this article.
In the Microsoft Power Apps interface, we can launch the app in order to copy the URL of the app:
- In the Microsoft Power Apps interface, in the left side menu, click "Apps" to go to the apps overview.
- In your list of apps, locate and click the title of the Power App you wish to embed into the WorkPoint site.
The App should now launch in a new browser tab:
- Locate and note down or copy the URL of the launched app.
Now that we have the URL of the Power App, we can insert the WorkPoint Embed webpart on the entity site we wish to display the Power App. In this example, we insert the WorkPoint Embed webpart on the Company Master Site of the solution:
- When editing the Master Site home page, click the "+" button to add the WorkPoint Embed webpart to that section.
- Perform a search for e.g. "Workpoint".
- Locate and click the "WorkPoint 365 - Embed" webpart.
- When the webpart is added, click either the edit button or the "Configure web part" button.
- In the configuration panel, in the "Website" field, type or paste in the URL of the Power App.
At this point, the Power App should appear, but without any data showing:
Next, we can add the parameters we pass to the Power App from WorkPoint in accordance with the Power App configuration in the WorkPoint Administration.
Parameters can be fed to the Power App by adding "&Entity_ParameterName=[Internal Field Name]" after the URL of the Power App.
Here are listed a couple of examples:
&Entity_Title=[Title]
&Entity_CompanyId=[wpCompanyId]
&Entity_Address=[wpAddress2]The following is the full URL passed into the "Website" field for this example:
https://apps.powerapps.com/play/9208cc10-dea6-47e0-bb87-4c0f1f62282c?tenantId=0db2c88f-50f0-4bca-a5ae-6ad9fc3b0c65&source=portal&screenColor=rgba(0%2C%20176%2C%20240%2C%201)&Entity_Address=[wpAddress2]&Entity_Title=[Title]&Entity_CompanyId=[wpCompanyId]&Entity_AccountNumber=[wpAccountNumber]&Entity_Web=[wpWeb]&Entity_Email=[wpEmail]As can be seen, we have added the 6 parameters we pass the Power App to the website URL.
In this example, our Company Master Site has no entity data other than the title "Master", so in this case, no other data is displayed in the Power App on that site. Note also that the map does not show up. This is because the address, which in our example is a concatenation of the "Address1", "Postal Code", "City", and "Country" fields, is not filled out because of missing data:
At this point, we can click the "Republish" button and perform a Master Site synchronization to synchronize the webpart out to other Company entities on the solution:
- Click the "Republish" button to publish the page.
- Click the "Home" button on the solution.
- Click the cog to access the WorkPoint Administration.
- In the WorkPoint Administration dashboard, click the header of the business module for which you wish to run a master site synchronization. In this example, we added the Embed webpart to the Companies Master Site, so we want to perform a master site synchronization on the Companies business module.
- In the drop down menu, click "Master Site Synchronization".
- Enable "Replicate Web Parts" and leave all other settings and lists on the page disabled.
- We wish to synchronize the webpart onto all Company entities on the solution, so we click "Synchronize all".
You can follow the progress of the synchronization by clicking the "Refresh" button in the list at the bottom of the page:
- Click "Refresh" to refresh the list and view the progress of the synchronization.
Once the synchronization is complete, the webpart should have been synchronized onto all other company sites. We can check by going to a company which has entity data:
Obviously, a lot of configuration and automated processes could be implemented in the Power App which is being displayed. For more information about WorkPoint's integrations with Microsoft Power Automate and Power Apps, please visit this article.
4. End User Guide
Click here to go to the end user guide article for Webpart List View.
5. Notes
WorkPoint's Power App integration offers a wide range of configuration options to build useful Power Apps for your WorkPoint solution.
For more information about how to set up Power Apps and Power Automate flows for WorkPoint, please visit this article.
Comments
0 comments
Please sign in to leave a comment.