Adjust IDE label truncation in Code Suggestions acceptance by IDE chart
What does this MR do and why?
Reduces y-axis label truncation from 10 to 9 characters to prevent horizontal cutoff.
References
Screenshots or screen recordings
| Before | After |
|---|---|
|
|
How to set up and validate locally
Apply the following diff:
diff --git a/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/code_suggestions_acceptance_by_ide.js b/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/code_suggestions_acceptance_by_ide.js
index e279f1990b72..bdbdb2049604 100644
--- a/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/code_suggestions_acceptance_by_ide.js
+++ b/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/code_suggestions_acceptance_by_ide.js
@@ -16,6 +16,23 @@ const extractAiMetricsResponse = (result) =>
resultKey: 'aiMetrics',
});
+/* eslint-disable @gitlab/require-i18n-strings */
+// Mock data for testing long IDE names
+const MOCK_CHART_DATA = [
+ [45, 'Neovim with Language Server Protocol'],
+ [90, 'RubyMine'],
+ [120, 'JetBrains IntelliJ IDEA'],
+ [150, 'Visual Studio Code'],
+];
+
+const MOCK_CONTEXTUAL_DATA = {
+ 'Visual Studio Code': { acceptanceRate: 0.75, shownCount: 200 },
+ 'JetBrains IntelliJ IDEA': { acceptanceRate: 0.67, shownCount: 180 },
+ RubyMine: { acceptanceRate: 0.64, shownCount: 140 },
+ 'Neovim with Language Server Protocol': { acceptanceRate: 0.45, shownCount: 100 },
+};
+/* eslint-enable @gitlab/require-i18n-strings */
+
const fetchAllCodeSuggestionsIdeMetrics = async (variables) => {
const rawAiMetricsQueryResult = await defaultClient.query({
query: AiMetricsQuery,
@@ -123,7 +140,7 @@ export default async function fetch({
const { chartData, contextualData } = extractAcceptanceMetricsByIde(successful);
- if (!chartData.some(([value]) => value)) return {};
+ // if (!chartData.some(([value]) => value)) return {};
setVisualizationOverrides({
visualizationOptionOverrides: {
@@ -136,7 +153,7 @@ export default async function fetch({
});
return {
- [__('Suggestions accepted')]: chartData,
- contextualData,
+ [__('Suggestions accepted')]: MOCK_CHART_DATA,
+ contextualData: MOCK_CONTEXTUAL_DATA,
};
}
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Related to #550064 (closed)
Edited by Rudy Crespo

