Skip to content

Render Value streams dashboard as customizable dashboard

Problem to solve

We want to integrate the Value streams dashboard page into the product analytics schema driven UI. The current Value streams dashboard is a separate page renders separately with its own layout and styling.

Goal

We currently support 2 types of configuration for the value streams dashboard page:

Feature flags

At the current stage, there are a series of features flags that are used in different combinations and will need to be accounted for when rendering VSD as a customizable dashboard.

groupproduct analytics use various feature flags to toggle different behaviours, these mostly affect the project level dashboards and listing (atm)

groupoptimize are working on a group level listing and dashboards.

Noteworthy feature flags:

  • group_analytics_dashboards enables the group level dashboards listing
  • product_analytics_dashboards enables project level dashboards listing
  • combined_analytics_dashboards enables the sidebar menu item for analytics dashboards (project level)

Implementation

While groupproduct analytics are focused on project level dashboards, VSD is currently available at both the group and project level. We need to also be able to support a default config as well as customization via YAML.

An additional concern is the series of feature flags that are currently in flight. The implementation for this MR should involve a mixture of:

User flow

graph TD
    %% Group level
    %% :combined_analytics_dashboards enables the analytics pointer settings
    %% :group_level_analytics_dashboard is the ultimate feature for project pointer
    grouphome[Visit group]
    grouphome-->grouplink
    grouplink[Render link to\n analytics dashboards]
    grouplink--Select analytics dashboards-->groupcheck
    groupcheck{:group_analytics_dashboards}
    groupcheck-- disabled -->groupnoff[Render group VSD]
    groupcheck-- enabled -->groupff[Render dashboard listing]
    groupff-- Select VSD -->groupnoff
    groupnoff-->groupcheckconfig{YAML config\n + :group_level_analytics_dashboard license}
    groupcheckconfig-- No -->groupnoyaml[Render builtin\n default VSD]
    groupcheckconfig-- Yes -->groupyaml[Render VSD from config]
    %% Project level
    %% :project_level_analytics_dashboard is the ultimate feature for project pointer
    projecthome[Visit project]
    projecthome-->projectcheck
    projectcheck{:combined_analytics_dashboards \n :product_analytics_dashboards}
    projectcheck-- disabled -->projectnoff[No dashboard listing\n No link to dashboards]
    projectcheck-- enabled -->projectff[Render dashboard listing]
    projectff-- Select VSD -->projectvsd[Render project VSD\n in product analytics]
    projectnoff-- Select VSA -->projectvsa[Render project VSA]
    projectvsa-- Select VSD-->projectvsacheckconfig{YAML config\n + :project_level_analytics_dashboard license}
    projectvsacheckconfig-- No -->projectvsanoyaml[Link to group VSD\n with query parameter]
    projectvsacheckconfig-- Yes -->projectvsayaml[Render VSD from config]
    projectvsd-->projectcheckconfig{YAML config\n + :project_level_analytics_dashboard license}
    projectcheckconfig-- No -->projectnoyaml[Render builtin\n default VSD]
    projectcheckconfig-- Yes -->projectyaml[Render VSD from config]

Draft feature flag matrix

Feature flag status Group - Use current VSD app w/ shared component Project - Use current VSD app w/ shared component Render in product analytics
All disabled
group_analytics_dashboards=true
project_analytics_dashboards=true
Both enabled

Expected behaviour

Changes should be available both on the group and project level:

  • When the namespace has a yaml config file, we should render a customizable dashboard that respects the configuration file
  • When there is no yaml config, we render panels based on conditions:
    • If it is a group or sub group, only render the group panel
    • If it is a project, render a panel for the parent as well as the project
    • If there is a query parameter, render a panel for the parent as well as (up to 4) items specified in the query
  • We will need to conditionally show / hide the default date range filter as VSD does not support filtering by date range (see the note about Default dates ranges)

Notes

Default dates ranges

The product analytics schema driven dashboards use set dates filter (7 days, 30 days etc), but VSD shows data in monthly intervals, going back 3months in the table and 6months for the sparklines.

Edited by Ezekiel Kigbo