Commit 1f5ae8cd authored by Phil Hughes's avatar Phil Hughes

Merge branch 'refactor-monitoring-service' into 'master'

Refactor MonitoringService class

See merge request !14003
parents 7771afd5 70e9e884
<script> <script>
/* global Flash */ /* global Flash */
import _ from 'underscore'; import _ from 'underscore';
import statusCodes from '../../lib/utils/http_status';
import MonitoringService from '../services/monitoring_service'; import MonitoringService from '../services/monitoring_service';
import GraphGroup from './graph_group.vue'; import GraphGroup from './graph_group.vue';
import Graph from './graph.vue'; import Graph from './graph.vue';
...@@ -21,10 +20,9 @@ ...@@ -21,10 +20,9 @@
hasMetrics: gl.utils.convertPermissionToBoolean(metricsData.hasMetrics), hasMetrics: gl.utils.convertPermissionToBoolean(metricsData.hasMetrics),
documentationPath: metricsData.documentationPath, documentationPath: metricsData.documentationPath,
settingsPath: metricsData.settingsPath, settingsPath: metricsData.settingsPath,
endpoint: metricsData.additionalMetrics, metricsEndpoint: metricsData.additionalMetrics,
deploymentEndpoint: metricsData.deploymentEndpoint, deploymentEndpoint: metricsData.deploymentEndpoint,
showEmptyState: true, showEmptyState: true,
backOffRequestCounter: 0,
updateAspectRatio: false, updateAspectRatio: false,
updatedAspectRatios: 0, updatedAspectRatios: 0,
resizeThrottled: {}, resizeThrottled: {},
...@@ -39,50 +37,16 @@ ...@@ -39,50 +37,16 @@
methods: { methods: {
getGraphsData() { getGraphsData() {
const maxNumberOfRequests = 3;
this.state = 'loading'; this.state = 'loading';
gl.utils.backOff((next, stop) => { Promise.all([
this.service.get().then((resp) => { this.service.getGraphsData()
if (resp.status === statusCodes.NO_CONTENT) { .then(data => this.store.storeMetrics(data)),
this.backOffRequestCounter = this.backOffRequestCounter += 1; this.service.getDeploymentData()
if (this.backOffRequestCounter < maxNumberOfRequests) { .then(data => this.store.storeDeploymentData(data))
next(); .catch(() => new Flash('Error getting deployment information.')),
} else { ])
stop(new Error('Failed to connect to the prometheus server')); .then(() => { this.showEmptyState = false; })
} .catch(() => { this.state = 'unableToConnect'; });
} else {
stop(resp);
}
}).catch(stop);
})
.then((resp) => {
if (resp.status === statusCodes.NO_CONTENT) {
this.state = 'unableToConnect';
return false;
}
return resp.json();
})
.then((metricGroupsData) => {
if (!metricGroupsData) return false;
this.store.storeMetrics(metricGroupsData.data);
return this.getDeploymentData();
})
.then((deploymentData) => {
if (deploymentData !== false) {
this.store.storeDeploymentData(deploymentData.deployments);
this.showEmptyState = false;
}
return {};
})
.catch(() => {
this.state = 'unableToConnect';
});
},
getDeploymentData() {
return this.service.getDeploymentData(this.deploymentEndpoint)
.then(resp => resp.json())
.catch(() => new Flash('Error getting deployment information.'));
}, },
resize() { resize() {
...@@ -99,7 +63,10 @@ ...@@ -99,7 +63,10 @@
}, },
created() { created() {
this.service = new MonitoringService(this.endpoint); this.service = new MonitoringService({
metricsEndpoint: this.metricsEndpoint,
deploymentEndpoint: this.deploymentEndpoint,
});
eventHub.$on('toggleAspectRatio', this.toggleAspectRatio); eventHub.$on('toggleAspectRatio', this.toggleAspectRatio);
}, },
......
import Vue from 'vue'; import Vue from 'vue';
import VueResource from 'vue-resource'; import VueResource from 'vue-resource';
import statusCodes from '../../lib/utils/http_status';
Vue.use(VueResource); Vue.use(VueResource);
const MAX_REQUESTS = 3;
function backOffRequest(makeRequestCallback) {
let requestCounter = 0;
return gl.utils.backOff((next, stop) => {
makeRequestCallback().then((resp) => {
if (resp.status === statusCodes.NO_CONTENT) {
requestCounter += 1;
if (requestCounter < MAX_REQUESTS) {
next();
} else {
stop(new Error('Failed to connect to the prometheus server'));
}
} else {
stop(resp);
}
}).catch(stop);
});
}
export default class MonitoringService { export default class MonitoringService {
constructor(endpoint) { constructor({ metricsEndpoint, deploymentEndpoint }) {
this.graphs = Vue.resource(endpoint); this.metricsEndpoint = metricsEndpoint;
this.deploymentEndpoint = deploymentEndpoint;
} }
get() { getGraphsData() {
return this.graphs.get(); return backOffRequest(() => Vue.http.get(this.metricsEndpoint))
.then(resp => resp.json())
.then((response) => {
if (!response || !response.data) {
throw new Error('Unexpected metrics data response from prometheus endpoint');
}
return response.data;
});
} }
// eslint-disable-next-line class-methods-use-this getDeploymentData() {
getDeploymentData(endpoint) { return backOffRequest(() => Vue.http.get(this.deploymentEndpoint))
return Vue.http.get(endpoint); .then(resp => resp.json())
.then((response) => {
if (!response || !response.deployments) {
throw new Error('Unexpected deployment data response from prometheus endpoint');
}
return response.deployments;
});
} }
} }
---
title: Perform prometheus data endpoint requests in parallel
merge_request: 14003
author:
type: fixed
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