Skip to content

Refactor panels base for clearer separation of concerns

What does this MR do and why?

This MR refactors the panels_base.vue component for clearer separation of concerns as described in Refactor panels base component for clearer sepa... (#442752 - closed) without making any visual changes. Doing so makes the shared panels_base.vue component reusable on any dashboard and not just limited to analytics dashboards. It also improves maintainability by splitting what was a very large component into two smaller ones.

The following changes are made:

  • Refactored panels_base.vue to be agnostic and thus reusable component outside of just analytics dashboards.
  • Added a new analytics_panel.vue component that wraps panels_base.vue with all the analytics specific domain logic.
  • Updated and fixed the panels base component story.

Next-ups:

  • Render analytics_panel.vue inside analytics_dashboard.vue using a customizable_dashboard.vue slot for further seperation of concerns.
    • I opted to not do this here because this MR is already large.

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

No visual changes.

Behaviour dashboard.

Before After
image image

Viz designer

Before After
image image

Error + empty state

Before After
image image

How to set up and validate locally

  1. Enable Product analytics on your GDK by following the instructions.
  2. Navigate to Project > Analytics > Dashboards and set up product analytics.
  3. Navigate to Project > Analytics > Dashboards and follow the alert to enable customizable dashboards.
  4. Navigate to Project > Analytics > Dashboards and create a custom dashboard.
  5. Navigate to Project > Analytics > Dashboards and use the visualization designer.

To create a visualization error disable your Product analytics provider while querying a product analytics dashboard.

Related to #442752 (closed)

Edited by Jiaan Louw

Merge request reports