diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-05-19 15:44:42 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-05-19 15:44:42 +0000 |
commit | 4555e1b21c365ed8303ffb7a3325d773c9b8bf31 (patch) | |
tree | 5423a1c7516cffe36384133ade12572cf709398d /app/assets/javascripts/incidents | |
parent | e570267f2f6b326480d284e0164a6464ba4081bc (diff) | |
download | gitlab-ce-4555e1b21c365ed8303ffb7a3325d773c9b8bf31.tar.gz |
Add latest changes from gitlab-org/gitlab@13-12-stable-eev13.12.0-rc42
Diffstat (limited to 'app/assets/javascripts/incidents')
-rw-r--r-- | app/assets/javascripts/incidents/components/incidents_list.vue | 34 |
1 files changed, 16 insertions, 18 deletions
diff --git a/app/assets/javascripts/incidents/components/incidents_list.vue b/app/assets/javascripts/incidents/components/incidents_list.vue index 5638dc064d1..af99341b11f 100644 --- a/app/assets/javascripts/incidents/components/incidents_list.vue +++ b/app/assets/javascripts/incidents/components/incidents_list.vue @@ -10,7 +10,6 @@ import { GlIcon, GlEmptyState, } from '@gitlab/ui'; -import { convertToSnakeCase } from '~/lib/utils/text_utility'; import { visitUrl, mergeUrlParams, joinPaths } from '~/lib/utils/url_utility'; import { s__ } from '~/locale'; import { INCIDENT_SEVERITY } from '~/sidebar/components/severity/constants'; @@ -49,6 +48,7 @@ export default { label: s__('IncidentManagement|Severity'), thClass: `${thClass} w-15p`, tdClass: `${tdClass} sortable-cell`, + actualSortKey: 'SEVERITY', sortable: true, thAttr: TH_SEVERITY_TEST_ID, }, @@ -63,6 +63,7 @@ export default { label: s__('IncidentManagement|Date created'), thClass: `${thClass} gl-w-eighth`, tdClass: `${tdClass} sortable-cell`, + actualSortKey: 'CREATED', sortable: true, thAttr: TH_CREATED_AT_TEST_ID, }, @@ -72,7 +73,7 @@ export default { thClass: `gl-text-right gl-w-eighth`, tdClass: `${tdClass} gl-text-right`, thAttr: TH_INCIDENT_SLA_TEST_ID, - sortKey: 'SLA_DUE_AT', + actualSortKey: 'SLA_DUE_AT', sortable: true, sortDirection: 'asc', }, @@ -87,6 +88,7 @@ export default { label: s__('IncidentManagement|Published'), thClass: `${thClass} w-15p`, tdClass: `${tdClass} sortable-cell`, + actualSortKey: 'PUBLISHED', sortable: true, thAttr: TH_PUBLISHED_TEST_ID, }, @@ -174,8 +176,7 @@ export default { redirecting: false, incidents: {}, incidentsCount: {}, - sort: 'created_desc', - sortBy: 'createdAt', + sort: 'CREATED_DESC', sortDesc: true, statusFilter: '', filteredByStatus: '', @@ -256,20 +257,17 @@ export default { this.redirecting = true; }, fetchSortedData({ sortBy, sortDesc }) { - let sortKey; - // In bootstrap-vue v2.17.0, sortKey becomes natively supported and we can eliminate this function const field = this.availableFields.find(({ key }) => key === sortBy); const sortingDirection = sortDesc ? 'DESC' : 'ASC'; - // Use `sortKey` if provided, otherwise fall back to existing algorithm - if (field?.sortKey) { - sortKey = field.sortKey; - } else { - sortKey = convertToSnakeCase(sortBy).replace(/_.*/, '').toUpperCase(); - } - this.pagination = initialPaginationState; - this.sort = `${sortKey}_${sortingDirection}`; + + // BootstapVue natively supports a `sortKey` parameter, but using it results in the sorting + // icons not being updated properly in the header. We decided to fallback on `actualSortKey` + // to bypass BootstrapVue's behavior until the bug is addressed upstream. + // Related discussion: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/60926/diffs#note_568020482 + // Upstream issue: https://github.com/bootstrap-vue/bootstrap-vue/issues/6602 + this.sort = `${field.actualSortKey}_${sortingDirection}`; }, getSeverity(severity) { return INCIDENT_SEVERITY[severity]; @@ -334,14 +332,14 @@ export default { <gl-table :items="incidents.list || []" :fields="availableFields" - :show-empty="true" :busy="loading" stacked="md" :tbody-tr-class="tbodyTrClass" - :no-local-sorting="true" - :sort-direction="'desc'" + sort-direction="desc" :sort-desc.sync="sortDesc" - :sort-by.sync="sortBy" + sort-by="createdAt" + show-empty + no-local-sorting sort-icon-left fixed @row-clicked="navigateToIncidentDetails" |