Updates new dropdown list when removing lists

3 files changed, 22 insertions, 14 deletions

diff --git a/app/assets/javascripts/boards/components/new_list_dropdown.js.es6 b/app/assets/javascripts/boards/components/new_list_dropdown.js.es6
index 3545c596f76..e0fd2509e80 100644
--- a/app/assets/javascripts/boards/components/new_list_dropdown.js.es6
+++ b/app/assets/javascripts/boards/components/new_list_dropdown.js.es6
@@ -11,11 +11,10 @@ $(() => {
         });
       },
       renderRow: (label) => {
-        const isHidden = BoardsStore.findList('title', label.title),
-              $li = $('<li />', {
-                class: (isHidden ? 'hidden' : '')
-              }),
+        const active = BoardsStore.findList('title', label.title),
+              $li = $('<li />',),
               $a = $('<a />', {
+                class: (active ? 'is-active' : ''),
                 text: label.title,
                 href: '#'
               }),
@@ -33,16 +32,18 @@ $(() => {
       selectable: true,
       clicked: (label, $el, e) => {
         e.preventDefault();
-        BoardsStore.new({
-          title: label.title,
-          position: BoardsStore.state.lists.length - 1,
-          label: {
-            id: label.id,
+
+        if (!BoardsStore.findList('title', label.title)) {
+          BoardsStore.new({
             title: label.title,
-            color: label.color
-          },
-          issues: []
-        });
+            position: BoardsStore.state.lists.length - 1,
+            label: {
+              id: label.id,
+              title: label.title,
+              color: label.color
+            }
+          });
+        }
       }
     });
   });
diff --git a/app/assets/javascripts/boards/stores/boards_store.js.es6 b/app/assets/javascripts/boards/stores/boards_store.js.es6
index 22c84de66a9..fcd5ada2265 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js.es6
+++ b/app/assets/javascripts/boards/stores/boards_store.js.es6
@@ -18,10 +18,15 @@
       if (persist) {
         list.save();
         this.removeBlankState();
+        this.updateNewListDropdown();
       }
 
       return list;
     },
+    updateNewListDropdown: function () {
+      const data = $('.js-new-board-list').data('glDropdown').renderedData;
+      $('.js-new-board-list').data('glDropdown').renderData(data);
+    },
     shouldAddBlankState: function () {
       // Decide whether to add the blank state
       let addBlankState = true;
@@ -73,6 +78,8 @@
       this.state.lists = _.reject(this.state.lists, (list) => {
         return list.id === id;
       });
+
+      this.updateNewListDropdown();
     },
     moveList: function (oldIndex, newIndex) {
       const listFrom = this.findList('position', oldIndex),
diff --git a/app/views/shared/issuable/_filter.html.haml b/app/views/shared/issuable/_filter.html.haml
index 26138ee9159..0fbf9a086e8 100644
--- a/app/views/shared/issuable/_filter.html.haml
+++ b/app/views/shared/issuable/_filter.html.haml
@@ -33,7 +33,7 @@
             .dropdown
               %button.btn.btn-create.js-new-board-list{ type: "button", data: { toggle: "dropdown", labels: labels_filter_path } }
                 Create new list
-              .dropdown-menu.dropdown-menu-paging.dropdown-menu-align-right.dropdown-menu-issues-board-new
+              .dropdown-menu.dropdown-menu-paging.dropdown-menu-align-right.dropdown-menu-issues-board-new.dropdown-menu-selectable
                 = render partial: "shared/issuable/label_page_default", locals: { show_footer: true, show_create: true, show_boards_content: true, title: "Create a new list" }
                 - if can?(current_user, :admin_label, @project)
                   = render partial: "shared/issuable/label_page_create"