48 lines
1.3 KiB
JavaScript
48 lines
1.3 KiB
JavaScript
import Vue from 'vue';
|
|
import { createStore } from '~/monitoring/stores/embed_group/';
|
|
|
|
// TODO: Handle copy-pasting - https://gitlab.com/gitlab-org/gitlab-foss/issues/64369.
|
|
export default function renderMetrics(elements) {
|
|
if (!elements.length) {
|
|
return Promise.resolve();
|
|
}
|
|
|
|
const wrapperList = [];
|
|
|
|
elements.forEach(element => {
|
|
let wrapper;
|
|
const { previousElementSibling } = element;
|
|
const isFirstElementInGroup = !previousElementSibling?.urls;
|
|
|
|
if (isFirstElementInGroup) {
|
|
wrapper = document.createElement('div');
|
|
wrapper.urls = [element.dataset.dashboardUrl];
|
|
element.parentNode.insertBefore(wrapper, element);
|
|
wrapperList.push(wrapper);
|
|
} else {
|
|
wrapper = previousElementSibling;
|
|
wrapper.urls.push(element.dataset.dashboardUrl);
|
|
}
|
|
|
|
// Clean up processed element
|
|
element.parentNode.removeChild(element);
|
|
});
|
|
|
|
return import(
|
|
/* webpackChunkName: 'gfm_metrics' */ '~/monitoring/components/embeds/embed_group.vue'
|
|
).then(({ default: EmbedGroup }) => {
|
|
const EmbedGroupComponent = Vue.extend(EmbedGroup);
|
|
|
|
wrapperList.forEach(wrapper => {
|
|
// eslint-disable-next-line no-new
|
|
new EmbedGroupComponent({
|
|
el: wrapper,
|
|
store: createStore(),
|
|
propsData: {
|
|
urls: wrapper.urls,
|
|
},
|
|
});
|
|
});
|
|
});
|
|
}
|