Merge pull request #14 from EpocDotFr/unresolved-discussions-indicator

Unresolved discussions indicator

Author: EpocDotFr

README.md

@@ -23,6 +23,9 @@ A browser extension that enhance all Merge Requests lists on any instance of Git
     - Base Jira URL is configured in extension preferences
     - The ticket ID or an icon can be displayed as the link label (configured in extension preferences)
   - WIP toggle button (can be enabled/disabled in the extension preferences)
+  - Show an indicator when there's unresolved discussions left on Merge Requests
+    - Can be enabled/disabled in the extension preferences
+    - Note the **All discussions must be resolved** option must be enabled for this feature to be working as expected. This option is enabled per project and is located in **Settings > General > Merge Requests > Merge checks**
   - Compatible with all GitLab editions (GitLab CE, GitLab EE, GitLab.com) (look at the prerequisites, though)
 
 ## Prerequisites

css/options.css

@@ -85,12 +85,12 @@ body.is-chrome {
  * Layout styles */
 
 .row {
-    display: table;
-    width: 100%;
+    display: flex;
+    flex-direction: row;
 }
 
-.row > * {
-    display: table-cell;
+.row > .fluid {
+    flex-grow: 1;
 }
 
 /************************************************************************

html/options.html

@@ -10,7 +10,7 @@
             <div class="w40p txt-center browser-style">
                 <input type="checkbox" id="display_source_and_target_branches">
             </div>
-            <div>
+            <div class="fluid">
                 <label for="display_source_and_target_branches">Display source and target branches</label>
             </div>
         </div>
@@ -21,7 +21,7 @@
             <div class="w40p txt-center browser-style">
                 <input type="checkbox" id="enable_button_to_copy_mr_info">
             </div>
-            <div>
+            <div class="fluid">
                 <label for="enable_button_to_copy_mr_info">Enable button allowing to copy Merge Request information</label>
             </div>
         </div>
@@ -37,7 +37,7 @@
             <div class="w40p txt-center browser-style">
                 <input type="checkbox" id="enable_jira_ticket_link">
             </div>
-            <div>
+            <div class="fluid">
                 <label for="enable_jira_ticket_link">Enable Jira ticket link</label>
             </div>
         </div>
@@ -55,13 +55,24 @@
             <div class="w40p txt-center browser-style">
                 <input type="checkbox" id="enable_button_to_toggle_wip_status">
             </div>
-            <div>
+            <div class="fluid">
                 <label for="enable_button_to_toggle_wip_status">Enable button allowing to toggle WIP status</label>
             </div>
         </div>
         <div class="pbs pll">
             <small class="txt-muted">This feature is automatically disabled if logged-out</small>
         </div>
+        <div class="pts row">
+            <div class="w40p txt-center browser-style">
+                <input type="checkbox" id="enable_unresolved_discussions_indicator">
+            </div>
+            <div class="fluid">
+                <label for="enable_unresolved_discussions_indicator">Show an indicator when there's unresolved discussion(s) left</label>
+            </div>
+        </div>
+        <div class="pbs pll">
+            <small class="txt-muted">Note the <strong>All discussions must be resolved</strong> option must be enabled for this feature to be working as expected. This option is enabled per project and is located in <strong>Settings > General > Merge Requests > Merge checks</strong>.</small>
+        </div>
         <div class="txt-center pts pbs"><button type="submit" class="browser-style">Save preferences</button></div>
     </form>
 

js/content.js

@@ -416,6 +416,18 @@
                         newInfoLineToInject
                     );
                 }
+
+                // -----------------------------------------------
+                // Unresolved discussions indicator
+
+                if (this.preferences.enable_unresolved_discussions_indicator && !mergeRequest.blocking_discussions_resolved) {
+                    let unresolvedDiscussionsIndicatorToInject = '<li><span class="has-tooltip" title="Unresolved discussion(s) left">' + this.buildSpriteIcon('comment-dots', 'danger-title') + '</span></li>';
+
+                    this.parseHtmlAndPrepend(
+                        mergeRequestNode.querySelector('.issuable-meta .controls'),
+                        unresolvedDiscussionsIndicatorToInject
+                    );
+                }
             }, this);
         }
 
@@ -597,8 +609,8 @@
         /**
          * Generate the HTML code corresponding to an SVG icon.
          */
-        buildSpriteIcon(iconName) {
-            return '<svg class="s16" data-testid="' + iconName + '-icon">' +
+        buildSpriteIcon(iconName, classes = '') {
+            return '<svg class="s16 ' + classes + '" data-testid="' + iconName + '-icon">' +
                 '<use xlink:href="' + this.baseIconsUrl + '#' + iconName + '"></use>' +
             '</svg>';
         }

js/options.js

@@ -37,6 +37,8 @@
             this.jiraTicketLinkLabelTypeRadioButtons = Array.from(document.querySelectorAll('input[name="jira_ticket_link_label_type"]'));
 
             this.enableButtonToToggleWipStatusCheckbox = document.querySelector('input#enable_button_to_toggle_wip_status');
+
+            this.enableUnresolvedDiscussionsIndicatorCheckbox = document.querySelector('input#enable_unresolved_discussions_indicator');
         }
 
         /**
@@ -67,6 +69,9 @@
 
                 self.enableButtonToToggleWipStatusCheckbox.checked = preferences.enable_button_to_toggle_wip_status;
                 self.enableButtonToToggleWipStatusCheckbox.dispatchEvent(new CustomEvent('change'));
+
+                self.enableUnresolvedDiscussionsIndicatorCheckbox.checked = preferences.enable_unresolved_discussions_indicator;
+                self.enableUnresolvedDiscussionsIndicatorCheckbox.dispatchEvent(new CustomEvent('change'));
             });
         }
 
@@ -117,6 +122,10 @@
             this.enableButtonToToggleWipStatusCheckbox.addEventListener('change', function() {
                 self.forceUserToEnableAtLeastOneFeatureIfNecessarily();
             });
+
+            this.enableUnresolvedDiscussionsIndicatorCheckbox.addEventListener('change', function() {
+                self.forceUserToEnableAtLeastOneFeatureIfNecessarily();
+            });
         }
 
         /**
@@ -138,7 +147,8 @@
                     enable_jira_ticket_link: this.enableJiraTicketLinkCheckbox.checked,
                     base_jira_url: this.baseJiraUrlInput.value,
                     jira_ticket_link_label_type: jira_ticket_link_label_type,
-                    enable_button_to_toggle_wip_status: this.enableButtonToToggleWipStatusCheckbox.checked
+                    enable_button_to_toggle_wip_status: this.enableButtonToToggleWipStatusCheckbox.checked,
+                    enable_unresolved_discussions_indicator: this.enableUnresolvedDiscussionsIndicatorCheckbox.checked
                 },
                 function() {
                     self.setSuccessfulVisualFeedbackOnSubmitButton();
@@ -173,7 +183,8 @@
             return !this.displaySourceAndTargetBranchesCheckbox.checked
                 && !this.enableButtonToCopyMrInfoCheckbox.checked
                 && !this.enableJiraTicketLinkCheckbox.checked
-                && !this.enableButtonToToggleWipStatusCheckbox.checked;
+                && !this.enableButtonToToggleWipStatusCheckbox.checked
+                && !this.enableUnresolvedDiscussionsIndicatorCheckbox.checked;
         }
 
         /**

js/preferences.js

@@ -13,7 +13,8 @@
                 enable_jira_ticket_link: false,
                 base_jira_url: '',
                 jira_ticket_link_label_type: 'ticket_id',
-                enable_button_to_toggle_wip_status: true
+                enable_button_to_toggle_wip_status: true,
+                enable_unresolved_discussions_indicator: true
             };
         }
 

screenshot.png

@@ -1,7 +1,7 @@
 MANIFEST_FILE = {
     'manifest_version': 2,
     'name': 'GitLab Merge Requests lists enhancer',
-    'version': '1.5.1',
+    'version': '1.6.0',
     'description': 'An extension that enhance all Merge Requests lists on any instance of Gitlab and GitLab.com.',
     'homepage_url': 'https://github.com/EpocDotFr/gitlab-merge-requests-lists-enhancer',
     'author': 'Maxime \'Epoc\' G.',