Fix chart theme not updating on theme change

Salim Zidanerequested to merge
gitlab-community/gitlab-org/developer-relations/contributor-success/contributors-gitlab-com:494/reactive-chart into main

What does this MR do and why?

Related to #494 (closed)

Fixes a bug where the dashboard chart does not update its colors when switching between light and dark themes.

The fix adds a reference to store.theme inside the chart computed property in DashboardChart.vue. This makes Vue track the theme as a reactive dependency and re-evaluate the chart config everytime the theme changes.

Screenshots or screen recordings

Before:

After:

Validation steps

  1. Go to /dashboard
  2. Note the chart colors in the current theme (light or dark)
  3. Switch theme using the theme switcher in the navbar
  4. Observe that the chart colors now update to match the new theme
  5. Switch back and confirm the colors revert correctly

/cc @leetickett-gitlab

Merge request reports