Merge branch 'cngo-fix-issues-list-sort' into 'master'

Fix error when using invalid sort on issues list refactor

See merge request gitlab-org/gitlab!80091

app/assets/javascripts/issues/list/components/issues_list_app.vue

@@ -70,6 +70,7 @@ import {
   getInitialPageParams,
   getSortKey,
   getSortOptions,
+  isSortKey,
 } from '../utils';
 import NewIssueDropdown from './new_issue_dropdown.vue';
 
@@ -138,7 +139,8 @@ export default {
     const state = getParameterByName(PARAM_STATE);
     const defaultSortKey = state === IssuableStates.Closed ? UPDATED_DESC : CREATED_DESC;
     const dashboardSortKey = getSortKey(this.initialSort);
-    const graphQLSortKey = this.initialSort?.toUpperCase();
+    const graphQLSortKey =
+      isSortKey(this.initialSort?.toUpperCase()) && this.initialSort.toUpperCase();
 
     // The initial sort is an old enum value when it is saved on the dashboard issues page.
     // The initial sort is a GraphQL enum value when it is saved on the Vue issues list page.

app/assets/javascripts/issues/list/utils.js

@@ -50,6 +50,8 @@ export const getInitialPageParams = (sortKey) =>
 export const getSortKey = (sort) =>
   Object.keys(urlSortParams).find((key) => urlSortParams[key] === sort);
 
+export const isSortKey = (sort) => Object.keys(urlSortParams).includes(sort);
+
 export const getDueDateValue = (value) => (DUE_DATE_VALUES.includes(value) ? value : undefined);
 
 export const getSortOptions = (hasIssueWeightsFeature, hasBlockedIssuesFeature) => {

spec/frontend/issues/list/components/issues_list_app_spec.js

@@ -343,6 +343,20 @@ describe('CE IssuesListApp component', () => {
         });
       });
 
+      describe('when initial sort value is invalid', () => {
+        it.each(['', 'asdf', null, undefined])(
+          'initial sort is set to value CREATED_DESC',
+          (sort) => {
+            wrapper = mountComponent({ provide: { initialSort: sort } });
+
+            expect(findIssuableList().props()).toMatchObject({
+              initialSortBy: CREATED_DESC,
+              urlParams: { sort: urlSortParams[CREATED_DESC] },
+            });
+          },
+        );
+      });
+
       describe('when sort is manual and issue repositioning is disabled', () => {
         beforeEach(() => {
           wrapper = mountComponent({

spec/frontend/issues/list/utils_spec.js

@@ -24,6 +24,7 @@ import {
   getInitialPageParams,
   getSortKey,
   getSortOptions,
+  isSortKey,
 } from '~/issues/list/utils';
 
 describe('getInitialPageParams', () => {
@@ -45,6 +46,16 @@ describe('getSortKey', () => {
   });
 });
 
+describe('isSortKey', () => {
+  it.each(Object.keys(urlSortParams))('returns true given %s', (sort) => {
+    expect(isSortKey(sort)).toBe(true);
+  });
+
+  it.each(['', 'asdf', null, undefined])('returns false given %s', (sort) => {
+    expect(isSortKey(sort)).toBe(false);
+  });
+});
+
 describe('getDueDateValue', () => {
   it.each(DUE_DATE_VALUES)('returns the argument when it is `%s`', (value) => {
     expect(getDueDateValue(value)).toBe(value);