1 files changed, 27 insertions, 0 deletions
diff --git a/app/assets/javascripts/notifications/index.js b/app/assets/javascripts/notifications/index.js
index a81f2c2590b..1395084f68c 100644
--- a/app/assets/javascripts/notifications/index.js
+++ b/app/assets/javascripts/notifications/index.js
@@ -2,10 +2,37 @@ import { GlToast } from '@gitlab/ui';
 import Vue from 'vue';
 import { parseBoolean } from '~/lib/utils/common_utils';
 import NotificationsDropdown from './components/notifications_dropdown.vue';
+import NotificationEmailListboxInput from './components/notification_email_listbox_input.vue';
 
 Vue.use(GlToast);
 
+const initNotificationEmailListboxInputs = () => {
+  const els = [...document.querySelectorAll('.js-notification-email-listbox-input')];
+
+  els.forEach((el, index) => {
+    const { label, name, emptyValueText, value = '' } = el.dataset;
+
+    return new Vue({
+      el,
+      name: `NotificationEmailListboxInputRoot${index + 1}`,
+      provide: {
+        label,
+        name,
+        emails: JSON.parse(el.dataset.emails),
+        emptyValueText,
+        value,
+        disabled: parseBoolean(el.dataset.disabled),
+      },
+      render(h) {
+        return h(NotificationEmailListboxInput);
+      },
+    });
+  });
+};
+
 export default () => {
+  initNotificationEmailListboxInputs();
+
   const containers = document.querySelectorAll('.js-vue-notification-dropdown');
 
   if (!containers.length) return false;