Fix excluding more than two labels on issues list (#14962)

* Fix excluding more than two labels on issues list

Fix #14840

Signed-off-by: Andrew Thornton <art27@cantab.net>

* refactor DRY

* fix multiple-label filter on milestone issuelist

* Apply suggestions from code review

Co-authored-by: jaqra <48099350+jaqra@users.noreply.github.com>

* Update web_src/js/index.js

Co-authored-by: Norwin Roosen <git@nroo.de>
Co-authored-by: jaqra <48099350+jaqra@users.noreply.github.com>

templates/repo/issue/milestone_issues.tmpl

@@ -54,7 +54,7 @@
 							<span class="info">{{.i18n.Tr "repo.issues.filter_label_exclude" | Safe}}</span>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_label_no_select"}}</a>
 							{{range .Labels}}
-								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.ID}}&assignee={{$.AssigneeID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}</a>
+								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&assignee={{$.AssigneeID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}</a>
 							{{end}}
 						</div>
 					</div>

web_src/js/index.js

@@ -3753,36 +3753,30 @@ function initIssueList() {
       fullTextSearch: true
     });
 
-  $('.menu a.label-filter-item').each(function () {
+  function excludeLabel (item) {
-    $(this).on('click', function (e) {
+    const href = $(item).attr('href');
-      if (e.altKey) {
+    const id = $(item).data('label-id');
-        e.preventDefault();
-
-        const href = $(this).attr('href');
-        const id = $(this).data('label-id');
 
-        const regStr = `labels=(-?[0-9]+%2c)*(${id})(%2c-?[0-9]+)*&`;
+    const regStr = `labels=((?:-?[0-9]+%2c)*)(${id})((?:%2c-?[0-9]+)*)&`;
     const newStr = 'labels=$1-$2$3&';
 
     window.location = href.replace(new RegExp(regStr), newStr);
   }
+
+  $('.menu a.label-filter-item').each(function () {
+    $(this).on('click', function (e) {
+      if (e.altKey) {
+        e.preventDefault();
+        excludeLabel(this);
+      }
     });
   });
 
   $('.menu .ui.dropdown.label-filter').on('keydown', (e) => {
     if (e.altKey && e.keyCode === 13) {
       const selectedItems = $('.menu .ui.dropdown.label-filter .menu .item.selected');
-
       if (selectedItems.length > 0) {
-        const item = $(selectedItems[0]);
+        excludeLabel($(selectedItems[0]));
-
-        const href = item.attr('href');
-        const id = item.data('label-id');
-
-        const regStr = `labels=(-?[0-9]+%2c)*(${id})(%2c-?[0-9]+)*&`;
-        const newStr = 'labels=$1-$2$3&';
-
-        window.location = href.replace(new RegExp(regStr), newStr);
       }
     }
   });