Correctly uses search query in backlog

4 files changed, 25 insertions, 20 deletions

diff --git a/app/assets/javascripts/boards/components/board.js.es6 b/app/assets/javascripts/boards/components/board.js.es6
index 0f8fabdd5b7..1f3a417aecd 100644
--- a/app/assets/javascripts/boards/components/board.js.es6
+++ b/app/assets/javascripts/boards/components/board.js.es6
@@ -1,23 +1,25 @@
 (() => {
   const Board = Vue.extend({
     props: {
-      board: Object,
+      list: Object,
       disabled: Boolean
     },
     data: function () {
       return {
+        query: '',
         filters: BoardsStore.state.filters
       };
     },
     watch: {
       'query': function () {
-        if (this.board.canSearch()) {
-          this.board.getIssues(true);
+        if (this.list.canSearch()) {
+          this.list.filters = this.getFilterData();
+          this.list.getIssues(true);
         }
       },
       'filters': {
         handler: function () {
-          this.board.getIssues(true);
+          this.list.getIssues(true);
         },
         deep: true
       }
@@ -27,14 +29,14 @@
         this.query = '';
       },
       getFilterData: function () {
-        const queryData = this.board.canSearch() ? { search: this.query } : {};
+        const queryData = this.list.canSearch() ? { search: this.query } : {};
 
         return _.extend(queryData, this.filters);
       }
     },
     computed: {
       isPreset: function () {
-        return this.board.type === 'backlog' || this.board.type === 'done' || this.board.type === 'blank';
+        return this.list.type === 'backlog' || this.list.type === 'done' || this.list.type === 'blank';
       }
     },
     ready: function () {
diff --git a/app/assets/javascripts/boards/stores/boards_store.js.es6 b/app/assets/javascripts/boards/stores/boards_store.js.es6
index e700fb4281d..fe2b11a9a8e 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js.es6
+++ b/app/assets/javascripts/boards/stores/boards_store.js.es6
@@ -113,7 +113,9 @@
       }
 
       if (listTo.type === 'done' && listFrom.type !== 'backlog') {
-        _.each(issueLists, list.removeIssue.bind(list));
+        _.each(issueLists, function (list) {
+          list.removeIssue(issue);
+        });
         issue.removeLabels(listLabels);
       } else {
         listFrom.removeIssue(issue);
diff --git a/app/views/projects/boards/components/_blank_state.html.haml b/app/views/projects/boards/components/_blank_state.html.haml
index 1379a295912..72769736f2f 100644
--- a/app/views/projects/boards/components/_blank_state.html.haml
+++ b/app/views/projects/boards/components/_blank_state.html.haml
@@ -1,4 +1,5 @@
-%board-blank-state{ "inline-template" => true, "v-if" => "board.id == 'blank'" }
+%board-blank-state{ "inline-template" => true,
+  "v-if" => "list.id == 'blank'" }
   .board-blank-state
     %p
       Add the following default lists to your Issue Board with one click:
diff --git a/app/views/projects/boards/components/_board.html.haml b/app/views/projects/boards/components/_board.html.haml
index c1172dce269..f7f1fb832c8 100644
--- a/app/views/projects/boards/components/_board.html.haml
+++ b/app/views/projects/boards/components/_board.html.haml
@@ -1,29 +1,29 @@
 %board{ "inline-template" => true,
   "v-cloak" => true,
-  "v-for" => "board in state.lists | orderBy 'position'",
-  ":board" => "board",
+  "v-for" => "list in state.lists | orderBy 'position'",
+  ":list" => "list",
   ":disabled" => "#{current_user.nil?}" }
   .board{ ":class" => "{ 'is-draggable': !isPreset }" }
     .board-inner
-      %header.board-header{ ":class" => "{ 'has-border': board.label }", ":style" => "{ borderTopColor: (board.label ? board.label.color : null) }" }
+      %header.board-header{ ":class" => "{ 'has-border': list.label }", ":style" => "{ borderTopColor: (list.label ? list.label.color : null) }" }
         %h3.board-title.js-board-handle{ ":class" => "{ 'user-can-drag': !disabled }" }
-          {{ board.title }}
-          %span.pull-right{ "v-if" => "board.type !== 'blank'" }
-            {{ board.issues.length }}
+          {{ list.title }}
+          %span.pull-right{ "v-if" => "list.type !== 'blank'" }
+            {{ list.issues.length }}
           - if current_user
-            %board-delete{ "inline-template" => true, "v-if" => "!isPreset", ":board-id" => "board.id" }
+            %board-delete{ "inline-template" => true, "v-if" => "!isPreset", ":board-id" => "list.id" }
               %button.board-delete.has-tooltip.pull-right{ type: "button", title: "Delete list", "aria-label" => "Delete list", data: { placement: "bottom" }, "@click" => "deleteBoard" }
                 = icon("trash")
-      .board-inner-container.board-search-container{ "v-if" => "board.canSearch()" }
+      .board-inner-container.board-search-container{ "v-if" => "list.canSearch()" }
         %input.form-control{ type: "text", placeholder: "Search issues", "v-model" => "query", "debounce" => "250" }
         = icon("search", class: "board-search-icon", "v-show" => "!query")
         %button.board-search-clear-btn{ type: "button", role: "button", "aria-label" => "Clear search", "@click" => "clearSearch", "v-show" => "query" }
           = icon("times", class: "board-search-clear")
       %board-list{ "inline-template" => true,
-        "v-if" => "board.type !== 'blank'",
-        ":list" => "board",
-        ":issues" => "board.issues",
-        ":loading" => "board.loading",
+        "v-if" => "list.type !== 'blank'",
+        ":list" => "list",
+        ":issues" => "list.issues",
+        ":loading" => "list.loading",
         ":disabled" => "disabled",
         ":issue-link-base" => "'#{namespace_project_issues_path(@project.namespace, @project)}'" }
         .board-list-loading.text-center{ "v-if" => "loading" }