diff options
Diffstat (limited to 'app/assets/javascripts/issues/new/index.js')
-rw-r--r-- | app/assets/javascripts/issues/new/index.js | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/app/assets/javascripts/issues/new/index.js b/app/assets/javascripts/issues/new/index.js new file mode 100644 index 00000000000..59a7cbec627 --- /dev/null +++ b/app/assets/javascripts/issues/new/index.js @@ -0,0 +1,56 @@ +import Vue from 'vue'; +import VueApollo from 'vue-apollo'; +import createDefaultClient from '~/lib/graphql'; +import TitleSuggestions from './components/title_suggestions.vue'; +import TypePopover from './components/type_popover.vue'; + +export function initTitleSuggestions() { + Vue.use(VueApollo); + + const el = document.getElementById('js-suggestions'); + const issueTitle = document.getElementById('issue_title'); + + if (!el) { + return undefined; + } + + const apolloProvider = new VueApollo({ + defaultClient: createDefaultClient(), + }); + + return new Vue({ + el, + apolloProvider, + data() { + return { + search: issueTitle.value, + }; + }, + mounted() { + issueTitle.addEventListener('input', () => { + this.search = issueTitle.value; + }); + }, + render(createElement) { + return createElement(TitleSuggestions, { + props: { + projectPath: el.dataset.projectPath, + search: this.search, + }, + }); + }, + }); +} + +export function initTypePopover() { + const el = document.getElementById('js-type-popover'); + + if (!el) { + return undefined; + } + + return new Vue({ + el, + render: (createElement) => createElement(TypePopover), + }); +} |