Fix(filtered search manager): add state option

Add option parameter to use default state, so
usages of the filtered_search_manager can specify
whether to use the default state, or not.

This created issues around the application where
state='opened' had an unintentional effect and
would cause inconsistencies between what was being
displayed when. See ticket for more information:
https://gitlab.com/gitlab-org/gitlab/-/issues/232734

app/assets/javascripts/boards/filtered_search_boards.js

@@ -10,6 +10,7 @@ export default class FilteredSearchBoards extends FilteredSearchManager {
       isGroupDecendent: true,
       stateFiltersSelector: '.issues-state-filters',
       isGroup: IS_EE,
+      useDefaultState: false,
       filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
     });
 

app/assets/javascripts/filtered_search/filtered_search_manager.js

@@ -29,6 +29,7 @@ export default class FilteredSearchManager {
     isGroup = false,
     isGroupAncestor = true,
     isGroupDecendent = false,
+    useDefaultState = false,
     filteredSearchTokenKeys = IssuableFilteredSearchTokenKeys,
     stateFiltersSelector = '.issues-state-filters',
     placeholder = __('Search or filter results...'),
@@ -37,6 +38,7 @@ export default class FilteredSearchManager {
     this.isGroup = isGroup;
     this.isGroupAncestor = isGroupAncestor;
     this.isGroupDecendent = isGroupDecendent;
+    this.useDefaultState = useDefaultState;
     this.states = ['opened', 'closed', 'merged', 'all'];
 
     this.page = page;
@@ -724,8 +726,13 @@ export default class FilteredSearchManager {
   search(state = null) {
     const paths = [];
     const { tokens, searchToken } = this.getSearchTokens();
-    const currentState = state || getParameterByName('state') || 'opened';
-    paths.push(`state=${currentState}`);
+    let currentState = state || getParameterByName('state');
+    if (!currentState && this.useDefaultState) {
+      currentState = 'opened';
+    }
+    if (this.states.includes(currentState)) {
+      paths.push(`state=${currentState}`);
+    }
 
     tokens.forEach(token => {
       const condition = this.filteredSearchTokenKeys.searchByConditionKeyValue(

app/assets/javascripts/pages/admin/runners/index.js

@@ -6,5 +6,6 @@ document.addEventListener('DOMContentLoaded', () => {
   initFilteredSearch({
     page: FILTERED_SEARCH.ADMIN_RUNNERS,
     filteredSearchTokenKeys: AdminRunnersFilteredSearchTokenKeys,
+    useDefaultState: true,
   });
 });

app/assets/javascripts/pages/dashboard/issues/index.js

@@ -8,6 +8,7 @@ document.addEventListener('DOMContentLoaded', () => {
   initFilteredSearch({
     page: FILTERED_SEARCH.ISSUES,
     filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
+    useDefaultState: true,
   });
 
   projectSelect();

app/assets/javascripts/pages/dashboard/merge_requests/index.js

@@ -10,6 +10,7 @@ document.addEventListener('DOMContentLoaded', () => {
   initFilteredSearch({
     page: FILTERED_SEARCH.MERGE_REQUESTS,
     filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
+    useDefaultState: true,
   });
 
   projectSelect();

app/assets/javascripts/pages/groups/issues/index.js

@@ -17,6 +17,7 @@ document.addEventListener('DOMContentLoaded', () => {
   initFilteredSearch({
     page: FILTERED_SEARCH.ISSUES,
     isGroupDecendent: true,
+    useDefaultState: true,
     filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
   });
   projectSelect();

app/assets/javascripts/pages/groups/merge_requests/index.js

@@ -14,6 +14,7 @@ document.addEventListener('DOMContentLoaded', () => {
   initFilteredSearch({
     page: FILTERED_SEARCH.MERGE_REQUESTS,
     isGroupDecendent: true,
+    useDefaultState: true,
     filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
   });
   projectSelect();

app/assets/javascripts/pages/groups/settings/ci_cd/show/index.js

@@ -13,6 +13,7 @@ document.addEventListener('DOMContentLoaded', () => {
     page: FILTERED_SEARCH.ADMIN_RUNNERS,
     filteredSearchTokenKeys: GroupRunnersFilteredSearchTokenKeys,
     anchor: FILTERED_SEARCH.GROUP_RUNNERS_ANCHOR,
+    useDefaultState: false,
   });
 
   if (gon.features.newVariablesUi) {

app/assets/javascripts/pages/projects/issues/index/index.js

@@ -17,6 +17,7 @@ document.addEventListener('DOMContentLoaded', () => {
   initFilteredSearch({
     page: FILTERED_SEARCH.ISSUES,
     filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
+    useDefaultState: true,
   });
 
   new IssuableIndex(ISSUABLE_INDEX.ISSUE);

app/assets/javascripts/pages/projects/issues/service_desk/filtered_search.js

@@ -9,6 +9,7 @@ export default class FilteredSearchServiceDesk extends FilteredSearchManager {
     super({
       page: 'service_desk',
       filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
+      useDefaultState: true,
     });
 
     this.supportBotData = supportBotData;

app/assets/javascripts/pages/projects/merge_requests/index/index.js

@@ -13,6 +13,7 @@ document.addEventListener('DOMContentLoaded', () => {
   initFilteredSearch({
     page: FILTERED_SEARCH.MERGE_REQUESTS,
     filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
+    useDefaultState: true,
   });
 
   new IssuableIndex(ISSUABLE_INDEX.MERGE_REQUEST); // eslint-disable-line no-new

app/assets/javascripts/pages/search/init_filtered_search.js

@@ -6,6 +6,7 @@ export default ({
   isGroup,
   isGroupAncestor,
   isGroupDecendent,
+  useDefaultState,
   stateFiltersSelector,
   anchor,
 }) => {
@@ -16,6 +17,7 @@ export default ({
       isGroup,
       isGroupAncestor,
       isGroupDecendent,
+      useDefaultState,
       filteredSearchTokenKeys,
       stateFiltersSelector,
       anchor,

changelogs/unreleased/232734-mlunoe-add-filtered-search-manager-setting-to-specify-to-use-default-state.yml

+---
+title: Fix bug where filtering would sometimes display only open issues on different pages listing issues
+merge_request: 38906
+author:
+type: fixed

ee/app/assets/javascripts/analytics/code_review_analytics/filtered_search_code_review_analytics.js

@@ -12,6 +12,7 @@ export default class FilteredSearchCodeReviewAnalytics extends FilteredSearchMan
       isGroupDecendent: true,
       stateFiltersSelector: '.issues-state-filters',
       isGroup: true,
+      useDefaultState: false,
       filteredSearchTokenKeys: CodeReviewAnalyticsFilteredSearchTokenKeys,
       placeholder: __('Filter results...'),
     });

ee/app/assets/javascripts/analytics/productivity_analytics/filtered_search_productivity_analytics.js

@@ -11,6 +11,7 @@ export default class FilteredSearchProductivityAnalytics extends FilteredSearchM
       isGroupDecendent: true,
       stateFiltersSelector: '.issues-state-filters',
       isGroup,
+      useDefaultState: false,
       filteredSearchTokenKeys: ProductivityAnalyticsFilteredSearchTokenKeys,
       placeholder: __('Filter results...'),
     });

ee/app/assets/javascripts/issues_analytics/filtered_search_issues_analytics.js

@@ -20,6 +20,7 @@ export default class FilteredSearchIssueAnalytics extends FilteredSearchManager
       isGroupDecendent: true,
       stateFiltersSelector: '.issues-state-filters',
       isGroup: true,
+      useDefaultState: false,
       filteredSearchTokenKeys: issuesAnalyticsTokenKeys,
       placeholder: __('Filter results...'),
     });

ee/app/assets/javascripts/pages/groups/epics/index/index.js

@@ -10,6 +10,7 @@ document.addEventListener('DOMContentLoaded', () => {
     page: 'epics',
     isGroup: true,
     isGroupDecendent: true,
+    useDefaultState: true,
     filteredSearchTokenKeys: FilteredSearchTokenKeysEpics,
     stateFiltersSelector: '.epics-state-filters',
   });

ee/app/assets/javascripts/pages/groups/roadmap/show/index.js

@@ -9,6 +9,7 @@ document.addEventListener('DOMContentLoaded', () => {
     page: 'epics',
     isGroup: true,
     isGroupDecendent: true,
+    useDefaultState: false,
     filteredSearchTokenKeys: FilteredSearchTokenKeysEpics,
     stateFiltersSelector: '.epics-state-filters',
   });

spec/frontend/filtered_search/filtered_search_manager_spec.js

@@ -77,7 +77,7 @@ describe('Filtered Search Manager', () => {
     jest.spyOn(FilteredSearchDropdownManager.prototype, 'setDropdown').mockImplementation();
   });
 
-  const initializeManager = () => {
+  const initializeManager = ({ useDefaultState } = {}) => {
     jest.spyOn(FilteredSearchManager.prototype, 'loadSearchParamsFromURL').mockImplementation();
     jest.spyOn(FilteredSearchManager.prototype, 'tokenChange').mockImplementation();
     jest
@@ -88,7 +88,7 @@ describe('Filtered Search Manager', () => {
 
     input = document.querySelector('.filtered-search');
     tokensContainer = document.querySelector('.tokens-container');
-    manager = new FilteredSearchManager({ page });
+    manager = new FilteredSearchManager({ page, useDefaultState });
     manager.setup();
   };
 
@@ -184,17 +184,27 @@ describe('Filtered Search Manager', () => {
   });
 
   describe('search', () => {
-    const defaultParams = '?scope=all&utf8=%E2%9C%93&state=opened';
+    const defaultParams = '?scope=all&utf8=%E2%9C%93';
+    const defaultState = '&state=opened';
 
-    beforeEach(() => {
+    it('should search with a single word', done => {
       initializeManager();
+      input.value = 'searchTerm';
+
+      visitUrl.mockImplementation(url => {
+        expect(url).toEqual(`${defaultParams}&search=searchTerm`);
+        done();
+      });
+
+      manager.search();
     });
 
-    it('should search with a single word', done => {
+    it('sets default state', done => {
+      initializeManager({ useDefaultState: true });
       input.value = 'searchTerm';
 
       visitUrl.mockImplementation(url => {
-        expect(url).toEqual(`${defaultParams}&search=searchTerm`);
+        expect(url).toEqual(`${defaultParams}${defaultState}&search=searchTerm`);
         done();
       });
 
@@ -202,6 +212,7 @@ describe('Filtered Search Manager', () => {
     });
 
     it('should search with multiple words', done => {
+      initializeManager();
       input.value = 'awesome search terms';
 
       visitUrl.mockImplementation(url => {
@@ -213,6 +224,7 @@ describe('Filtered Search Manager', () => {
     });
 
     it('should search with special characters', done => {
+      initializeManager();
       input.value = '~!@#$%^&*()_+{}:<>,.?/';
 
       visitUrl.mockImplementation(url => {
@@ -226,6 +238,7 @@ describe('Filtered Search Manager', () => {
     });
 
     it('should use replacement URL for condition', done => {
+      initializeManager();
       tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(
         FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', '13', true),
       );
@@ -246,6 +259,7 @@ describe('Filtered Search Manager', () => {
     });
 
     it('removes duplicated tokens', done => {
+      initializeManager();
       tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(`
         ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', '~bug')}
         ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', '~bug')}