diff options
author | Kushal Pandya <kushalspandya@gmail.com> | 2019-02-26 14:04:15 +0000 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2019-02-26 14:04:15 +0000 |
commit | 2dd22ecb4601b546b630d1bdd7203dc4d87959e7 (patch) | |
tree | 1406c773cbcc47482db44f592ab51d9010f62c7d /app/assets/javascripts/notes/components/discussion_filter.vue | |
parent | 8baf9e5f03ea1388d7c65a1f6f1d7eb9cc952611 (diff) | |
download | gitlab-ce-2dd22ecb4601b546b630d1bdd7203dc4d87959e7.tar.gz |
Add support for toggling discussion filter from notes section
Adds discussion note style section under notes app from where
user can toggle discussion when they have selected a filter to show
only system notes.
Diffstat (limited to 'app/assets/javascripts/notes/components/discussion_filter.vue')
-rw-r--r-- | app/assets/javascripts/notes/components/discussion_filter.vue | 24 |
1 files changed, 22 insertions, 2 deletions
diff --git a/app/assets/javascripts/notes/components/discussion_filter.vue b/app/assets/javascripts/notes/components/discussion_filter.vue index e03d6e9cd02..31164f74201 100644 --- a/app/assets/javascripts/notes/components/discussion_filter.vue +++ b/app/assets/javascripts/notes/components/discussion_filter.vue @@ -7,7 +7,9 @@ import { DISCUSSION_FILTERS_DEFAULT_VALUE, HISTORY_ONLY_FILTER_VALUE, DISCUSSION_TAB_LABEL, + DISCUSSION_FILTER_TYPES, } from '../constants'; +import notesEventHub from '../event_hub'; export default { components: { @@ -46,6 +48,7 @@ export default { this.toggleFilters(currentTab); } + notesEventHub.$on('dropdownSelect', this.selectFilter); window.addEventListener('hashchange', this.handleLocationHash); this.handleLocationHash(); }, @@ -53,6 +56,7 @@ export default { this.toggleCommentsForm(); }, destroyed() { + notesEventHub.$off('dropdownSelect', this.selectFilter); window.removeEventListener('hashchange', this.handleLocationHash); }, methods: { @@ -86,12 +90,23 @@ export default { this.setTargetNoteHash(hash); } }, + filterType(value) { + if (value === 0) { + return DISCUSSION_FILTER_TYPES.ALL; + } else if (value === 1) { + return DISCUSSION_FILTER_TYPES.COMMENTS; + } + return DISCUSSION_FILTER_TYPES.HISTORY; + }, }, }; </script> <template> - <div v-if="displayFilters" class="discussion-filter-container d-inline-block align-bottom"> + <div + v-if="displayFilters" + class="discussion-filter-container js-discussion-filter-container d-inline-block align-bottom" + > <button id="discussion-filter-dropdown" ref="dropdownToggle" @@ -102,12 +117,17 @@ export default { {{ currentFilter.title }} <icon name="chevron-down" /> </button> <div + ref="dropdownMenu" class="dropdown-menu dropdown-menu-selectable dropdown-menu-right" aria-labelledby="discussion-filter-dropdown" > <div class="dropdown-content"> <ul> - <li v-for="filter in filters" :key="filter.value"> + <li + v-for="filter in filters" + :key="filter.value" + :data-filter-type="filterType(filter.value)" + > <button :class="{ 'is-active': filter.value === currentValue }" class="qa-filter-options" |