diff options
Diffstat (limited to 'app/assets/javascripts/vue_merge_request_widget/components/extensions/container.js')
-rw-r--r-- | app/assets/javascripts/vue_merge_request_widget/components/extensions/container.js | 53 |
1 files changed, 40 insertions, 13 deletions
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/extensions/container.js b/app/assets/javascripts/vue_merge_request_widget/components/extensions/container.js index 529160de6a7..b9dfd3bd41e 100644 --- a/app/assets/javascripts/vue_merge_request_widget/components/extensions/container.js +++ b/app/assets/javascripts/vue_merge_request_widget/components/extensions/container.js @@ -1,4 +1,5 @@ -import { extensions } from './index'; +import { __ } from '~/locale'; +import { registeredExtensions } from './index'; export default { props: { @@ -8,20 +9,46 @@ export default { }, }, render(h) { + const { extensions } = registeredExtensions; + + if (extensions.length === 0) return null; + return h( 'div', - {}, - extensions.map((extension) => - h(extension, { - props: extensions[0].props.reduce( - (acc, key) => ({ - ...acc, - [key]: this.mr[key], - }), - {}, - ), - }), - ), + { + attrs: { + role: 'region', + 'aria-label': __('Merge request reports'), + }, + }, + [ + h( + 'ul', + { + class: 'gl-p-0 gl-m-0 gl-list-style-none', + }, + [ + ...extensions.map((extension, index) => + h('li', { attrs: { class: index > 0 && 'mr-widget-border-top' } }, [ + h( + { ...extension }, + { + props: { + ...extension.props.reduce( + (acc, key) => ({ + ...acc, + [key]: this.mr[key], + }), + {}, + ), + }, + }, + ), + ]), + ), + ], + ), + ], ); }, }; |