Add latest changes from gitlab-org/gitlab@13-11-stable-eev13.11.0-rc43

1 files changed, 27 insertions, 8 deletions

diff --git a/app/assets/javascripts/pages/dashboard/todos/index/todos.js b/app/assets/javascripts/pages/dashboard/todos/index/todos.js
index d53cd405504..42341436b55 100644
--- a/app/assets/javascripts/pages/dashboard/todos/index/todos.js
+++ b/app/assets/javascripts/pages/dashboard/todos/index/todos.js
@@ -1,6 +1,8 @@
 /* eslint-disable class-methods-use-this, no-unneeded-ternary */
 
 import $ from 'jquery';
+import { getGroups } from '~/api/groups_api';
+import { getProjects } from '~/api/projects_api';
 import initDeprecatedJQueryDropdown from '~/deprecated_jquery_dropdown';
 import { deprecatedCreateFlash as flash } from '~/flash';
 import axios from '~/lib/utils/axios_utils';
@@ -41,14 +43,37 @@ export default class Todos {
   }
 
   initFilters() {
-    this.initFilterDropdown($('.js-group-search'), 'group_id', ['text']);
-    this.initFilterDropdown($('.js-project-search'), 'project_id', ['text']);
+    this.initAjaxFilterDropdown(getGroups, $('.js-group-search'), 'group_id');
+    this.initAjaxFilterDropdown(getProjects, $('.js-project-search'), 'project_id');
     this.initFilterDropdown($('.js-type-search'), 'type');
     this.initFilterDropdown($('.js-action-search'), 'action_id');
 
     return new UsersSelect();
   }
 
+  initAjaxFilterDropdown(apiMethod, $dropdown, fieldName) {
+    initDeprecatedJQueryDropdown($dropdown, {
+      fieldName,
+      selectable: true,
+      filterable: true,
+      filterRemote: true,
+      data(search, callback) {
+        return apiMethod(search, {}, (data) => {
+          callback(
+            data.map((d) => ({
+              id: d.id,
+              text: d.full_name || d.name_with_namespace,
+            })),
+          );
+        });
+      },
+      clicked: () => {
+        const $formEl = $dropdown.closest('form.filter-form');
+        $formEl.submit();
+      },
+    });
+  }
+
   initFilterDropdown($dropdown, fieldName, searchFields) {
     initDeprecatedJQueryDropdown($dropdown, {
       fieldName,
@@ -58,12 +83,6 @@ export default class Todos {
       data: $dropdown.data('data'),
       clicked: () => {
         const $formEl = $dropdown.closest('form.filter-form');
-        const mutexDropdowns = {
-          group_id: 'project_id',
-          project_id: 'group_id',
-        };
-
-        $formEl.find(`input[name="${mutexDropdowns[fieldName]}"]`).remove();
         $formEl.submit();
       },
     });