backport disco-filters (#50122)

Author: Liza Katz

src/legacy/core_plugins/data/public/filter/filter_manager/filter_manager.test.ts

@@ -228,12 +228,15 @@ describe('filter_manager', () => {
       expect(appStateStub.filters.length).toBe(1);
     });
 
-    test('app state should accept array', async () => {
+    test('app state should accept array and preserve order', async () => {
       const f1 = getFilter(FilterStateStore.APP_STATE, false, false, 'age', 34);
       const f2 = getFilter(FilterStateStore.APP_STATE, false, false, 'gender', 'female');
+
       filterManager.addFilters([f1]);
       filterManager.addFilters([f2]);
-      expect(filterManager.getAppFilters()).toHaveLength(2);
+      const appFilters = filterManager.getAppFilters();
+      expect(appFilters).toHaveLength(2);
+      expect(appFilters).toEqual([f1, f2]);
       expect(filterManager.getGlobalFilters()).toHaveLength(0);
       expect(appStateStub.filters.length).toBe(2);
     });
@@ -248,13 +251,33 @@ describe('filter_manager', () => {
       expect(globalStateStub.filters.length).toBe(1);
     });
 
-    test('global state should be accept array', async () => {
+    test('global state should be accept array and preserve order', async () => {
       const f1 = getFilter(FilterStateStore.GLOBAL_STATE, false, false, 'age', 34);
       const f2 = getFilter(FilterStateStore.GLOBAL_STATE, false, false, 'gender', 'female');
+
       filterManager.addFilters([f1, f2]);
       expect(filterManager.getAppFilters()).toHaveLength(0);
-      expect(filterManager.getGlobalFilters()).toHaveLength(2);
-      expect(globalStateStub.filters.length).toBe(2);
+      const globalFilters = filterManager.getGlobalFilters();
+      expect(globalFilters).toHaveLength(2);
+      expect(globalFilters).toEqual([f1, f2]);
+    });
+
+    test('mixed filters: global filters should stay in the beginning', async () => {
+      const f1 = getFilter(FilterStateStore.GLOBAL_STATE, false, false, 'age', 34);
+      const f2 = getFilter(FilterStateStore.APP_STATE, false, false, 'gender', 'female');
+      filterManager.addFilters([f1, f2]);
+      const filters = filterManager.getFilters();
+      expect(filters).toHaveLength(2);
+      expect(filters).toEqual([f1, f2]);
+    });
+
+    test('mixed filters: global filters should move to the beginning', async () => {
+      const f1 = getFilter(FilterStateStore.APP_STATE, false, false, 'age', 34);
+      const f2 = getFilter(FilterStateStore.GLOBAL_STATE, false, false, 'gender', 'female');
+      filterManager.addFilters([f1, f2]);
+      const filters = filterManager.getFilters();
+      expect(filters).toHaveLength(2);
+      expect(filters).toEqual([f2, f1]);
     });
 
     test('add multiple filters at once', async () => {

src/legacy/core_plugins/data/public/filter/filter_manager/filter_manager.ts

@@ -76,10 +76,14 @@ export class FilterManager {
   private handleStateUpdate(newFilters: Filter[]) {
     // global filters should always be first
     newFilters.sort(({ $state: a }: Filter, { $state: b }: Filter): number => {
-      return a!.store === FilterStateStore.GLOBAL_STATE &&
-        b!.store !== FilterStateStore.GLOBAL_STATE
-        ? -1
-        : 1;
+      if (a!.store === b!.store) {
+        return 0;
+      } else {
+        return a!.store === FilterStateStore.GLOBAL_STATE &&
+          b!.store !== FilterStateStore.GLOBAL_STATE
+          ? -1
+          : 1;
+      }
     });
 
     const filtersUpdated = !_.isEqual(this.filters, newFilters);