Skip to content

Display visualization validation errors on the dashboard

Elwyn Benson requested to merge 420685-visualization-validation into master

What does this MR do and why?

Frontend changes to integrate backend work Validate visualizations and provide errors via ... (!128247 - merged)

Backend now returns validation errors for any misconfigured visualizations. We display these validation errors in the relevant panel so customers know what needs fixing. Additionally, skip fetching data when we know the panel is in an invalid state, and do not provide the option to retry with the invalid configuration.

Also adds some extra margin between the error icon and the panel title, as they were running into each other.

Note that this feature is experimental / behind a default-off feature flag

Screenshots or screen recordings

Before After

image.png

image.png(when visualization structure is invalid)

image.png(when visualization structure is invalid, multiple issues)

image.png

image.png(when visualization structure is valid, but CubeJS returns an error, e.g. due to a bad query)

image.png

(no additional error details are shown if the request fails for some unknown / generic reason - this is how it currently looks)

image.png

image.png

(now with more margin between error icon and title!)

How to set up and validate locally

  1. Follow these instructions to setup Product Analytics in GDK.
  2. Onboard a project at Project -> Analyze -> Analytics dashboards
  3. Modify a visualization to have invalid configuration
    1. An easy way to do this is to temporarily modify a built in visualization, e.g. ee/lib/gitlab/analytics/product_analytics/visualizations/sessions_over_time.yaml and add a new / unexpected property
  4. Verify the new error state is shown
    1. Panel is in "error" state
    2. Panel has a popover including a link to the troubleshooting docs, as well as the specific validation error returned from the backend
    3. Panel popover does not include the option to retry
  5. Verify existing error state works as expected
    1. An easy way to do this is to temporarily modify a built in visualization, e.g. ee/lib/gitlab/analytics/product_analytics/visualizations/sessions_over_time.yaml and modify the measure to an invalid value. Now the visualization will pass the validation check, but the request to CubeJS will fail
    2. Panel should have the option to retry the failed request

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #420685 (closed)

Edited by Elwyn Benson

Merge request reports