diff options
Diffstat (limited to 'app/assets/javascripts/monitoring/monitoring_app.js')
-rw-r--r-- | app/assets/javascripts/monitoring/monitoring_app.js | 59 |
1 files changed, 59 insertions, 0 deletions
diff --git a/app/assets/javascripts/monitoring/monitoring_app.js b/app/assets/javascripts/monitoring/monitoring_app.js new file mode 100644 index 00000000000..08543fa6eb3 --- /dev/null +++ b/app/assets/javascripts/monitoring/monitoring_app.js @@ -0,0 +1,59 @@ +import Vue from 'vue'; +import { GlToast } from '@gitlab/ui'; +import { parseBoolean } from '~/lib/utils/common_utils'; +import { getParameterValues } from '~/lib/utils/url_utility'; +import { createStore } from './stores'; +import createRouter from './router'; + +Vue.use(GlToast); + +export default (props = {}) => { + const el = document.getElementById('prometheus-graphs'); + + if (el && el.dataset) { + const [currentDashboard] = getParameterValues('dashboard'); + + const { + deploymentsEndpoint, + dashboardEndpoint, + dashboardsEndpoint, + projectPath, + logsPath, + currentEnvironmentName, + dashboardTimezone, + metricsDashboardBasePath, + ...dataProps + } = el.dataset; + + const store = createStore({ + currentDashboard, + deploymentsEndpoint, + dashboardEndpoint, + dashboardsEndpoint, + dashboardTimezone, + projectPath, + logsPath, + currentEnvironmentName, + }); + + // HTML attributes are always strings, parse other types. + dataProps.hasMetrics = parseBoolean(dataProps.hasMetrics); + dataProps.customMetricsAvailable = parseBoolean(dataProps.customMetricsAvailable); + dataProps.prometheusAlertsAvailable = parseBoolean(dataProps.prometheusAlertsAvailable); + + const router = createRouter(metricsDashboardBasePath); + + // eslint-disable-next-line no-new + new Vue({ + el, + store, + router, + data() { + return { + dashboardProps: { ...dataProps, ...props }, + }; + }, + template: `<router-view :dashboardProps="dashboardProps"/>`, + }); + } +}; |