diff options
Diffstat (limited to 'app/assets/javascripts/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal.js')
-rw-r--r-- | app/assets/javascripts/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal.js | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/app/assets/javascripts/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal.js b/app/assets/javascripts/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal.js new file mode 100644 index 00000000000..fdd0e045d07 --- /dev/null +++ b/app/assets/javascripts/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal.js @@ -0,0 +1,55 @@ +import Vue from 'vue'; + +export function confirmAction(message, { primaryBtnVariant, primaryBtnText } = {}) { + return new Promise((resolve) => { + let confirmed = false; + + const component = new Vue({ + components: { + ConfirmModal: () => import('./confirm_modal.vue'), + }, + render(h) { + return h( + 'confirm-modal', + { + props: { + primaryVariant: primaryBtnVariant, + primaryText: primaryBtnText, + }, + on: { + confirmed() { + confirmed = true; + }, + closed() { + component.$destroy(); + resolve(confirmed); + }, + }, + }, + [message], + ); + }, + }).$mount(); + }); +} + +export function confirmViaGlModal(message, element) { + const primaryBtnConfig = {}; + + const confirmBtnVariant = element.getAttribute('data-confirm-btn-variant'); + + if (confirmBtnVariant) { + primaryBtnConfig.primaryBtnVariant = confirmBtnVariant; + } + + const screenReaderText = + element.querySelector('.gl-sr-only')?.textContent || + element.querySelector('.sr-only')?.textContent || + element.getAttribute('aria-label'); + + if (screenReaderText) { + primaryBtnConfig.primaryBtnText = screenReaderText; + } + + return confirmAction(message, primaryBtnConfig); +} |