We already talked about using Peakboard together with Office 365 a lot of times in different contexts. In today’s article we want to step deeper into the connectivity with MS Teams. The connection to Teams is often seen to be used as link between the workers in front line operations of the factory and office workers. So it makes sense to integrate it in existing Peakboard application. The seond typical use for Teams integration is make the machine talk to the office workers. A machine - connected via OPC UA or other protocols - runs into an error and use a Teams channel to inform about these state changes and let other see and comment these issues. There are many more options. In today’s article we discuss just a simple chat client for factory workers who can submit new messages or respond on messages.
Before we start just a reminder: Every Office 365 data source handles authentication in the same way. To learn more about how to authenticate against the Office 365 backend, see our getting started guide.
Setting up the data source
For setting up the data source we need to authenticate first. Then we choose the Team and the Channel to get access to. There are three different modes available:
- Get all messages, the channel message and the replies
- Get only the channel messages
- Get only the replies for one dedicated channel message.
In our use case we go for the first option. So we will retrieve all message of channel including their replies. We will then seperate channel messages and replies later through data sources.
Building the data flows
In our first data flow we beautify the raw output a little bit. Set a good date format, filter away all message rows with empty messages and also create a new column which we can use later for displaying the messages in a styled list.
For the selection of the channel messages we add another data flow and filter away all messages that have a parent. If the message dowsn’t have a parent, it’s a channel message.
The same principle works for the replies. We have a variable called “ActiveChannelMessageID”. It is filled when the user clicks on a button to view the replies of this dedicated channel message. We filter out only the the messages that have this message ID as their parent value.
Building the UI
The central element is a styled list to display the channel messages. It’s bound to the data flow for the channel messages.
The Building Blocks behind the button for opening the replies is just setting the variable for the message ID and then reloading the data flows for the replies. That’s a second styled list to show the replies. It is automatically set to visible through a condtional formatting as soon as the channel message ID is set. We don’t have a screenshot for every step, but we can easily look follow this principle by checking the downloadable pbmx file.
Let’s have a look on how to submit a new channel message. As soon as the user click on the “New post” button, a group of controls are set to visible to form a pop up for submitting the new message.
The actual creation of the new channel message happens through a Building Block that is provided in the context of the data source. We can either post a channel message (see screenshot) or a reply. If we want to send a reply we need to provide the channel message ID.
result
In last image we can see the application in action. The data is qeuried from Teams. Then the user clicks on the replies button and the thread opens on the right side. We can then just compose a new reply and submit it to the backend.
