diff --git a/templates/repo/issue/list.tmpl b/templates/repo/issue/list.tmpl
index 04f7dcd6ae..2a53239f1c 100644
--- a/templates/repo/issue/list.tmpl
+++ b/templates/repo/issue/list.tmpl
@@ -28,6 +28,12 @@
+ {{if $.CanWriteIssuesOrPulls}}
+
+
+
+
+ {{end}}
{{template "repo/issue/openclose" .}}
diff --git a/web_src/js/features/common-issue.js b/web_src/js/features/common-issue.js
index e894816fb6..4a62089c60 100644
--- a/web_src/js/features/common-issue.js
+++ b/web_src/js/features/common-issue.js
@@ -2,15 +2,34 @@ import $ from 'jquery';
import {updateIssuesMeta} from './repo-issue.js';
export function initCommonIssue() {
- $('.issue-checkbox').on('click', () => {
- const numChecked = $('.issue-checkbox').children('input:checked').length;
- if (numChecked > 0) {
- $('#issue-filters').addClass('hide');
- $('#issue-actions').removeClass('hide');
+ const $issueSelectAllWrapper = $('.issue-checkbox-all');
+ const $issueSelectAll = $('.issue-checkbox-all input');
+ const $issueCheckboxes = $('.issue-checkbox input');
+
+ const syncIssueSelectionState = () => {
+ const $checked = $issueCheckboxes.filter(':checked');
+ const anyChecked = $checked.length !== 0;
+ const allChecked = anyChecked && $checked.length === $issueCheckboxes.length;
+
+ if (allChecked) {
+ $issueSelectAll.prop({'checked': true, 'indeterminate': false});
+ } else if (anyChecked) {
+ $issueSelectAll.prop({'checked': false, 'indeterminate': true});
} else {
- $('#issue-filters').removeClass('hide');
- $('#issue-actions').addClass('hide');
+ $issueSelectAll.prop({'checked': false, 'indeterminate': false});
}
+ // if any issue is selected, show the action panel, otherwise show the filter panel
+ $('#issue-filters').toggle(!anyChecked);
+ $('#issue-actions').toggle(anyChecked);
+ // there are two panels but only one select-all checkbox, so move the checkbox to the visible panel
+ $('#issue-filters, #issue-actions').filter(':visible').find('.column:first').prepend($issueSelectAllWrapper);
+ };
+
+ $issueCheckboxes.on('change', syncIssueSelectionState);
+
+ $issueSelectAll.on('change', () => {
+ $issueCheckboxes.prop('checked', $issueSelectAll.is(':checked'));
+ syncIssueSelectionState();
});
$('.issue-action').on('click', async function () {
@@ -41,7 +60,7 @@ export function initCommonIssue() {
});
// NOTICE: This event trigger targets Firefox caching behaviour, as the checkboxes stay
- // checked after reload trigger ckecked event, if checkboxes are checked on load
+ // checked after reload trigger checked event, if checkboxes are checked on load
$('.issue-checkbox input[type="checkbox"]:checked').first().each((_, e) => {
e.checked = false;
$(e).trigger('click');