Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 | <script> import { GlSorting } from '@gitlab/ui'; import { ASCENDING_ORDER, DESCENDING_ORDER, SORT_OPTIONS, RELEASED_AT, CREATED_AT, RELEASED_AT_ASC, RELEASED_AT_DESC, CREATED_ASC, ALL_SORTS, SORT_MAP, } from '../constants'; export default { name: 'ReleasesSort', components: { GlSorting, }, props: { value: { type: String, required: true, validator: (sort) => ALL_SORTS.includes(sort), }, }, computed: { orderBy() { Iif (this.value === RELEASED_AT_ASC || this.value === RELEASED_AT_DESC) { return RELEASED_AT; } return CREATED_AT; }, direction() { Iif (this.value === RELEASED_AT_ASC || this.value === CREATED_ASC) { return ASCENDING_ORDER; } return DESCENDING_ORDER; }, sortOptions() { return SORT_OPTIONS; }, sortText() { return this.sortOptions.find((s) => s.value === this.orderBy).text; }, isDirectionAscending() { return this.direction === ASCENDING_ORDER; }, }, methods: { onDirectionChange() { const direction = this.isDirectionAscending ? DESCENDING_ORDER : ASCENDING_ORDER; this.emitInputEventIfChanged(this.orderBy, direction); }, onSortItemClick(orderBy) { this.emitInputEventIfChanged(orderBy, this.direction); }, emitInputEventIfChanged(orderBy, direction) { const newSort = SORT_MAP[orderBy][direction]; Iif (newSort !== this.value) { this.$emit('input', SORT_MAP[orderBy][direction]); } }, }, }; </script> <template> <gl-sorting :text="sortText" :is-ascending="isDirectionAscending" :sort-options="sortOptions" :sort-by="orderBy" data-testid="releases-sort" @sortDirectionChange="onDirectionChange" @sortByChange="onSortItemClick" /> </template> |