Improve AI impact analytics dashboard trend indicator tooltips
What does this MR do and why?
Adds a new Incomparable data
message when the change % cannot be calculated due to insufficient data, or a divide by zero error. Refactor the change calculation into a separate util method to simplify the test suite
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
Unable to calculate when data is missing
Change from 0 to 0
Change from 4 to 0 (metric in the last column is an incomplete data set, so we use the 2nd last column instead)
Change from 0 to 2
Change from '-' to 2
How to set up and validate locally
- Configure your GDK to use ClickHouse
# enable clickhouse
Feature.enable(:clickhouse_data_collection)
Feature.enable(:event_sync_worker_for_click_house)
# enable the worker to sync code suggestions events to clickhouse
Feature.enable(:code_suggestion_events_in_click_house)
- Ensure that you are using GitLab Ultimate
- Create a new group
- Navigate to the Analytics dashboard page for the new group (ex. http://gdk.test:3000/groups/flightjs/-/analytics/dashboards)
- Select the
AI impact analytics
dashboard - Verify that the
Change %
column tooltip is appropriate for the data provided
I recommend mocking the data using this patch, as it is difficult to assign specific values to columns of the table
diff --git a/ee/app/assets/javascripts/analytics/dashboards/ai_impact/components/metric_table.vue b/ee/app/assets/javascripts/analytics/dashboards/ai_impact/components/metric_table.vue
index e70165069dab..5c2744bc28ca 100644
--- a/ee/app/assets/javascripts/analytics/dashboards/ai_impact/components/metric_table.vue
+++ b/ee/app/assets/javascripts/analytics/dashboards/ai_impact/components/metric_table.vue
@@ -157,7 +157,25 @@ export default {
async fetchTableMetrics({ metrics, queryFn }) {
try {
- const data = await fetchMetricsForTimePeriods(DASHBOARD_TIME_PERIODS, queryFn);
+ let data = await fetchMetricsForTimePeriods(DASHBOARD_TIME_PERIODS, queryFn);
+
+ const metricId = 'vulnerability_critical';
+ const metricValues = [0, 5, 6, 1, 2, 3];
+ data = data.map(
+ (timePeriod, index) => {
+ if (metricId in timePeriod) {
+ return {
+ ...timePeriod,
+ vulnerability_critical: {
+ identifier: metricId,
+ value: metricValues[index],
+ },
+ };
+ }
+ return timePeriod;
+ },
+ );
+
this.tableData = mergeTableData(this.tableData, generateTableRows(data));
} catch (error) {
throw metrics;
Related to #462713 (closed)
Edited by Alex Pennells