Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

In addition to creating a widget using widget generation wizard, you can implement your own custom widgets and use them within the Dashboard portal.

Tip

If you want to refer the source of a sample widget to develop your custom widget, you can find the available sample widgets herein the WSO2 Stackblitz account.

For instructions to create your custom widget by editing a sample widget, see Using Sample Widgets to Create Custom Widgets.

 This section explains:

  • How to write a custom widget for the Dashboard portal 
  • The features that are provided for widget developers in the Dashboard portal

...

  1. Access the data provider configurations in <SP_HOME>/deploment/web-ui-apps/portal/extensions/widgets/<WIDGET_NAME>/widgetConf.json file as specified in Accessing Widget Configuration.
  2.  Use the base widget API to create the WebSocket connection. For this, you can use the following APIs:
    • Subscribe to the endpoint

      API Syntax super.getWidgetChannelManager( ).subscribeWidget(<Widget id>, <Call back method to handle data>, <data provider configs>)
      Example

      super.getWidgetChannelManager()
      .subscribeWidget(this.props.id , this.handleDataReceived , dataProviderConfigs));

    • Unsubscribe from the endpoint

      API Syntax super. getWidgetChannelManager(). unsubscribeWidget(<Widget ID>);
      Example
                        super.getWidgetChannelManager().unsubscribeWidget(this.props.id);