Flow will let you automate business processes based on the connectors for services that are available. You can start building a flow from scratch, or you can start by using one of the many predefined template. For creating one yourself, all you need is a modern browser. At this moment, there are around 100 services that can be used by Flow. A list of all services can be found at the following location: https://flow.microsoft.com/en-us/services.

PowerApps on the other hand is an enterprise service for building business apps which can be created without writing code and have the possibility to be connected with different data sources, connectors and gateways. These apps can be shared throughout the company and can be used on different environments and devices. You can access the PowerApps via a modern browser, or via the apps for Windows 10, IOS or Android. The apps you created will be visible in an overview on your own PowerApp page and in the SharePoint list as a view. A PowerApp can be created in the PowerApps studio for web or Windows. This means you have the possibility to develop your business apps online, on the web or dedicated on your Windows machine.

Managing PowerApps and Flow however still has its flaws. To start off, every user who has access to PowerApps can create an app. As an administrator, it’s not possible to check how many apps currently are developed and used. However, there is an admin center available (https://admin.powerapps.com and https://admin.flow.microsoft.com) with some other administration tools. Unfortunately, the only parts you can manage (at this time) are environments and data policies which we will dive in briefly.

Environments

Environments are used as a space to store, manage and share the apps, flows and business data from your organization. You may choose to create separate environments for development, test and production, or you can choose to just create one environment for everything. If you choose to splits up your environments, this will impact the development of your app because the resources which are put in an environment are only accessible to the other entities within the resources and are bound to the geographic location of the selected datacentre. So, if you create an app in the environments ‘test’, it will be able to access the data sources from the test environment, but not from the production environment. Within the environment there are two roles defined, an Environment Admin and an Environment Maker. Global administrators can also manage all environments that have been created in their tenant and set tenant-wide policies from the PowerApps admin center.

Data Loss Prevention (DLP)

Data loss prevention policies are used to protect the business data of a company. In short
it will guarantee that an app which has no rights to share the data, will not be able to so with the company data within their PowerApps of Flows. When adding a DLP, a service can be added to the list which will block exploiting the data from the selected service. A list of all connections possible for PowerApps can be found here: https://powerapps.microsoft.com/en-us/tutorials/connections-list. These limitations can be very useful as the users is probably working with live data.

Conclusion

As stated, these settings are applicable on both Microsoft PowerApps and Flow. So basically, there is no real way of managing and governing the flows and apps created by users except for the possibility to restrict it. This is no surprise because it’s Microsoft’s vision on these tools. Microsoft has built these tools for power users, and so the flows and apps a user creates are bound to the user account. A drawback of this, is that if a user creates and shares an app or flow, but the account of that user gets disabled or deleted in the future, the shared apps and flows will be lost, regardless if other users still use the shared apps and flows. These are things to keep in mind if you decide to use these tools. Be aware that these products are still in preview! Let’s hope Microsoft will expand the managing features in the future to make governance easier, so these tools can be used in a real production environment.

We found out that there are few solutions available for displaying the results as a list view, filtering and document preview. But most of them do one or the other while we needed all of them combined. So we decided to build it ourselves. The files we started building from can be found at the following GitHub link, these will lay the groundwork for displaying the results in list format. The folder will contain several files, but we are only going to use Control_List_Table.html and Item.List.Item.html.

To start off, we wanted to be sure the customer knew that we would not implement every functionality of a list, this would take us to far.

Adding the display template

The files you downloaded can be uploaded in the Content Web Parts folder under Display Templates folder. The exact upload location of the display templates does not matter, as long as it is in the Display Templates folder under the masterpage gallery. The meta data fields which show up when the files are uploading, can be ignored.

As seen in the screenshot above, on the right side, SharePoint will automatically generate one JavaScript file for each item uploaded. When you modify the html files, make sure to publish the files. This can be done by right clicking on the items you just uploaded and clicking on ‘Publish’. Else you might find that not everyone can see your changes.

Before the display template can be configured, the search managed properties that will be used in the display template must be configured correctly. The display template has sorting functionality, in order for this to work, the sorting option on the managed properties that need to be sortable must be selected.

Modifications

As you can see in the screenshot, we added a document preview to the list for every item. The document preview will show up if you click on the ellipsis of an item.  The buttons you see when the preview is open are also added and the information displayed (like author) is configurable in the web part which we will discuss further in this blog.

Another thing we added are the sorting options hidden behind that little triangle next to the column name, as in a list. This is done as following: 

One of the downsides of trying to copy something, is that you can’t copy it for 100%. One of those things is that you can’t sort very well on for example a date. In the search results the results are not seen as type they are, but just as text. So if you want to sort a date column, it will not work properly because it is not seen as a date, but as a text type.

Filtering can be done by connecting a search box web part to the content search web part. This will filter the search results.

The snippet below will render the menu when clicking on the small triangle in the column header.

spikes.Header.Menu = function() {return {showMenu: function(element) {var headerElement = element.parentElement.parentElement;var menuElements = headerElement.getElementsByClassName("ms-core-menu-box");if (menuElements.length > 0) {var menuElement = menuElements[0];menuElement.style.left = element.offsetLeft + 17 - 127 + "px";menuElement.className = menuElement.className.replace('hidesortmenu','');}}};}();

Display template configuration

To use the display template, you need to add a content search web part to a page in SharePoint and configure it correctly.

As we discussed earlier, you can change the information displayed in the document preview by adding properties like in the screenshot.

The properties under HeaderTitles will change the name of the columns of the search results. If it is left empty, the managed property names will be used as column names. We added this functionality because Managed properties don’t always have a logical name.

The PreviewDialogTitle option is used in order to set the value of a certain managed property of the document as title of the document preview.

The managed properties that are not important, and don’t need their own column can still be visualized on the preview panel.

The final result will look something like this.

Thanks for reading, feel free to comment in the section bellow.