wso2 / carbon-dashboards

WSO2 Dashboard Component

---

Branch	Build Status
master

---

Getting Started

Please follow the below steps to setup the WSO2 Dashboard Component.

1. Clone and build carbon-dashboards repository.
2. Clone and build the carbon-ui-server repository available here ( Carbon-UI-Server - https://github.com/wso2/carbon-ui-server )
3. Install Dashboard Core API Feature and Dashboard Portal Feature in to distribution available in carbon-ui-server.

You can add following properties to pom file available in Carbon-UI-Server/tests/distribution directory.

        <dependency>
            <groupId>org.wso2.carbon.dashboards</groupId>
            <artifactId>org.wso2.carbon.dashboards.api.feature</artifactId>
            <version>4.0.0-SNAPSHOT</version>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>org.wso2.carbon.dashboards</groupId>
            <artifactId>org.wso2.carbon.dashboards.portal.feature</artifactId>
            <version>4.0.0-SNAPSHOT</version>
            <type>zip</type>
        </dependency>

        <feature>
            <id>org.wso2.carbon.dashboards.api.feature</id>
            <version>4.0.0-SNAPSHOT</version>
        </feature>
        <feature>
            <id>org.wso2.carbon.dashboards.portal.feature</id>
            <version>4.0.0-SNAPSHOT</version>
        </feature>

4. Unzip the distribution and run the server. You can access the dashboard component from https://localhost:9292/analytics-dashboard/ or http://localhost:9090/analytics-dashboard/

License

Carbon dashboards is available under the Apache 2 License.

How To Contribute

• Please report issues at WSO2 Dashboards Issues.
• Send your pull requests https://github.com/wso2/carbon-dashboards.
• You can find more instructions on howto contribute on community site (http://wso2.com/community).

Contact Us

WSO2 developers can be contacted via the mailing lists:

• WSO2 Developers List : [email protected]
• WSO2 Architecture List : [email protected]

carbon-dashboards's Issues

Remove sortable library and use jQuery Draggable/Droppable instead

We are using Sortable library to manage widget listing. Apart from listing drag/drop capability is also coming from this lib. It should be possible to remove this lib and use jQuery Draggable/Droppable instead

https://github.com/wso2/carbon-dashboards/blob/uuf-portal/components/org.wso2.carbon.dashboards.designer/src/main/fragments/dashboard-designer/public/js/common/Sortable.js

            Sortable.create(document.getElementById("gadgetList"), {
                group: {
                    name: 'tile__list',
                    pull: 'clone',
                    put: false
                },
                animation: 150,
                sort: true
            }); 

Dashboard is not rendered with widget-state in newly created pages

Add multiple page support

The dashboard designer should have capability to create multiple pages for a single dashboard. The view should also provide navigation between pages as well.

Block size cannot be changed in add block

Cannot drag and change the width and height of the block

Light theme is not added

Theme switching doesn't work since the light theme is not present

Allow loading partial from the widget.conf

Currently the whole widget.conf file is loaded at once. Instead we need to load specific partial from the widget.conf.

Empty blocks are shown in the view mode

When there are empty blocks without any widget, the title bar of those are shown in view mode

Deleting a dashboard in dashboard listing page doesn't work

Left panel needs to be collapsed after the selections

1. Create a dashboard and add a new page
2. Click on the desired layout

Left panel needs to collapsed after the layout selection.

The dashboard should be able to same with Empty Content.

$subject.

Create portal feature to install dashboard react app to products

Currently, there is no feature to install dashboard component react app to WSO2 products. We need to implement a feature which will install the dashboard component into WSO2 products.

Add test cases for dashboard REST APIs

Currently, there are several REST APIs to add, modify, delete, list and get dashboards. We need to test these APIS using a testing framework.

APIs to read widget related information and Interface to implement for others (CEP)

There should be APIs to get predefined widget related information and an interface that can be implemented to provide their own implementation. Eg :- In CEP usecase, they are going to provide their own implementation to get widget related information by implementing above mentioned interface

Update ReadMe

The current readme is out-dated. It needs to be updated with information as what is carbon-dashboard, etc..

Expose dashboard's APIs per contexts

Currently dashboard related APIs are exposed in the designer component. But we need to expose these apis from both designer and view component.

Upload images for Readme

View dashboard link in designer needs to be corrected

The button in the designer to navigate to the view shows as VIEW.DASHBOARD
Also it doesn't take the user to view mode.

Integrate Mocha as a testing framework

Since we do not have any testing frameworks to test the dashboard component. we need to integrate suitable testing framework.

Left panel doesn't stay fixed when scrolled

Left panel which contains Gadgets, Add Block and Pages leaves the page when scrolled down.
Ex: If a user wants to add a gadget to a block which in the very bottom of the page, that cannot be done.

Move widgets into common UUF component

Currently dashboard widgets are in the designer component. We should move these widgets into common UUF component and use it. Since they are sample widgets, we have to name this component as "sample store" or etc. Moreover we have to change current widgetInfoProvider into sample bundle and make a separate sample feature to install it.

Pie Chart sample widget is not a pie chart but a scatter chart

Either rename the widget to scatter chart or change the rendering to a pie chart

Fix dashboard APIs to have proper URL patterns

Dashboard APIs have invalid actions such as /add, /update and /delete to define CRUD operations. This needs to be fixed to have proper resource types and actions.

Add Sharable dashboard support

User should be able to share a dashboard by providing a URL. The current state of the dashboard needs to be persisted once the other users viewing the dashboard.

Pub Sub doesn't work in designer mode

Remove temporary img src and use wso2-icon/proper thumbnail instaed

https://github.com/wso2/carbon-dashboards/blob/uuf-portal/components/org.wso2.carbon.dashboards.designer/src/main/fragments/widget-list-container/widget-list-container.hbs#L3

CEP - getDatasources

I'm trying to create a new gadget in the dashboard 'create a gadget' feature. I've configured a datasource in CEP and am getting an error message back "No datasources available to create a gadget. Please create a datasource to proceed.". Looking at rt.jag it looks as though you are searching for eventPublishers that are of type ui. This doesn't look right to me. Please help.

Use UUFClient in dashboard view

Currently dashboard view does not use UUFClient in order to render widgets and widget boxes. We need to use UUFClient in dashboard view and remove hard coded html segments.

Introduce theme support using GoldenLayout

Currently, we do not have the theme support in react-based dashboard component. We need to provide the inbuilt dark-light theme support using available css of GoldenLayout framework.

Search doesn't work in widget listing

Create a common UUF component to host artifacts to both designer and view

Eg:-

• publishToTopics function can be exposed via portal.dashboards.functions.common global object rather exposing via portal.dashboards.functions.view and portal.dashboards.functions.designer
• Expose apis via this component

"Show Grid" sliding radio button in add block left panel doesn't work

Externalize database scripts

Currently the database scripts are hard-coded. We need to externalize these database scripts, hence it is possible to maintain separate sets of queries for each database types.

Use existing libraries available in UUF-Commons

Currently carbon-dashboards uses separate libraries for jquery, wso2theme and etc. But these libraries are available from UUF level. So we need to use this libraries in carbon-dashboards

Properly copy samples to the distribution

With the current implementation the sources of the samples are resides in /samples while all the transpiled sample widgets are copied into the portal feature. This is not the correct implementation since the keeping the transpiled JS files are similar to keeping compiled class files along with the sources.

Therefore this needs to be rectified by providing a proper way to compile and deploy the samples by user or the component compile time.

Save widget states for sharing dashboards

A user should be able to share a dashboard by copying the dashboard URL.

In this case the problem is that the state (drill-down levels, user selections) are not getting shared with the other party. Therefore there should be a mechanism to store the current state of the dashboard when sharing.

Modify the dashboard.json to place widgets inside blocks

Currently dashboard.json maps widgets with each block using the block ID as follows.

{
  ...
  "blocks": [
    {
      "id": "3f64fcc44bafcd84a593072c6c9bdbd603",
      "x": 0,
      "y": 0,
      "width": 6,
      "height": 4
    },
    ...
  ],
  "widgets": {
    "3f64fcc44bafcd84a593072c6c9bdbd603": {
        ...
    },
    ...
  },
  ...
}

Instead it is better and cleaner if we can remove this mapping and place the widget descriptor within the block itself as follows.

{
  ...
  "blocks": [
    "3f64fcc44bafcd84a593072c6c9bdbd603": {
      "x": 0,
      "y": 0,
      "width": 6,
      "height": 4,
      "widget": {
        ...
      }
    },
    ...
  ],
  ...
}

Review and refactor the Dashboard REST APIs

Currently, dashboard based REST APIs are implemented as follows,

https://localhost:9292/dashboards

We need to change it following proper way,

https://localhost:9292/apis/dashboards

Revamp dashboard UI using Material UI

Currently the dashboard UI is based on previous dashboard server user interfaces. This uses Bootstrap, jQuery and Theme WSO2 heavily. This needs to be fixed and the new user interfaces needs to be re-written using Material UI.

Remove unnecessary libs from designer

Currently there are some additional libraries in the designer. We need to remove these libs from designer.

Intial implementation for dashboard designer

Currently there is no working implementation in dashboard designer. So we need to provide working solution for dashboard designer which will cover basic use cases of Analytics & CEP

Cannot read length from undefined in widget list

When there are no widget info providers. There is a client side error in rendering widget list as mentioned in the subject.

User-pref widget readme image

Widgets in first page are shown in newly added pages

Steps to reproduce

1. Create a new dashboards and add a new page
2. Add a widget state widget into a block
3. Add another page

Second page will have the widget added in the first page.

Load order doesn't get saved

isNan should be isNaN at [1]

[1] https://github.com/wso2/carbon-dashboards/blob/uuf-portal/components/org.wso2.carbon.dashboards.designer/src/main/fragments/dashboard-designer/public/js/designer.js#L397

Widget cannot be added to a newly added block in a page

Steps to reproduce

1. Create a dashboard and add a page with a desired layout
2. Add a new block to the page from left panel
3. Add a widget to the newly added block (Not to an existing block)
4. Widget doesn't get rendered until a page refresh

Remove unwanted common fragment in designer component

Check if [1] is used, if not remove.

[1] https://github.com/wso2/carbon-dashboards/blob/uuf-portal/components/org.wso2.carbon.dashboards.designer/src/main/fragments/common/public/js/widget-renderer.js

Implement dashboard component with React

The following features should be available with the first milestone.

• Dashboard listing (This will retrieve the dashboard from the DB and list down)
• Backend API support for dashboard CRUD activities.
• Dashboard view support (This will retrieve the selected dashboard from DB and render using Golden Layout)
• Multiple pages support for dashboards (This will introduce multiple pages at the same level, We need to support hierarchical page support )
• Internal routing between dashboard listing and dashboard view

Replace "Gadget" everywhere with "Widget"

Ex : left panel, top menu

Remove the dashboard database from portal feature

Currently, we are packing dashboard database with sample dashboard and copy it from the portal feature. We need to do the samples in a proper way and remove the dashboard database from portal feature.

Add library support from uuf-commons

Currently carbon-dashboards keeps several libraries such as gridstack, jquiry-ui, underscore within the repo itself. We need to move these libraries into carbon-uuf-commons repo and use it.