1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
|
import React from 'dom-chef';
import {$, $$} from 'select-dom';
import delegate, {DelegateEvent} from 'delegate-it';
import * as pageDetect from 'github-url-detection';
import features from '../feature-manager.js';
const formSelector = [
'form[action$="/minimize-comment"]',
'form[action$="/minimize"]', // Review thread comments
];
function generateSubmenu(hideButton: Element): void {
if (hideButton.closest('.rgh-quick-comment-hiding-details')) {
// Already generated
return;
}
const detailsElement = hideButton.closest('details')!;
detailsElement.classList.add('rgh-quick-comment-hiding-details');
const comment = hideButton.closest('.unminimized-comment')!;
const hideCommentForm: HTMLFormElement = $(formSelector, comment)!;
// Generate dropdown
const newForm = hideCommentForm.cloneNode();
const fields = [...hideCommentForm.elements].map(field => field.cloneNode());
newForm.append(<i hidden>{fields}</i>); // Add existing fields (comment ID, token)
newForm.setAttribute('novalidate', 'true'); // Ignore the form's required attributes
// Imitate existing menu, reset classes
newForm.className = ['dropdown-menu', 'dropdown-menu-sw', 'color-fg-default', 'show-more-popover', 'anim-scale-in'].join(' ');
for (const reason of $$('option:not([value=""])', hideCommentForm.elements.classifier)) {
newForm.append(
<button
type="submit"
name="classifier"
value={reason.value}
className="dropdown-item btn-link"
role="menuitem"
>
{reason.textContent}
</button>,
);
}
// Close immediately after the clicking option
newForm.addEventListener('click', () => {
detailsElement.open = false;
});
detailsElement.append(newForm);
}
// Shows menu on top of mainDropdownContent when "Hide" is clicked;
// Hide it when dropdown closes.
// Uses `v-hidden` to avoid conflicts with `close-out-of-view-modals`
function toggleSubMenu(hideButton: Element, show: boolean): void {
const dropdown = hideButton.closest('details')!;
// Native dropdown
$('details-menu', dropdown)!.classList.toggle('v-hidden', show);
// "Hide comment" dropdown
$(formSelector, dropdown)!.classList.toggle('v-hidden', !show);
}
function resetDropdowns(event: DelegateEvent): void {
toggleSubMenu(event.delegateTarget, false);
}
function showSubmenu(event: DelegateEvent): void {
generateSubmenu(event.delegateTarget);
toggleSubMenu(event.delegateTarget, true);
event.stopImmediatePropagation();
event.preventDefault();
}
function init(signal: AbortSignal): void {
// `capture: true` required to be fired before GitHub's handlers
delegate('.js-comment-hide-button', 'click', showSubmenu, {capture: true, signal});
delegate('.rgh-quick-comment-hiding-details', 'toggle', resetDropdowns, {capture: true, signal});
}
void features.add(import.meta.url, {
include: [
pageDetect.hasComments,
],
init,
});
/*
Test URLs
https://github.com/refined-github/sandbox/pull/47
*/
|
