From cc1e51efa7706a738e2c64693da67013638fede6 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Wed, 7 Jun 2017 11:18:35 +0100
Subject: Added report issuable feature

---
 .../javascripts/close_reopen_report_toggle.js      | 102 +++++++++++++++++++++
 app/assets/javascripts/comment_type_toggle.js      |   5 +-
 app/assets/javascripts/issue.js                    |  32 +++++--
 app/assets/javascripts/merge_request.js            |  17 ++++
 app/assets/stylesheets/framework/buttons.scss      |  18 +++-
 app/assets/stylesheets/framework/dropdowns.scss    |  62 ++++++++++++-
 app/assets/stylesheets/pages/issuable.scss         |  11 +++
 app/assets/stylesheets/pages/note_form.scss        |  51 -----------
 8 files changed, 234 insertions(+), 64 deletions(-)
 create mode 100644 app/assets/javascripts/close_reopen_report_toggle.js

(limited to 'app/assets')

diff --git a/app/assets/javascripts/close_reopen_report_toggle.js b/app/assets/javascripts/close_reopen_report_toggle.js
new file mode 100644
index 00000000000..bddcef13a70
--- /dev/null
+++ b/app/assets/javascripts/close_reopen_report_toggle.js
@@ -0,0 +1,102 @@
+import DropLab from './droplab/drop_lab';
+import ISetter from './droplab/plugins/input_setter';
+
+// Todo: Remove this when fixing issue in input_setter plugin
+const InputSetter = Object.assign({}, ISetter);
+
+class CloseReopenReportToggle {
+  constructor(opts = {}) {
+    this.dropdownTrigger = opts.dropdownTrigger;
+    this.dropdownList = opts.dropdownList;
+    this.button = opts.button;
+
+    this.reopenItem = this.dropdownList.querySelector('.reopen-item');
+    this.closeItem = this.dropdownList.querySelector('.close-item');
+  }
+
+  initDroplab() {
+    this.droplab = new DropLab();
+
+    const config = this.setConfig();
+
+    this.droplab.init(this.dropdownTrigger, this.dropdownList, [InputSetter], config);
+  }
+
+  updateButton(isClosed) {
+    const action = isClosed ? this.showReopen : this.showClose;
+
+    action.call(this);
+    this.button.blur();
+  }
+
+  showClose() {
+    this.closeItem.classList.remove('hidden');
+    this.closeItem.classList.add('droplab-item-selected');
+
+    this.reopenItem.classList.add('hidden');
+    this.reopenItem.classList.remove('droplab-item-selected');
+
+    this.closeItem.click();
+  }
+
+  showReopen() {
+    this.reopenItem.classList.remove('hidden');
+    this.reopenItem.classList.add('droplab-item-selected');
+
+    this.closeItem.classList.add('hidden');
+    this.closeItem.classList.remove('droplab-item-selected');
+
+    this.reopenItem.click();
+  }
+
+  setDisable(shouldDisable) {
+    if (shouldDisable) {
+      this.button.setAttribute('disabled', 'true');
+      this.dropdownTrigger.setAttribute('disabled', 'true');
+    } else {
+      this.button.removeAttribute('disabled');
+      this.dropdownTrigger.removeAttribute('disabled');
+    }
+  }
+
+  setConfig() {
+    const config = {
+      InputSetter: [
+        {
+          input: this.button,
+          valueAttribute: 'data-text',
+          inputAttribute: 'data-value',
+        },
+        {
+          input: this.button,
+          valueAttribute: 'data-text',
+          inputAttribute: 'title',
+        },
+        {
+          input: this.button,
+          valueAttribute: 'data-button-class',
+          inputAttribute: 'class',
+        },
+        {
+          input: this.dropdownTrigger,
+          valueAttribute: 'data-toggle-class',
+          inputAttribute: 'class',
+        },
+        {
+          input: this.button,
+          valueAttribute: 'data-url',
+          inputAttribute: 'href',
+        },
+        {
+          input: this.button,
+          valueAttribute: 'data-method',
+          inputAttribute: 'data-method',
+        },
+      ],
+    };
+
+    return config;
+  }
+}
+
+export default CloseReopenReportToggle;
diff --git a/app/assets/javascripts/comment_type_toggle.js b/app/assets/javascripts/comment_type_toggle.js
index df0ba86198c..c74184949df 100644
--- a/app/assets/javascripts/comment_type_toggle.js
+++ b/app/assets/javascripts/comment_type_toggle.js
@@ -1,5 +1,8 @@
 import DropLab from './droplab/drop_lab';
-import InputSetter from './droplab/plugins/input_setter';
+import ISetter from './droplab/plugins/input_setter';
+
+// Todo: Remove this when fixing issue in input_setter plugin
+const InputSetter = Object.assign({}, ISetter);
 
 class CommentTypeToggle {
   constructor(opts = {}) {
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 0860e237ce1..62ffde6c93c 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -6,6 +6,7 @@ import '~/lib/utils/text_utility';
 import './flash';
 import './task_list';
 import CreateMergeRequestDropdown from './create_merge_request_dropdown';
+import CloseReopenReportToggle from './close_reopen_report_toggle';
 
 class Issue {
   constructor() {
@@ -28,6 +29,8 @@ class Issue {
     Issue.initMergeRequests();
     Issue.initRelatedBranches();
 
+    this.initCloseReopenReport();
+
     if (Issue.createMrDropdownWrap) {
       this.createMergeRequestDropdown = new CreateMergeRequestDropdown(Issue.createMrDropdownWrap);
     }
@@ -35,13 +38,11 @@ class Issue {
 
   initIssueBtnEventListeners() {
     const issueFailMessage = 'Unable to update this issue at this time.';
-    const closeButtons = $('a.btn-close');
     const isClosedBadge = $('div.status-box-closed');
     const isOpenBadge = $('div.status-box-open');
     const projectIssuesCounter = $('.issue_counter');
-    const reopenButtons = $('a.btn-reopen');
 
-    return closeButtons.add(reopenButtons).on('click', (e) => {
+    return $(document).on('click', 'a.btn-close, a.btn-reopen', (e) => {
       var $button, shouldSubmit, url;
       e.preventDefault();
       e.stopImmediatePropagation();
@@ -50,7 +51,9 @@ class Issue {
       if (shouldSubmit) {
         Issue.submitNoteForm($button.closest('form'));
       }
-      $button.prop('disabled', true);
+
+      this.closeReopenReportToggle.setDisable(true);
+
       url = $button.attr('href');
       return $.ajax({
         type: 'PUT',
@@ -62,11 +65,11 @@ class Issue {
           $(document).trigger('issuable:change');
 
           const isClosed = $button.hasClass('btn-close');
-          closeButtons.toggleClass('hidden', isClosed);
-          reopenButtons.toggleClass('hidden', !isClosed);
           isClosedBadge.toggleClass('hidden', !isClosed);
           isOpenBadge.toggleClass('hidden', isClosed);
 
+          this.closeReopenReportToggle.updateButton(isClosed);
+
           let numProjectIssues = Number(projectIssuesCounter.text().replace(/[^\d]/, ''));
           numProjectIssues = isClosed ? numProjectIssues - 1 : numProjectIssues + 1;
           projectIssuesCounter.text(gl.text.addDelimiter(numProjectIssues));
@@ -84,11 +87,26 @@ class Issue {
           new Flash(issueFailMessage);
         }
 
-        $button.prop('disabled', false);
+        this.closeReopenReportToggle.setDisable(false);
       });
     });
   }
 
+  initCloseReopenReport() {
+    const container = document.querySelector('.js-issuable-close-dropdown');
+    const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
+    const dropdownList = container.querySelector('.js-issuable-close-menu');
+    const button = container.querySelector('.js-issuable-close-button');
+
+    this.closeReopenReportToggle = new CloseReopenReportToggle({
+      dropdownTrigger,
+      dropdownList,
+      button,
+    });
+
+    this.closeReopenReportToggle.initDroplab();
+  }
+
   static submitNoteForm(form) {
     var noteText;
     noteText = form.find("textarea.js-note-text").val();
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index f93feeec1c2..c00978bfaea 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -4,6 +4,7 @@
 import 'vendor/jquery.waitforimages';
 import './task_list';
 import './merge_request_tabs';
+import CloseReopenReportToggle from './close_reopen_report_toggle';
 
 (function() {
   this.MergeRequest = (function() {
@@ -24,6 +25,7 @@ import './merge_request_tabs';
       this.initTabs();
       this.initMRBtnListeners();
       this.initCommitMessageListeners();
+      MergeRequest.initCloseReopenReport();
       if ($("a.btn-close").length) {
         this.taskList = new gl.TaskList({
           dataType: 'merge_request',
@@ -119,6 +121,21 @@ import './merge_request_tabs';
       $el.text(gl.text.addDelimiter(count));
     };
 
+    MergeRequest.initCloseReopenReport = function () {
+      const container = document.querySelector('.js-issuable-close-dropdown');
+      const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
+      const dropdownList = container.querySelector('.js-issuable-close-menu');
+      const button = container.querySelector('.js-issuable-close-button');
+
+      const closeReopenReportToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+
+      closeReopenReportToggle.initDroplab();
+    };
+
     return MergeRequest;
   })();
 }).call(window);
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index 4369ae78bde..a9d441d5367 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -20,17 +20,29 @@
   color: $text;
   border-color: $border;
 
+  > i {
+    color: $text;
+  }
+
   &:hover,
   &:focus {
     background-color: $hover-background;
     border-color: $hover-border;
     color: $hover-text;
+
+    > i {
+      color: $hover-text;
+    }
   }
 
   &:active {
     background-color: $active-background;
     border-color: $active-border;
     color: $hover-text;
+
+    > i {
+      color: $hover-text;
+    }
   }
 }
 
@@ -163,7 +175,8 @@
     @include btn-orange;
   }
 
-  &.btn-close {
+  &.btn-close,
+  &.btn-close-color {
     @include btn-outline($white-light, $orange-600, $orange-500, $orange-500, $white-light, $orange-600, $orange-600, $orange-700);
   }
 
@@ -181,7 +194,8 @@
     float: right;
   }
 
-  &.btn-reopen {
+  &.btn-reopen,
+  .btn-reopen-color {
     /* should be same as parent class for now */
   }
 
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index 4f54ca24940..4c28c1f04d8 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -295,9 +295,65 @@
   }
 }
 
-.filtered-search-box-input-container .dropdown-menu,
-.filtered-search-box-input-container .dropdown-menu-nav,
-.comment-type-dropdown .dropdown-menu {
+.droplab-dropdown {
+  .description {
+    display: inline-block;
+    white-space: normal;
+    margin-left: 8px;
+    padding-right: 33px;
+  }
+
+  .dropdown-toggle > i {
+    pointer-events: none;
+  }
+
+  li {
+    padding-top: 6px;
+
+    & > a {
+      margin: 0;
+      padding: 0;
+      color: inherit;
+      border-radius: 0;
+      text-overflow: inherit;
+
+      &:hover,
+      &:focus {
+        background-color: inherit;
+        color: inherit;
+      }
+    }
+
+    &:hover,
+    &:focus {
+      background-color: $dropdown-hover-color;
+      color: $white-light;
+    }
+
+    &.droplab-item-selected i {
+      visibility: visible;
+    }
+
+    i {
+      visibility: hidden;
+    }
+  }
+
+  i {
+    display: inline-block;
+    vertical-align: top;
+    padding-top: 2px;
+  }
+
+  .divider {
+    margin: 0 8px;
+    padding: 0;
+    border-top: $gray-darkest;
+  }
+}
+
+.droplab-dropdown .dropdown-menu,
+.droplab-dropdown .dropdown-menu-nav {
   display: none;
   opacity: 1;
   visibility: visible;
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 47f50083726..2f35fb94a3d 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -799,3 +799,14 @@
     }
   }
 }
+
+.issuable-close-button,
+.issuable-close-toggle {
+  @include transition(border-color, color);
+}
+
+.issuable-close-dropdown .dropdown-menu {
+  min-width: 270px;
+  left: auto;
+  right: 0;
+}
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index 9877ed2cfd6..cdb1e65e4be 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -356,7 +356,6 @@
       color: $white-light;
       padding-right: 2px;
       margin-top: 2px;
-      pointer-events: none;
     }
   }
 
@@ -366,56 +365,6 @@
     width: 298px;
   }
 
-  .description {
-    display: inline-block;
-    white-space: normal;
-    margin-left: 8px;
-    padding-right: 33px;
-  }
-
-  li {
-    padding-top: 6px;
-
-    & > a {
-      margin: 0;
-      padding: 0;
-      color: inherit;
-      border-radius: 0;
-      text-overflow: inherit;
-
-      &:hover,
-      &:focus {
-        background-color: inherit;
-        color: inherit;
-      }
-    }
-
-    &:hover,
-    &:focus {
-      background-color: $dropdown-hover-color;
-      color: $white-light;
-    }
-
-    &.droplab-item-selected i {
-      visibility: visible;
-    }
-
-    i {
-      visibility: hidden;
-    }
-  }
-
-  i {
-    display: inline-block;
-    vertical-align: top;
-    padding-top: 2px;
-  }
-
-  .divider {
-    margin: 0 8px;
-    padding: 0;
-    border-top: $gray-darkest;
-  }
 
   @media (max-width: $screen-xs-max) {
     display: flex;
-- 
cgit v1.2.1


From e5100c3316f21c2fd49106b7eaa439ea44c1f36b Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Wed, 7 Jun 2017 14:17:03 +0100
Subject: First FE review changes

---
 .../javascripts/close_reopen_report_toggle.js      | 27 +++++++++-------------
 app/assets/stylesheets/framework/buttons.scss      |  6 ++---
 app/assets/stylesheets/framework/dropdowns.scss    | 17 ++++++++++----
 app/assets/stylesheets/framework/filters.scss      |  6 +++++
 4 files changed, 33 insertions(+), 23 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/close_reopen_report_toggle.js b/app/assets/javascripts/close_reopen_report_toggle.js
index bddcef13a70..e56ae598092 100644
--- a/app/assets/javascripts/close_reopen_report_toggle.js
+++ b/app/assets/javascripts/close_reopen_report_toggle.js
@@ -23,30 +23,25 @@ class CloseReopenReportToggle {
   }
 
   updateButton(isClosed) {
-    const action = isClosed ? this.showReopen : this.showClose;
+    this.toggleButtonType(isClosed);
 
-    action.call(this);
     this.button.blur();
   }
 
-  showClose() {
-    this.closeItem.classList.remove('hidden');
-    this.closeItem.classList.add('droplab-item-selected');
+  toggleButtonType(isClosed) {
+    const [showItem, hideItem] = this.getButtonTypes(isClosed);
 
-    this.reopenItem.classList.add('hidden');
-    this.reopenItem.classList.remove('droplab-item-selected');
+    showItem.classList.remove('hidden');
+    showItem.classList.add('droplab-item-selected');
 
-    this.closeItem.click();
-  }
-
-  showReopen() {
-    this.reopenItem.classList.remove('hidden');
-    this.reopenItem.classList.add('droplab-item-selected');
+    hideItem.classList.add('hidden');
+    hideItem.classList.remove('droplab-item-selected');
 
-    this.closeItem.classList.add('hidden');
-    this.closeItem.classList.remove('droplab-item-selected');
+    showItem.click();
+  }
 
-    this.reopenItem.click();
+  getButtonTypes(isClosed) {
+    return isClosed ? [this.reopenItem, this.closeItem] : [this.closeItem, this.reopenItem];
   }
 
   setDisable(shouldDisable) {
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index a9d441d5367..6eabdc63d9e 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -20,7 +20,7 @@
   color: $text;
   border-color: $border;
 
-  > i {
+  > .icon {
     color: $text;
   }
 
@@ -30,7 +30,7 @@
     border-color: $hover-border;
     color: $hover-text;
 
-    > i {
+    > .icon {
       color: $hover-text;
     }
   }
@@ -40,7 +40,7 @@
     border-color: $active-border;
     color: $hover-text;
 
-    > i {
+    > .icon {
       color: $hover-text;
     }
   }
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index 4c28c1f04d8..38000de3581 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -310,18 +310,27 @@
   li {
     padding-top: 6px;
 
-    & > a {
+    > a,
+    > button {
       margin: 0;
       padding: 0;
-      color: inherit;
       border-radius: 0;
       text-overflow: inherit;
+      background-color: inherit;
+      color: inherit;
+      border: inherit;
+      text-align: left;
 
       &:hover,
       &:focus {
         background-color: inherit;
         color: inherit;
       }
+
+      &.btn .fa:not(:last-child) {
+        margin-right: 0;
+        margin-left: 5px;
+      }
     }
 
     &:hover,
@@ -334,12 +343,12 @@
       visibility: visible;
     }
 
-    i {
+    .icon {
       visibility: hidden;
     }
   }
 
-  i {
+  .icon {
     display: inline-block;
     vertical-align: top;
     padding-top: 2px;
diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index 767cf5ffea5..bc0c78ef5ed 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -70,6 +70,12 @@
 
   .input-token {
     max-width: 200px;
+
+    &:hover,
+    &:focus {
+      background-color: inherit;
+      color: inherit;
+    }
   }
 
   .input-token:only-child,
-- 
cgit v1.2.1


From fa82736cf4ba55c0f549f137afd2abe8383e33f8 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Wed, 7 Jun 2017 17:42:09 +0100
Subject: First UX review changes

---
 app/assets/stylesheets/framework/dropdowns.scss | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index 38000de3581..c9986441406 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -299,8 +299,7 @@
   .description {
     display: inline-block;
     white-space: normal;
-    margin-left: 8px;
-    padding-right: 33px;
+    margin-left: 5px;
   }
 
   .dropdown-toggle > i {
@@ -308,10 +307,11 @@
   }
 
   li {
-    padding-top: 6px;
+    padding: $gl-btn-padding $gl-btn-padding 2px;
 
     > a,
     > button {
+      display: flex;
       margin: 0;
       padding: 0;
       border-radius: 0;
@@ -328,7 +328,6 @@
       }
 
       &.btn .fa:not(:last-child) {
-        margin-right: 0;
         margin-left: 5px;
       }
     }
-- 
cgit v1.2.1


From 421e41c9ce3abdd843079c1eb022cad8974d36ff Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Wed, 7 Jun 2017 20:34:19 +0100
Subject: Added specs

---
 app/assets/javascripts/close_reopen_report_toggle.js | 8 ++++----
 app/assets/javascripts/issue.js                      | 4 ++--
 app/assets/javascripts/merge_request.js              | 7 +++++--
 3 files changed, 11 insertions(+), 8 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/close_reopen_report_toggle.js b/app/assets/javascripts/close_reopen_report_toggle.js
index e56ae598092..0824f124984 100644
--- a/app/assets/javascripts/close_reopen_report_toggle.js
+++ b/app/assets/javascripts/close_reopen_report_toggle.js
@@ -1,4 +1,4 @@
-import DropLab from './droplab/drop_lab';
+import * as DropLab from './droplab/drop_lab';
 import ISetter from './droplab/plugins/input_setter';
 
 // Todo: Remove this when fixing issue in input_setter plugin
@@ -9,13 +9,13 @@ class CloseReopenReportToggle {
     this.dropdownTrigger = opts.dropdownTrigger;
     this.dropdownList = opts.dropdownList;
     this.button = opts.button;
+  }
 
+  initDroplab() {
     this.reopenItem = this.dropdownList.querySelector('.reopen-item');
     this.closeItem = this.dropdownList.querySelector('.close-item');
-  }
 
-  initDroplab() {
-    this.droplab = new DropLab();
+    this.droplab = new DropLab.default();
 
     const config = this.setConfig();
 
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 62ffde6c93c..b61570e88e0 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -6,7 +6,7 @@ import '~/lib/utils/text_utility';
 import './flash';
 import './task_list';
 import CreateMergeRequestDropdown from './create_merge_request_dropdown';
-import CloseReopenReportToggle from './close_reopen_report_toggle';
+import * as CloseReopenReportToggle from './close_reopen_report_toggle';
 
 class Issue {
   constructor() {
@@ -98,7 +98,7 @@ class Issue {
     const dropdownList = container.querySelector('.js-issuable-close-menu');
     const button = container.querySelector('.js-issuable-close-button');
 
-    this.closeReopenReportToggle = new CloseReopenReportToggle({
+    this.closeReopenReportToggle = new CloseReopenReportToggle.default({
       dropdownTrigger,
       dropdownList,
       button,
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index c00978bfaea..eebf45aa581 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -4,7 +4,7 @@
 import 'vendor/jquery.waitforimages';
 import './task_list';
 import './merge_request_tabs';
-import CloseReopenReportToggle from './close_reopen_report_toggle';
+import * as CloseReopenReportToggle from './close_reopen_report_toggle';
 
 (function() {
   this.MergeRequest = (function() {
@@ -123,11 +123,14 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
 
     MergeRequest.initCloseReopenReport = function () {
       const container = document.querySelector('.js-issuable-close-dropdown');
+
+      if (!container) return;
+
       const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
       const dropdownList = container.querySelector('.js-issuable-close-menu');
       const button = container.querySelector('.js-issuable-close-button');
 
-      const closeReopenReportToggle = new CloseReopenReportToggle({
+      const closeReopenReportToggle = new CloseReopenReportToggle.default({
         dropdownTrigger,
         dropdownList,
         button,
-- 
cgit v1.2.1


From 001c904f28566b2fb3575b5a79871cedf94ea289 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Thu, 8 Jun 2017 17:15:34 +0100
Subject: Remove inclusive JS imports

---
 app/assets/javascripts/close_reopen_report_toggle.js | 4 ++--
 app/assets/javascripts/issue.js                      | 4 ++--
 app/assets/javascripts/merge_request.js              | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/close_reopen_report_toggle.js b/app/assets/javascripts/close_reopen_report_toggle.js
index 0824f124984..43467a7e277 100644
--- a/app/assets/javascripts/close_reopen_report_toggle.js
+++ b/app/assets/javascripts/close_reopen_report_toggle.js
@@ -1,4 +1,4 @@
-import * as DropLab from './droplab/drop_lab';
+import DropLab from './droplab/drop_lab';
 import ISetter from './droplab/plugins/input_setter';
 
 // Todo: Remove this when fixing issue in input_setter plugin
@@ -15,7 +15,7 @@ class CloseReopenReportToggle {
     this.reopenItem = this.dropdownList.querySelector('.reopen-item');
     this.closeItem = this.dropdownList.querySelector('.close-item');
 
-    this.droplab = new DropLab.default();
+    this.droplab = new DropLab();
 
     const config = this.setConfig();
 
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index b61570e88e0..62ffde6c93c 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -6,7 +6,7 @@ import '~/lib/utils/text_utility';
 import './flash';
 import './task_list';
 import CreateMergeRequestDropdown from './create_merge_request_dropdown';
-import * as CloseReopenReportToggle from './close_reopen_report_toggle';
+import CloseReopenReportToggle from './close_reopen_report_toggle';
 
 class Issue {
   constructor() {
@@ -98,7 +98,7 @@ class Issue {
     const dropdownList = container.querySelector('.js-issuable-close-menu');
     const button = container.querySelector('.js-issuable-close-button');
 
-    this.closeReopenReportToggle = new CloseReopenReportToggle.default({
+    this.closeReopenReportToggle = new CloseReopenReportToggle({
       dropdownTrigger,
       dropdownList,
       button,
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index eebf45aa581..412d68dc37a 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -4,7 +4,7 @@
 import 'vendor/jquery.waitforimages';
 import './task_list';
 import './merge_request_tabs';
-import * as CloseReopenReportToggle from './close_reopen_report_toggle';
+import CloseReopenReportToggle from './close_reopen_report_toggle';
 
 (function() {
   this.MergeRequest = (function() {
@@ -130,7 +130,7 @@ import * as CloseReopenReportToggle from './close_reopen_report_toggle';
       const dropdownList = container.querySelector('.js-issuable-close-menu');
       const button = container.querySelector('.js-issuable-close-button');
 
-      const closeReopenReportToggle = new CloseReopenReportToggle.default({
+      const closeReopenReportToggle = new CloseReopenReportToggle({
         dropdownTrigger,
         dropdownList,
         button,
-- 
cgit v1.2.1


From 55dd0d722d87a24f3b83a8a7692666a64387d668 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Mon, 3 Jul 2017 17:00:59 +0100
Subject: Dont show toggle if only one action is available and do not show
 report as abuse for current_user's issuables

---
 app/assets/javascripts/issue.js               | 31 ++++++++++++++++++++++++---
 app/assets/javascripts/merge_request.js       | 24 ++++++++++++++++-----
 app/assets/stylesheets/framework/filters.scss |  1 +
 3 files changed, 48 insertions(+), 8 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 62ffde6c93c..70007d4d4af 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -31,6 +31,11 @@ class Issue {
 
     this.initCloseReopenReport();
 
+    if (!this.closeReopenReportToggle) {
+      this.closeButtons = $('a.btn-close');
+      this.reopenButtons = $('a.btn-reopen');
+    }
+
     if (Issue.createMrDropdownWrap) {
       this.createMergeRequestDropdown = new CreateMergeRequestDropdown(Issue.createMrDropdownWrap);
     }
@@ -52,7 +57,7 @@ class Issue {
         Issue.submitNoteForm($button.closest('form'));
       }
 
-      this.closeReopenReportToggle.setDisable(true);
+      this.disableCloseReopenButton($button, true);
 
       url = $button.attr('href');
       return $.ajax({
@@ -68,7 +73,7 @@ class Issue {
           isClosedBadge.toggleClass('hidden', !isClosed);
           isOpenBadge.toggleClass('hidden', isClosed);
 
-          this.closeReopenReportToggle.updateButton(isClosed);
+          this.toggleCloseReopenButton(isClosed);
 
           let numProjectIssues = Number(projectIssuesCounter.text().replace(/[^\d]/, ''));
           numProjectIssues = isClosed ? numProjectIssues - 1 : numProjectIssues + 1;
@@ -87,13 +92,16 @@ class Issue {
           new Flash(issueFailMessage);
         }
 
-        this.closeReopenReportToggle.setDisable(false);
+        this.disableCloseReopenButton($button, false);
       });
     });
   }
 
   initCloseReopenReport() {
     const container = document.querySelector('.js-issuable-close-dropdown');
+
+    if (!container) return;
+
     const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
     const dropdownList = container.querySelector('.js-issuable-close-menu');
     const button = container.querySelector('.js-issuable-close-button');
@@ -107,6 +115,23 @@ class Issue {
     this.closeReopenReportToggle.initDroplab();
   }
 
+  disableCloseReopenButton($button, shouldDisable) {
+    if (this.closeReopenReportToggle) {
+      this.closeReopenReportToggle.setDisable(shouldDisable);
+    } else {
+      $button.prop('disabled', shouldDisable);
+    }
+  }
+
+  toggleCloseReopenButton(isClosed) {
+    if (this.closeReopenReportToggle) {
+      this.closeReopenReportToggle.updateButton(isClosed);
+    } else {
+      this.closeButtons.toggleClass('hidden', isClosed);
+      this.reopenButtons.toggleClass('hidden', !isClosed);
+    }
+  }
+
   static submitNoteForm(form) {
     var noteText;
     noteText = form.find("textarea.js-note-text").val();
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index 412d68dc37a..cae2f290f87 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -22,10 +22,12 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
           return _this.showAllCommits();
         };
       })(this));
+      
       this.initTabs();
       this.initMRBtnListeners();
       this.initCommitMessageListeners();
-      MergeRequest.initCloseReopenReport();
+      this.initCloseReopenReport();
+      
       if ($("a.btn-close").length) {
         this.taskList = new gl.TaskList({
           dataType: 'merge_request',
@@ -66,11 +68,15 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
         if (shouldSubmit && $this.data('submitted')) {
           return;
         }
+
+        _this.disableCloseReopenButton($this, true);
+
         if (shouldSubmit) {
           if ($this.hasClass('btn-comment-and-close') || $this.hasClass('btn-comment-and-reopen')) {
             e.preventDefault();
             e.stopImmediatePropagation();
-            return _this.submitNoteForm($this.closest('form'), $this);
+
+            _this.submitNoteForm($this.closest('form'), $this);
           }
         }
       });
@@ -121,7 +127,7 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
       $el.text(gl.text.addDelimiter(count));
     };
 
-    MergeRequest.initCloseReopenReport = function () {
+    MergeRequest.prototype.initCloseReopenReport = function () {
       const container = document.querySelector('.js-issuable-close-dropdown');
 
       if (!container) return;
@@ -130,13 +136,21 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
       const dropdownList = container.querySelector('.js-issuable-close-menu');
       const button = container.querySelector('.js-issuable-close-button');
 
-      const closeReopenReportToggle = new CloseReopenReportToggle({
+      this.closeReopenReportToggle = new CloseReopenReportToggle({
         dropdownTrigger,
         dropdownList,
         button,
       });
 
-      closeReopenReportToggle.initDroplab();
+      this.closeReopenReportToggle.initDroplab();
+    };
+
+    MergeRequest.prototype.disableCloseReopenButton = function ($button, shouldDisable) {
+      if (this.closeReopenReportToggle) {
+        this.closeReopenReportToggle.setDisable(shouldDisable);
+      } else {
+        $button.prop('disabled', shouldDisable);
+      }
     };
 
     return MergeRequest;
diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index bc0c78ef5ed..bc2c536ba0e 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -83,6 +83,7 @@
     flex: 1;
     -webkit-flex: 1;
     max-width: inherit;
+    padding: 0;
   }
 }
 
-- 
cgit v1.2.1


From d7c383a0ee2ec71e5ef941ccec1de0aaf1ecc8b6 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Tue, 4 Jul 2017 14:41:26 +0100
Subject: Fixed MR single button submit failure and attempted to tidy up
 close_reopen partials using issuable_helpers and setDisable will use true as
 default bool

---
 app/assets/javascripts/close_reopen_report_toggle.js |  2 +-
 app/assets/javascripts/issue.js                      |  2 +-
 app/assets/javascripts/merge_request.js              | 10 +---------
 3 files changed, 3 insertions(+), 11 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/close_reopen_report_toggle.js b/app/assets/javascripts/close_reopen_report_toggle.js
index 43467a7e277..882d20671cc 100644
--- a/app/assets/javascripts/close_reopen_report_toggle.js
+++ b/app/assets/javascripts/close_reopen_report_toggle.js
@@ -44,7 +44,7 @@ class CloseReopenReportToggle {
     return isClosed ? [this.reopenItem, this.closeItem] : [this.closeItem, this.reopenItem];
   }
 
-  setDisable(shouldDisable) {
+  setDisable(shouldDisable = true) {
     if (shouldDisable) {
       this.button.setAttribute('disabled', 'true');
       this.dropdownTrigger.setAttribute('disabled', 'true');
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 70007d4d4af..fa4d95887c6 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -57,7 +57,7 @@ class Issue {
         Issue.submitNoteForm($button.closest('form'));
       }
 
-      this.disableCloseReopenButton($button, true);
+      this.disableCloseReopenButton($button);
 
       url = $button.attr('href');
       return $.ajax({
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index cae2f290f87..a485ad25ab7 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -69,7 +69,7 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
           return;
         }
 
-        _this.disableCloseReopenButton($this, true);
+        if (this.closeReopenReportToggle) this.closeReopenReportToggle.setDisable();
 
         if (shouldSubmit) {
           if ($this.hasClass('btn-comment-and-close') || $this.hasClass('btn-comment-and-reopen')) {
@@ -145,14 +145,6 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
       this.closeReopenReportToggle.initDroplab();
     };
 
-    MergeRequest.prototype.disableCloseReopenButton = function ($button, shouldDisable) {
-      if (this.closeReopenReportToggle) {
-        this.closeReopenReportToggle.setDisable(shouldDisable);
-      } else {
-        $button.prop('disabled', shouldDisable);
-      }
-    };
-
     return MergeRequest;
   })();
 }).call(window);
-- 
cgit v1.2.1


From 848d868b9b695392176a541de1b097a6f95b6253 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Wed, 5 Jul 2017 17:36:58 +0100
Subject: Fixed issue_spec and merge_request_spec for report toggle changes

---
 app/assets/javascripts/issue.js         | 10 ++++++----
 app/assets/javascripts/merge_request.js |  4 ++--
 2 files changed, 8 insertions(+), 6 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index fa4d95887c6..91e696f5320 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -43,9 +43,6 @@ class Issue {
 
   initIssueBtnEventListeners() {
     const issueFailMessage = 'Unable to update this issue at this time.';
-    const isClosedBadge = $('div.status-box-closed');
-    const isOpenBadge = $('div.status-box-open');
-    const projectIssuesCounter = $('.issue_counter');
 
     return $(document).on('click', 'a.btn-close, a.btn-reopen', (e) => {
       var $button, shouldSubmit, url;
@@ -66,6 +63,10 @@ class Issue {
       })
       .fail(() => new Flash(issueFailMessage))
       .done((data) => {
+        const isClosedBadge = $('div.status-box-closed');
+        const isOpenBadge = $('div.status-box-open');
+        const projectIssuesCounter = $('.issue_counter');
+
         if ('id' in data) {
           $(document).trigger('issuable:change');
 
@@ -91,7 +92,8 @@ class Issue {
         } else {
           new Flash(issueFailMessage);
         }
-
+      })
+      .then(() => {
         this.disableCloseReopenButton($button, false);
       });
     });
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index a485ad25ab7..10860d1363f 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -22,12 +22,12 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
           return _this.showAllCommits();
         };
       })(this));
-      
+
       this.initTabs();
       this.initMRBtnListeners();
       this.initCommitMessageListeners();
       this.initCloseReopenReport();
-      
+
       if ($("a.btn-close").length) {
         this.taskList = new gl.TaskList({
           dataType: 'merge_request',
-- 
cgit v1.2.1


From f0f94278d80f06f01808f6301a1a43d5ab06cef2 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Thu, 6 Jul 2017 15:35:07 +0100
Subject: Tidy up close_reopen helpers and fix filtered-search-token padding

---
 app/assets/stylesheets/framework/filters.scss | 4 ++++
 1 file changed, 4 insertions(+)

(limited to 'app/assets')

diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index bc2c536ba0e..c848fd76298 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -163,6 +163,10 @@
   }
 }
 
+.droplab-dropdown li.filtered-search-token {
+  padding: 0;
+}
+
 .filtered-search-term {
   .name {
     background-color: inherit;
-- 
cgit v1.2.1


From 78dd2f056fac9077c85c4e1b3d9d42abaa7aed05 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Fri, 7 Jul 2017 14:51:34 +0100
Subject: Added issuables_helper.js, tidied up droplab-dropdown JS, fixed
 filtered search specs

---
 app/assets/javascripts/helpers/issuables_helper.js | 21 +++++++++++++
 app/assets/javascripts/issue.js                    | 36 ++++++----------------
 app/assets/javascripts/merge_request.js            | 22 ++-----------
 app/assets/stylesheets/framework/dropdowns.scss    |  1 +
 app/assets/stylesheets/framework/filters.scss      |  8 ++++-
 app/assets/stylesheets/pages/issuable.scss         | 22 ++++++++++---
 6 files changed, 59 insertions(+), 51 deletions(-)
 create mode 100644 app/assets/javascripts/helpers/issuables_helper.js

(limited to 'app/assets')

diff --git a/app/assets/javascripts/helpers/issuables_helper.js b/app/assets/javascripts/helpers/issuables_helper.js
new file mode 100644
index 00000000000..68fd8c74bea
--- /dev/null
+++ b/app/assets/javascripts/helpers/issuables_helper.js
@@ -0,0 +1,21 @@
+import CloseReopenReportToggle from '../close_reopen_report_toggle';
+
+export default function initCloseReopenReport() {
+  const container = document.querySelector('.js-issuable-close-dropdown');
+
+  if (!container) return undefined;
+
+  const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
+  const dropdownList = container.querySelector('.js-issuable-close-menu');
+  const button = container.querySelector('.js-issuable-close-button');
+
+  const closeReopenReportToggle = new CloseReopenReportToggle({
+    dropdownTrigger,
+    dropdownList,
+    button,
+  });
+
+  closeReopenReportToggle.initDroplab();
+
+  return closeReopenReportToggle;
+}
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 91e696f5320..912da6ed6c1 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -6,7 +6,7 @@ import '~/lib/utils/text_utility';
 import './flash';
 import './task_list';
 import CreateMergeRequestDropdown from './create_merge_request_dropdown';
-import CloseReopenReportToggle from './close_reopen_report_toggle';
+import initCloseReopenReport from './helpers/issuables_helper';
 
 class Issue {
   constructor() {
@@ -29,12 +29,10 @@ class Issue {
     Issue.initMergeRequests();
     Issue.initRelatedBranches();
 
-    this.initCloseReopenReport();
+    this.closeButtons = $('a.btn-close');
+    this.reopenButtons = $('a.btn-reopen');
 
-    if (!this.closeReopenReportToggle) {
-      this.closeButtons = $('a.btn-close');
-      this.reopenButtons = $('a.btn-reopen');
-    }
+    this.initCloseReopenReport();
 
     if (Issue.createMrDropdownWrap) {
       this.createMergeRequestDropdown = new CreateMergeRequestDropdown(Issue.createMrDropdownWrap);
@@ -100,21 +98,10 @@ class Issue {
   }
 
   initCloseReopenReport() {
-    const container = document.querySelector('.js-issuable-close-dropdown');
-
-    if (!container) return;
-
-    const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
-    const dropdownList = container.querySelector('.js-issuable-close-menu');
-    const button = container.querySelector('.js-issuable-close-button');
+    this.closeReopenReportToggle = initCloseReopenReport();
 
-    this.closeReopenReportToggle = new CloseReopenReportToggle({
-      dropdownTrigger,
-      dropdownList,
-      button,
-    });
-
-    this.closeReopenReportToggle.initDroplab();
+    this.closeButtons = this.closeButtons.not('.issuable-close-button');
+    this.reopenButtons = this.reopenButtons.not('.issuable-close-button');
   }
 
   disableCloseReopenButton($button, shouldDisable) {
@@ -126,12 +113,9 @@ class Issue {
   }
 
   toggleCloseReopenButton(isClosed) {
-    if (this.closeReopenReportToggle) {
-      this.closeReopenReportToggle.updateButton(isClosed);
-    } else {
-      this.closeButtons.toggleClass('hidden', isClosed);
-      this.reopenButtons.toggleClass('hidden', !isClosed);
-    }
+    if (this.closeReopenReportToggle) this.closeReopenReportToggle.updateButton(isClosed);
+    this.closeButtons.toggleClass('hidden', isClosed);
+    this.reopenButtons.toggleClass('hidden', !isClosed);
   }
 
   static submitNoteForm(form) {
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index 10860d1363f..938c7446a06 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -4,7 +4,7 @@
 import 'vendor/jquery.waitforimages';
 import './task_list';
 import './merge_request_tabs';
-import CloseReopenReportToggle from './close_reopen_report_toggle';
+import initCloseReopenReport from './helpers/issuables_helper';
 
 (function() {
   this.MergeRequest = (function() {
@@ -26,7 +26,7 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
       this.initTabs();
       this.initMRBtnListeners();
       this.initCommitMessageListeners();
-      this.initCloseReopenReport();
+      this.closeReopenReportToggle = initCloseReopenReport();
 
       if ($("a.btn-close").length) {
         this.taskList = new gl.TaskList({
@@ -127,24 +127,6 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
       $el.text(gl.text.addDelimiter(count));
     };
 
-    MergeRequest.prototype.initCloseReopenReport = function () {
-      const container = document.querySelector('.js-issuable-close-dropdown');
-
-      if (!container) return;
-
-      const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
-      const dropdownList = container.querySelector('.js-issuable-close-menu');
-      const button = container.querySelector('.js-issuable-close-button');
-
-      this.closeReopenReportToggle = new CloseReopenReportToggle({
-        dropdownTrigger,
-        dropdownList,
-        button,
-      });
-
-      this.closeReopenReportToggle.initDroplab();
-    };
-
     return MergeRequest;
   })();
 }).call(window);
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index c9986441406..dc4ed42544f 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -308,6 +308,7 @@
 
   li {
     padding: $gl-btn-padding $gl-btn-padding 2px;
+    cursor: pointer;
 
     > a,
     > button {
diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index c848fd76298..8cc29e4614b 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -70,6 +70,7 @@
 
   .input-token {
     max-width: 200px;
+    padding: 0;
 
     &:hover,
     &:focus {
@@ -83,7 +84,6 @@
     flex: 1;
     -webkit-flex: 1;
     max-width: inherit;
-    padding: 0;
   }
 }
 
@@ -165,6 +165,12 @@
 
 .droplab-dropdown li.filtered-search-token {
   padding: 0;
+  
+  &:hover,
+  &:focus {
+    background-color: inherit;
+    color: inherit;
+  }
 }
 
 .filtered-search-term {
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 2f35fb94a3d..56a4b53ed61 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -805,8 +805,22 @@
   @include transition(border-color, color);
 }
 
-.issuable-close-dropdown .dropdown-menu {
-  min-width: 270px;
-  left: auto;
-  right: 0;
+.issuable-close-dropdown {
+  .dropdown-menu {
+    min-width: 270px;
+    left: auto;
+    right: 0;
+  }
+
+  .description {
+    margin-bottom: 10px;
+
+    .text {
+      margin: 0;
+    }
+  }
+
+  .dropdown-toggle > .icon {
+    margin: 0 3px;
+  }
 }
-- 
cgit v1.2.1


From f28cd19dde32ab62cc3543d3579fc416d5976aed Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Fri, 7 Jul 2017 16:04:43 +0100
Subject: Fix MR and issue specs

---
 app/assets/javascripts/helpers/issuables_helper.js | 8 +++++++-
 app/assets/javascripts/issue.js                    | 8 ++++----
 app/assets/javascripts/merge_request.js            | 4 ++--
 3 files changed, 13 insertions(+), 7 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/helpers/issuables_helper.js b/app/assets/javascripts/helpers/issuables_helper.js
index 68fd8c74bea..52d0f7e43fc 100644
--- a/app/assets/javascripts/helpers/issuables_helper.js
+++ b/app/assets/javascripts/helpers/issuables_helper.js
@@ -1,6 +1,6 @@
 import CloseReopenReportToggle from '../close_reopen_report_toggle';
 
-export default function initCloseReopenReport() {
+function initCloseReopenReport() {
   const container = document.querySelector('.js-issuable-close-dropdown');
 
   if (!container) return undefined;
@@ -19,3 +19,9 @@ export default function initCloseReopenReport() {
 
   return closeReopenReportToggle;
 }
+
+const IssuablesHelper = {
+  initCloseReopenReport,
+};
+
+export default IssuablesHelper;
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 912da6ed6c1..f5e97e6e384 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -6,7 +6,7 @@ import '~/lib/utils/text_utility';
 import './flash';
 import './task_list';
 import CreateMergeRequestDropdown from './create_merge_request_dropdown';
-import initCloseReopenReport from './helpers/issuables_helper';
+import IssuablesHelper from './helpers/issuables_helper';
 
 class Issue {
   constructor() {
@@ -98,10 +98,10 @@ class Issue {
   }
 
   initCloseReopenReport() {
-    this.closeReopenReportToggle = initCloseReopenReport();
+    this.closeReopenReportToggle = IssuablesHelper.initCloseReopenReport();
 
-    this.closeButtons = this.closeButtons.not('.issuable-close-button');
-    this.reopenButtons = this.reopenButtons.not('.issuable-close-button');
+    if (this.closeButtons) this.closeButtons = this.closeButtons.not('.issuable-close-button');
+    if (this.reopenButtons) this.reopenButtons = this.reopenButtons.not('.issuable-close-button');
   }
 
   disableCloseReopenButton($button, shouldDisable) {
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index 938c7446a06..8594dc226ec 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -4,7 +4,7 @@
 import 'vendor/jquery.waitforimages';
 import './task_list';
 import './merge_request_tabs';
-import initCloseReopenReport from './helpers/issuables_helper';
+import IssuablesHelper from './helpers/issuables_helper';
 
 (function() {
   this.MergeRequest = (function() {
@@ -26,7 +26,7 @@ import initCloseReopenReport from './helpers/issuables_helper';
       this.initTabs();
       this.initMRBtnListeners();
       this.initCommitMessageListeners();
-      this.closeReopenReportToggle = initCloseReopenReport();
+      this.closeReopenReportToggle = IssuablesHelper.initCloseReopenReport();
 
       if ($("a.btn-close").length) {
         this.taskList = new gl.TaskList({
-- 
cgit v1.2.1


From 63fc393566e284c0b981221a09c717f75f35a0d2 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Fri, 7 Jul 2017 17:02:55 +0100
Subject: Fix filters.scss trailing spaces

---
 app/assets/stylesheets/framework/filters.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'app/assets')

diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index 8cc29e4614b..f05348ee4e3 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -165,7 +165,7 @@
 
 .droplab-dropdown li.filtered-search-token {
   padding: 0;
-  
+
   &:hover,
   &:focus {
     background-color: inherit;
-- 
cgit v1.2.1