Extend AnalyticsDashboards to render group level VSD
What does this MR do and why?
This MR:
- Renders the Value streams Dashboard as a customizable dashboard when the
group_analytics_dashbaordsfeature flag is enabled - Extends
analytics_dashboard.vueto query for group namespaces as well as project namespaces - Extends
analytics_dashboard.vueto accept an existing dashboard configuration via thecustomDashboardsProjectConfigurationproperty - Renames
value_stream_dashboard.yaml->value_streams_dashboard.yamlas the built-in YAML config name needs to match theslugname thats used in the URLs. We already usevalue_streams_dashboardas the slug
Note: the dora performers score panel is currently not supported as a visualization.
Related to #415754 (closed)
This renders VSD using customizable dashboards in various ways:
-
Render group VSD without YAML config -
Render group VSD with YAML config -
Render project VSD without YAML config -
Render project VSD with YAML config
How to set up and validate locally
Setup - seeding data
Enable the combined_analytics_dashboards feature flags in the rails console
Feature.enable(:combined_analytics_dashboards)
- Create a group
- Create 2 projects in the group
- One project will be used to store a YAML config
- The other project should be used to Seed DORA metrics data
- Seed DORA metrics data for the selected project
- Create a value stream for the project with seeded data
Without the group dashboard listing
| Before | After |
|---|---|
![]() |
![]() |
- Navigate to Value Stream Analytics for the seeded project
- Click the
Value Streams Dashboard | DORAlink from the Value stream page- The link will take you to the group VSD page, with the project path appended as a
queryparameter - The value stream dashboard will load with 2 tables (top table for the current group, bottom for the project)
- The DORA performers chart will also render
- The link will take you to the group VSD page, with the project path appended as a
- Visit the group page
http://<gdk>/groups/<group-path> - From the left sidebar, click the
Analyze>Analytics Dashboardslink- The link will take you to the group VSD page, with no
queryparameter - The value stream dashboard will load with 1 table for the group data
- The DORA performers chart will also render
- The link will take you to the group VSD page, with no
With group level dashboard listing - no YAML config
| Before | After |
|---|---|
![]() |
![]() |
Enable the group_analytics_dashboards feature flag in the rails console
Feature.enable(:group_analytics_dashboards)
- From the left sidebar, click the
Analyze>Application analyticslink (Not Analytics dashboards) - The group dashboard list should appear, select
Value Stream Dashboard(should be the only option)- The page should render the same as the previous section
- Navigate to Value Stream Analytics for the seeded project
- Click the
Value Streams Dashboard | DORAlink from the Value stream page- The page should render the same as the previous section
With a YAML config
| Before | After |
|---|---|
![]() |
![]() |
We will use the empty project we created in the setup section to host the YAML config, we will then point the group / to this empty project to read the configuration.
-
Create a YAML config in the empty project
- For now, we need to support both the
dataandqueryOverridesfields (see the example linked below) - Give a custom title that you will recognize
- Update each entry under
panelsinclude anid(increment for each panel),visualizationand thegridAttributesfields (add6to theyPosfor each subsequent panel, for example:
- For now, we need to support both the
panels:
- id: 1
title: ...
data: ...
visualization: dora_chart
gridAttributes:
yPos: 1
xPos: 0
width: 12
height: 6
- id: 2
title: ...
data: ...
visualization: dora_chart
gridAttributes:
yPos: 7
xPos: 0
width: 12
height: 6
- From the left sidebar, click the
Analyze>Application analyticslink (Not Analytics dashboards) - The group dashboard list should appear, select
Value Stream Dashboard(should be the only option)- The page should render according to the YAML config
- Make changes to the YAML file and observe
Example YAML config
panels:
# Example project config
- id: 1
title: 'My Custom Project'
visualization: dora_chart
gridAttributes:
yPos: 1
xPos: 0
width: 12
height: 6
data:
namespace: vsd-config-test/dora-project
# Example group config
- id: 2
title: "cool title!"
visualization: dora_chart
gridAttributes:
yPos: 7
xPos: 0
width: 12
height: 6
data:
namespace: vsd-config-test
queryOverrides:
namespace:
requestPath: vsd-config-test
isProject: false
filter_labels:
- in_development
- in_review
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Edited by Ezekiel Kigbo





