Skip to content

G
gitlab-ce
Commit d3de75ba authored by Phil Hughes's avatar Phil Hughes
Browse files
Options

Merge branch '342984-display-average-median-for-dora4-in-graphs' into 'master' 

Display average for Deployment Frequency in CI/CD Analytics

See merge request gitlab-org/gitlab!78358
parents d7ef6e97 d9fb45d6
Hide whitespace changes
Inline Side-by-side
Showing with 627 additions and 4 deletions
ee/app/assets/javascripts/dora/components/deployment_frequency_charts.vue
View file @ d3de75ba
......@@ -2,12 +2,14 @@
import * as Sentry from '@sentry/browser';
import * as DoraApi from 'ee/api/dora_api';
import createFlash from '~/flash';
import { s__ } from '~/locale';
import { s__, sprintf } from '~/locale';
import CiCdAnalyticsCharts from '~/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue';
import DoraChartHeader from './dora_chart_header.vue';
import {
allChartDefinitions,
areaChartOptions,
averageSeriesOptions,
averageSeriesName,
chartDescriptionText,
chartDocumentationHref,
LAST_WEEK,
......@@ -15,7 +17,7 @@ import {
LAST_90_DAYS,
CHART_TITLE,
} from './static_data/deployment_frequency';
import { apiDataToChartSeries } from './util';
import { apiDataToChartSeries, seriesToAverageSeries } from './util';
export default {
name: 'DeploymentFrequencyCharts',
......@@ -33,6 +35,11 @@ export default {
default: '',
},
},
chartInDays: {
[LAST_WEEK]: 7,
[LAST_MONTH]: 30,
[LAST_90_DAYS]: 90,
},
data() {
return {
chartData: {
......@@ -76,7 +83,19 @@ export default {
throw new Error('Either projectPath or groupPath must be provided');
}
this.chartData[id] = apiDataToChartSeries(apiData, startDate, endDate, CHART_TITLE);
const seriesData = apiDataToChartSeries(apiData, startDate, endDate, CHART_TITLE);
const { data } = seriesData[0];
this.chartData[id] = [
...seriesData,
{
...averageSeriesOptions,
...seriesToAverageSeries(
data,
sprintf(averageSeriesName, { days: this.$options.chartInDays[id] }),
),
},
];
}),
);
......
ee/app/assets/javascripts/dora/components/static_data/deployment_frequency.js
View file @ d3de75ba
......@@ -3,6 +3,8 @@ import { s__ } from '~/locale';
export * from './shared';
export const averageSeriesName = s__('DORA4Metrics|Average (last %{days}d)');
export const CHART_TITLE = s__('DORA4Metrics|Deployment frequency');
export const areaChartOptions = {
......
ee/app/assets/javascripts/dora/components/static_data/shared.js
View file @ d3de75ba
......@@ -36,6 +36,12 @@ const sharedRequestParams = {
per_page: 100,
};
export const averageSeriesOptions = {
areaStyle: {
opacity: 0,
},
};
export const allChartDefinitions = [
{
id: LAST_WEEK,
......
ee/app/assets/javascripts/dora/components/util.js
View file @ d3de75ba
......@@ -147,3 +147,24 @@ export const buildNullSeriesForLeadTimeChart = (seriesData) => {
return [nullSeries, nonNullSeries];
};
/**
* Converts a data series into a formatted average series
*
* @param {Array} chartSeriesData Correctly formatted chart series data
*
* @returns {Object} An object containing the series name and an array of original data keys with the average of the dataset as each value.
*/
export const seriesToAverageSeries = (chartSeriesData, seriesName) => {
if (!chartSeriesData) return {};
const average =
Math.round(
(chartSeriesData.reduce((acc, day) => acc + day[1], 0) / chartSeriesData.length) * 10,
) / 10;
return {
name: seriesName,
data: chartSeriesData.map((day) => [day[0], average]),
};
};
ee/spec/frontend/dora/components/__snapshots__/deployment_frequency_charts_spec.js.snap
View file @ d3de75ba
......@@ -37,6 +37,42 @@ Array [
],
"name": "Deployment frequency",
},
Object {
"areaStyle": Object {
"opacity": 0,
},
"data": Array [
Array [
"Jun 27",
0.7,
],
Array [
"Jun 28",
0.7,
],
Array [
"Jun 29",
0.7,
],
Array [
"Jun 30",
0.7,
],
Array [
"Jul 1",
0.7,
],
Array [
"Jul 2",
0.7,
],
Array [
"Jul 3",
0.7,
],
],
"name": "Average (last 7d)",
},
],
"endDate": 2015-07-04T00:00:00.000Z,
"id": "LAST_WEEK",
......@@ -177,6 +213,134 @@ Array [
],
"name": "Deployment frequency",
},
Object {
"areaStyle": Object {
"opacity": 0,
},
"data": Array [
Array [
"Jun 4",
0.2,
],
Array [
"Jun 5",
0.2,
],
Array [
"Jun 6",
0.2,
],
Array [
"Jun 7",
0.2,
],
Array [
"Jun 8",
0.2,
],
Array [
"Jun 9",
0.2,
],
Array [
"Jun 10",
0.2,
],
Array [
"Jun 11",
0.2,
],
Array [
"Jun 12",
0.2,
],
Array [
"Jun 13",
0.2,
],
Array [
"Jun 14",
0.2,
],
Array [
"Jun 15",
0.2,
],
Array [
"Jun 16",
0.2,
],
Array [
"Jun 17",
0.2,
],
Array [
"Jun 18",
0.2,
],
Array [
"Jun 19",
0.2,
],
Array [
"Jun 20",
0.2,
],
Array [
"Jun 21",
0.2,
],
Array [
"Jun 22",
0.2,
],
Array [
"Jun 23",
0.2,
],
Array [
"Jun 24",
0.2,
],
Array [
"Jun 25",
0.2,
],
Array [
"Jun 26",
0.2,
],
Array [
"Jun 27",
0.2,
],
Array [
"Jun 28",
0.2,
],
Array [
"Jun 29",
0.2,
],
Array [
"Jun 30",
0.2,
],
Array [
"Jul 1",
0.2,
],
Array [
"Jul 2",
0.2,
],
Array [
"Jul 3",
0.2,
],
],
"name": "Average (last 30d)",
},
],
"endDate": 2015-07-04T00:00:00.000Z,
"id": "LAST_MONTH",
......@@ -557,6 +721,374 @@ Array [
],
"name": "Deployment frequency",
},
Object {
"areaStyle": Object {
"opacity": 0,
},
"data": Array [
Array [
"Apr 5",
0.1,
],
Array [
"Apr 6",
0.1,
],
Array [
"Apr 7",
0.1,
],
Array [
"Apr 8",
0.1,
],
Array [
"Apr 9",
0.1,
],
Array [
"Apr 10",
0.1,
],
Array [
"Apr 11",
0.1,
],
Array [
"Apr 12",
0.1,
],
Array [
"Apr 13",
0.1,
],
Array [
"Apr 14",
0.1,
],
Array [
"Apr 15",
0.1,
],
Array [
"Apr 16",
0.1,
],
Array [
"Apr 17",
0.1,
],
Array [
"Apr 18",
0.1,
],
Array [
"Apr 19",
0.1,
],
Array [
"Apr 20",
0.1,
],
Array [
"Apr 21",
0.1,
],
Array [
"Apr 22",
0.1,
],
Array [
"Apr 23",
0.1,
],
Array [
"Apr 24",
0.1,
],
Array [
"Apr 25",
0.1,
],
Array [
"Apr 26",
0.1,
],
Array [
"Apr 27",
0.1,
],
Array [
"Apr 28",
0.1,
],
Array [
"Apr 29",
0.1,
],
Array [
"Apr 30",
0.1,
],
Array [
"May 1",
0.1,
],
Array [
"May 2",
0.1,
],
Array [
"May 3",
0.1,
],
Array [
"May 4",
0.1,
],
Array [
"May 5",
0.1,
],
Array [
"May 6",
0.1,
],
Array [
"May 7",
0.1,
],
Array [
"May 8",
0.1,
],
Array [
"May 9",
0.1,
],
Array [
"May 10",
0.1,
],
Array [
"May 11",
0.1,
],
Array [
"May 12",
0.1,
],
Array [
"May 13",
0.1,
],
Array [
"May 14",
0.1,
],
Array [
"May 15",
0.1,
],
Array [
"May 16",
0.1,
],
Array [
"May 17",
0.1,
],
Array [
"May 18",
0.1,
],
Array [
"May 19",
0.1,
],
Array [
"May 20",
0.1,
],
Array [
"May 21",
0.1,
],
Array [
"May 22",
0.1,
],
Array [
"May 23",
0.1,
],
Array [
"May 24",
0.1,
],
Array [
"May 25",
0.1,
],
Array [
"May 26",
0.1,
],
Array [
"May 27",
0.1,
],
Array [
"May 28",
0.1,
],
Array [
"May 29",
0.1,
],
Array [
"May 30",
0.1,
],
Array [
"May 31",
0.1,
],
Array [
"Jun 1",
0.1,
],
Array [
"Jun 2",
0.1,
],
Array [
"Jun 3",
0.1,
],
Array [
"Jun 4",
0.1,
],
Array [
"Jun 5",
0.1,
],
Array [
"Jun 6",
0.1,
],
Array [
"Jun 7",
0.1,
],
Array [
"Jun 8",
0.1,
],
Array [
"Jun 9",
0.1,
],
Array [
"Jun 10",
0.1,
],
Array [
"Jun 11",
0.1,
],
Array [
"Jun 12",
0.1,
],
Array [
"Jun 13",
0.1,
],
Array [
"Jun 14",
0.1,
],
Array [
"Jun 15",
0.1,
],
Array [
"Jun 16",
0.1,
],
Array [
"Jun 17",
0.1,
],
Array [
"Jun 18",
0.1,
],
Array [
"Jun 19",
0.1,
],
Array [
"Jun 20",
0.1,
],
Array [
"Jun 21",
0.1,
],
Array [
"Jun 22",
0.1,
],
Array [
"Jun 23",
0.1,
],
Array [
"Jun 24",
0.1,
],
Array [
"Jun 25",
0.1,
],
Array [
"Jun 26",
0.1,
],
Array [
"Jun 27",
0.1,
],
Array [
"Jun 28",
0.1,
],
Array [
"Jun 29",
0.1,
],
Array [
"Jun 30",
0.1,
],
Array [
"Jul 1",
0.1,
],
Array [
"Jul 2",
0.1,
],
Array [
"Jul 3",
0.1,
],
],
"name": "Average (last 90d)",
},
],
"endDate": 2015-07-04T00:00:00.000Z,
"id": "LAST_90_DAYS",
......
ee/spec/frontend/dora/components/util_spec.js
View file @ d3de75ba
import lastWeekData from 'test_fixtures/api/dora/metrics/daily_lead_time_for_changes_for_last_week.json';
import { apiDataToChartSeries, buildNullSeriesForLeadTimeChart } from 'ee/dora/components/util';
import {
apiDataToChartSeries,
buildNullSeriesForLeadTimeChart,
seriesToAverageSeries,
} from 'ee/dora/components/util';
describe('ee/dora/components/util.js', () => {
describe('apiDataToChartSeries', () => {
......@@ -209,4 +213,40 @@ describe('ee/dora/components/util.js', () => {
expect(chartData).toMatchSnapshot();
});
});
describe('seriesToAverageSeries', () => {
const seriesName = 'Average';
it('returns an empty object if chart data is undefined', () => {
const data = seriesToAverageSeries(undefined, seriesName);
expect(data).toStrictEqual({});
});
it('returns an empty object if chart data is blank', () => {
const data = seriesToAverageSeries(null, seriesName);
expect(data).toStrictEqual({});
});
it('returns the correct average values', () => {
const data = seriesToAverageSeries(
[
['Jul 1', 2],
['Jul 2', 3],
['Jul 3', 4],
],
seriesName,
);
expect(data).toStrictEqual({
name: seriesName,
data: [
['Jul 1', 3],
['Jul 2', 3],
['Jul 3', 3],
],
});
});
});
});
locale/gitlab.pot
View file @ d3de75ba
......@@ -10796,6 +10796,9 @@ msgstr ""
msgid "DORA4Metrics|%{startDate} - %{endDate}"
msgstr ""
msgid "DORA4Metrics|Average (last %{days}d)"
msgstr ""
msgid "DORA4Metrics|Date"
msgstr ""
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7