Inter-widget communication via publisher/subscriber model

The dashboard portal allows inter-widget communication via publisher/subscriber model. In the publisher/subscriber approach the publisher a.k.a the sender sends messages without specifically targeting a subscriber a.k.a a receiver. The receiver individually declares the interest in one or more messages published by a particular publisher or set of publishers.

Inter-widget communication in dashboard portal behaves the same way, i.e. the dashboard itself keeps track of its publishers, subscribers, and their subscription. When a particular publisher publishes a message out the dashboard routes the message to its subscribers based on store-and-forward mechanism.

Implementing a publisher/subscriber widgets

To implement publisher/subscriber widgets follow the steps mentioned below.

NOTE: This guide assumes that you already have a widget which is deployable in dashboard portal.

Creating a publisher widget

1. Make sure your widget has extended from the based widget provided by the dashboard portal. If not please refer “Extending from base widget component”.

2. Add the following to widget.conf file.

   configs: {
   	...
   	pubsub: {
   		types: ['publisher']
   	},
   	...
   }

3. To publish a message call the following function. The message can be any type.

   super.publish('message');

A sample widget has been shipped with WSO2 Stream Processor named "WidgetState" to demonstrate this feature. You can find the source code of the sample widget at https://github.com/wso2/carbon-dashboards/tree/v4.0.8/samples/widgets/Publisher.

Creating a subscriber widget

1. Make sure your widget has extended from the based widget provided by the dashboard portal. If not please refer “Extending from base widget component”.

2. Add the following to widget.conf file.

   configs: {
   	...
   	pubsub: {
   		types: ['subscriber']
   	},
   	...
   }

3. To subscribe to publishers call the following function.

   super.subscribe((message) => {
   	// Handle the message here.
   });

A sample widget has been shipped with WSO2 Stream Processor named "Subscriber" to demonstrate this feature. You can find the source code of the sample widget at https://github.com/wso2/carbon-dashboards/tree/v4.0.8/samples/widgets/Subscriber.

Wiring publishers and subscribers

Once the publishers and subscribers are implemented and added to the dashboard there needs to be a way for subscribers to subscribe to interested publishers. Please follow the steps provided below to do publisher/subscriber wiring (these guidelines assumes you are using the pre-shipped publisher and subscriber widgets).

1. In the designer view drag and drop the publisher and subscriber widgets into the dashboard.
2. Click on the configuration icon in top-left of the subscriber widget. This will open up “Widget configurations” panel which lists all the publishers in the dashboard.
3. Select the interested widgets by checking the checkbox on interested publishers.
4. Once the subscriber widget subscribes to a publisher, the publisher can send messages to the subscriber. 
5. To unsubscribe from a particular publisher, un-check the checkbox mentioned in 4.