diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared/issuable/list/components/issuable_list_root.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/issuable/list/components/issuable_list_root.vue | 17 |
1 files changed, 16 insertions, 1 deletions
diff --git a/app/assets/javascripts/vue_shared/issuable/list/components/issuable_list_root.vue b/app/assets/javascripts/vue_shared/issuable/list/components/issuable_list_root.vue index 95108933a0b..4023337a1cb 100644 --- a/app/assets/javascripts/vue_shared/issuable/list/components/issuable_list_root.vue +++ b/app/assets/javascripts/vue_shared/issuable/list/components/issuable_list_root.vue @@ -6,12 +6,14 @@ import PageSizeSelector from '~/vue_shared/components/page_size_selector.vue'; import { getIdFromGraphQLId } from '~/graphql_shared/utils'; import { updateHistory, setUrlParams } from '~/lib/utils/url_utility'; import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue'; +import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import issuableEventHub from '~/issues/list/eventhub'; import { DEFAULT_SKELETON_COUNT, PAGE_SIZE_STORAGE_KEY } from '../constants'; import IssuableBulkEditSidebar from './issuable_bulk_edit_sidebar.vue'; import IssuableItem from './issuable_item.vue'; import IssuableTabs from './issuable_tabs.vue'; +import IssuableGrid from './issuable_grid.vue'; const VueDraggable = () => import('vuedraggable'); @@ -30,12 +32,14 @@ export default { IssuableTabs, FilteredSearchBar, IssuableItem, + IssuableGrid, IssuableBulkEditSidebar, GlPagination, VueDraggable, PageSizeSelector, LocalStorageSync, }, + mixins: [glFeatureFlagMixin()], props: { namespace: { type: String, @@ -194,6 +198,11 @@ export default { required: false, default: false, }, + isGridView: { + type: Boolean, + required: false, + default: false, + }, }, data() { return { @@ -229,6 +238,9 @@ export default { issuablesWrapper() { return this.isManualOrdering ? VueDraggable : 'ul'; }, + gridViewFeatureEnabled() { + return Boolean(this.glFeatures?.issuesGridView); + }, }, watch: { issuables(list) { @@ -342,7 +354,7 @@ export default { <template v-else> <component :is="issuablesWrapper" - v-if="issuables.length > 0" + v-if="issuables.length > 0 && !isGridView" class="content-list issuable-list issues-list" :class="{ 'manual-ordering': isManualOrdering }" v-bind="$options.vueDraggableAttributes" @@ -382,6 +394,9 @@ export default { </template> </issuable-item> </component> + <div v-else-if="issuables.length > 0 && isGridView"> + <issuable-grid /> + </div> <slot v-else name="empty-state"></slot> </template> |