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
|
import React from 'dom-chef';
import select from 'select-dom';
import delegate, {DelegateEvent} from 'delegate-it';
import features from '../libs/features';
function handleMenuOpening(event: DelegateEvent): void {
const hideButton = select('.js-comment-hide-button', event.delegateTarget.parentElement!);
if (!hideButton) {
// User unable to hide or menu already created
return;
}
// Disable default behavior
hideButton.classList.remove('js-comment-hide-button');
const comment = hideButton.closest('.unminimized-comment')!;
const form = select('.js-comment-minimize', comment)!;
// Generate dropdown items
for (const reason of select.all<HTMLInputElement>('[name="classifier"] :not([value=""])', comment)) {
form.append(
<button
name="classifier"
value={reason.value}
className="dropdown-item btn-link"
role="menuitem">
{reason.textContent}
</button>
);
}
// Drop previous form controls
select('.btn', form)!.remove();
select('[name="classifier"]', form)!.remove();
// Imitate existing menu
form.classList.add('dropdown-menu', 'dropdown-menu-sw', 'text-gray-dark', 'show-more-popover', 'anim-scale-in');
// Show menu on top of optionList when "Hide" is clicked
// Hide it when dropdown closes.
// Uses `v-hidden` and `d-none` to avoid conflicts with `close-out-of-view-modals`
const dropdown = hideButton.closest('details')!;
const optionList = select('.show-more-popover', dropdown)!;
hideButton.addEventListener('click', event => {
event.stopImmediatePropagation();
event.preventDefault();
optionList.classList.add('v-hidden');
form.classList.remove('d-none');
});
dropdown.addEventListener('toggle', () => {
optionList.classList.remove('v-hidden');
form.classList.add('d-none');
});
dropdown.append(form);
}
function init(): void {
delegate('.timeline-comment-action', 'click', handleMenuOpening);
}
features.add({
id: __featureName__,
description: 'Simplifies the UI to hide comments.',
screenshot: 'https://user-images.githubusercontent.com/1402241/43039221-1ddc91f6-8d29-11e8-9ed4-93459191a510.gif',
include: [
features.hasComments
],
load: features.onAjaxedPages,
init
});
|