New UI Plugins
In the last year more and more UI Plugins have been developed and released as part of the UI Extensions feature, which has been introduced with Cumulocity 10.16.0. UI Plugins are an important factor to expanding the platform’s self-service capabilities and making it more adaptable to the users. This article aims to spotlight several of these innovative UI Plugins, each build to extend Cumulocity’s capabilities and to streamline user experience. As we delve into the specifics of these plugins, we’ll uncover how they are transforming Cumulocity into a more flexible and user-centric IoT platform.
Tenant Option Management Plugin
Using the Tenant Option Management Plugin users can easily create, edit and delete tenant options. An option can be configured as encrypted and its value can either set to the type JSON or simple text. You can only see, edit and delete options you created using this plugin. All options created using this plugin are displayed in a list. Users can search, sort and filter for tenant options in this list.
SoftwareAG
/
cumulocity-tenant-option-management-plugin
Easily create, edit and delete tenant options. You can configure an option as encrypted and can decided between text or JSON input.
Cumulocity IoT Tenant Option Management plugin
Easily create, edit and delete tenant options. You can configure an option as encrypted and can decided between text or JSON input.
Sample images
List all tenant options that were created on the tenant. You can search through, sort and filter all columns
Easily create text or JSON options. You can also encrypt the content of an option.
JSON editor example
Limitations
You can only see, edit and delete options you created using the plugin. (You can add existing tenant options using the import button.)
Features to come
- (Bulk) Import and export of all options/ specific categories
- Import by Template o dynamically show creation forms for c8y specific tenant options using formly o will ship with example template for Analytics Builder options
Versions
1.0.x - compatible with UI v. 1017 In the future: 2.0.x - compatible with UI v. 1018
How to start Change…
Favorites Manager Plugin
The Favorite Manager allows you to quickly access your favorite assets by adding them to your personal favorites list. You can mark any device, group or Digital Twin Manager asset as your favorite. No special permissions are needed to use this plugin, as the list of favorites is managed per account in the current user object. Therefore, favorites are independent of individual sessions and the browser being used for a session.
SoftwareAG
/
cumulocity-favorites-manager-plugin
Mark any asset or device as a favorite to quickly access these in your personal favorites list
Favorites Manager UI Plugin
General
Access your favorite assets quickly by them to the your personal favorites list. You can mark any device, group or Digital Twin Manager asset as your favorite. No special permissions are needed to use this plugin, as the list of favorites is managed per account in the currentUser object. Therefore, favorites are independent of individual sessions and the browser being used for a session.
Important: This Favorites Manager plugin will not work for users, which are managed via SSO (e.g. Azure Active Directory). The corresponding user object of these SSO users is immutable and can't be updated. File an issue if you require this plugin for SSO users.
Filter your favorite list to easier find your favorites you are looking for.
Local development
Recommended version
- node v 14.x
- npm v 6.x
Plugin versions
- Angular v 14.x
- WebSDK v 1017.0.x
How to start Change the target…
Events Graph Plugin
Show event occurrence in a timeline chart, using echarts profiling example approach (see Examples - Apache ECharts). For the different texts a color can be chosen. (Currently only works in a device dashboard!)
Shows “duration” of every event by assuming that a state is finished once the next state starts - an event always ends with the submission of the next event (of the same type, but different text). The chart shows a view of the past x hours and helps visualizing the state changes for a specific event type.
- choose color for different states
- select timeframe (max. 24 hours in the past)
- states can be deselected in the legend
- chart is zoomable
SoftwareAG
/
iot-cumulocity-events-graph
The Event Graph Widget Plugin displays event occurrence in a timeline chart, using echarts profiling example approach. For the different texts a color can be chosen. (Currently only works in a device dashboard!)
IoT Cumulocity Events Graph package
Events Graph widget plugin
Show event occurence in a timeline chart, using echarts profiling example approach (see https://echarts.apache.org/examples/en/editor.html?c=custom-profile). For the different texts a color can be chosen. (Currently only works in a device dashboard!)
Features
Shows "duration" of every event by assuming that a state is finished once the next state starts - an event always ends with the submission of the next event. The chart shows a view of the past x hours and helps visualizing the state changes for a specific event type.
- choose color for different states
- select timeframe (max. 24 hours in the past)
- states can be deselected in the legend
- chart is zoomable
Sample images
Easily check which events occured when
The chart can be zoomed
Interactive legend
Limitations
- only works for single devices
- only works for single event type, visualising the different event texts as bars
- no realtime
- …
Note Widget Plugin
Use the Note Widget to easily manage notes for devices and assets. Users can add new notes or extend existing ones. These notes will be shared with all users who have access to the related device/asset and its dashboards. Each note update is stored as an event for the corresponding device/assets. Using the log section users can have a look at past notes.
SoftwareAG
/
cumulocity-note-widget-plugin
Easily manage and share notes for your device and asset
Cumulocity Note Widget Plugin
General
Use the Note Widget to easily manage notes for devices and assets. Users can add new notes or extend existing ones. These notes will be shared with all users, who have access to the related device/asset and its dashboards. Each note update is stored as an event for the corresponding device/assets. Using the log section users can have a look on past notes.
Important: Users need to have READ and ADMIN permission on the Events API, as notes and updates on notes are stored as events.
Local development
Recommended version
- node version >= 16.x
- npm version 6.x
Plugin versions
- Angular version 14.x
- WebSDK version 1017.0.x
How to start
Change the target tenant and application you want to run this plugin on in the package.json.
c8ycli server -u https://{{your-tenant}}.cumulocity.com/ --shell {{cockpit}}
Keep in mind that this plugin needs to have an app (e.g. cockpit) running…
Layered Map Widget Plugin
Differentiates from the existing map widget by providing the ability to create multiple layers, showing markers based on specific filters. The user can for example create a layer to show markers of devices having critical alarms. As the query can be created dynamically, the user is free to create various kinds of filters/ layers. Powerful queries can be created with a simple UI, which lets you create the query parameters for a layer. Only devices matching your query will be shown for that layer. Layers can be selected and deselected on the map later. You can also choose whether layers should be selected by default. The widget is designed to scale well with a higher number of devices.
SoftwareAG
/
cumulocity-layered-map-widget-plugin
Plugin containing the advanced map widget. Displays a map with position markers for selected devices. Support for configuration of additional layers and custom markers.
IoT Cumulocity Layered Map Widget plugin
Cumulocity module federation plugin containing the Layered Map widget. By installing this plugin to a cockpit application, the user can choose this widget from the catalog.
Displays a map with position markers for devices with c8y_Position fragments. The user can create multiple layers using different queries:
- fragment and value layer, e.g. show all devices with type = c8y_MQTTDevice
- inventory query layer, e.g. show all devices with critical alarm count greater 0 and having custom fragment xyz
- alarm query layer, show all devices for that at least one alarm exists matching the alarm query you create
- event query layer, show all devices for that at least one event exists matching the event query you create
The map widget is designed to scale well also with higher count of devices. Position updates and changes regarding the layers are polled using bulk requests Markers can be configured…
Translation Manager
Using the Translation Manager Plugin you can easily manage your dynamic translations in Cumulocity IoT for all supported languages. Translations can be added and updated using the Translation table. Translations are globally available in all Cumulocity applications running on the same Cumulocity tenant via the public-options application and its options.json file.
SoftwareAG
/
cumulocity-translation-manager
Dynamically manage your translations in Cumulocity using the Translation Manager UI Plugin
Translation UI Plugin
General
Manage your translations in Cumulocity IoT for all supported languages easily using the Translation UI Plugin. Translations can be added and updated using the Translation table. Translations are globally available in all Cumulocity applications running on the same Cumulocity tenant via the public-options application and its options.json file.
The Translation UI Plugin automatically register a new navigation entry in the left side navigation menu. The Translation Plugin can be accessed by navigating to Settings -> Localization.
Important: If the Plugin is used in an application it needs to check if the
public-optionsapplication exists. Thepublic-optionsapplication is used to store and share translations to the different applications. In case the application doesn't exist, it will automatically be created in the Cumulocity tenant via the Translation UI Plugin. Creating this application requiresAdminpermission onApplication management. Therefore, make sure the plugin is initally…
For any questions reach out to christian.guether@softwareag.com and hendrik.naether@softwareag.com.
Top comments (0)