Skip to content

Add error state to panels

Elwyn Benson requested to merge 391707-panels-error-state into master

What does this MR do and why?

Add error state to customizable dashboard panels, including a top red border to show the panel is in an error state, a warning icon, and a popover on hover which includes a link to our troubleshooting help doc.

Also update the empty state text to match the new error state text - left aligned / inline.

Design for this iteration First iteration design

Note that this is an experimental feature behind default off feature flags.

Screenshots or screen recordings

Before After
image image
image (empty state now inline to match error text style) image
(error text wraps when inside a tiny panel) image

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. View a dashboard, and verify the panel empty state is in the updated style
  4. Now cause some panels to fail to load
  • 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 change the measure to some invalid value, so the query will fail.
  1. Verify the new error state is shown, and the panel has a popover including a link to the troubleshooting docs

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 #391707 (closed)

Edited by Elwyn Benson

Merge request reports