diff options
author | 2021-09-04 23:28:50 +0530 | |
---|---|---|
committer | 2021-09-05 00:58:50 +0700 | |
commit | fed373fa491b2c7c2a7f2d9dece22e5b7b403fbd (patch) | |
tree | 90c8c08b56ddcfe227dbacb32027ea5f978d95e1 /source/features/quick-comment-hiding.tsx | |
parent | 5bccdd68c84b95b040fb1e3a3c2f1e2f5a3f1e60 (diff) | |
download | refined-github-fed373fa491b2c7c2a7f2d9dece22e5b7b403fbd.tar.gz refined-github-fed373fa491b2c7c2a7f2d9dece22e5b7b403fbd.tar.zst refined-github-fed373fa491b2c7c2a7f2d9dece22e5b7b403fbd.zip |
Meta: Rename fast/faster features to "quick" (#4745)
Co-authored-by: Federico Brigante <me@fregante.com>
Diffstat (limited to 'source/features/quick-comment-hiding.tsx')
-rw-r--r-- | source/features/quick-comment-hiding.tsx | 84 |
1 files changed, 84 insertions, 0 deletions
diff --git a/source/features/quick-comment-hiding.tsx b/source/features/quick-comment-hiding.tsx new file mode 100644 index 00000000..438be81f --- /dev/null +++ b/source/features/quick-comment-hiding.tsx @@ -0,0 +1,84 @@ +import React from 'dom-chef'; +import select from 'select-dom'; +import delegate from 'delegate-it'; +import * as pageDetect from 'github-url-detection'; + +import features from '.'; + +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 = select('.js-comment-minimize', comment)!; + + hideCommentForm.classList.remove('d-flex'); + + // Generate dropdown items + for (const reason of select.all('[name="classifier"] option:not([value=""])', comment)) { + hideCommentForm.append( + <button + type="submit" + name="classifier" + value={reason.value} + className="dropdown-item btn-link" + role="menuitem" + > + {reason.textContent} + </button>, + ); + } + + // Drop previous form controls + select('.btn', hideCommentForm)!.remove(); + select('[name="classifier"]', hideCommentForm)!.remove(); + + // Imitate existing menu + hideCommentForm.classList.add('dropdown-menu', 'dropdown-menu-sw', 'text-gray-dark', 'color-text-primary', 'show-more-popover', 'anim-scale-in'); + + detailsElement.append(hideCommentForm); +} + +// 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 + select('details-menu', dropdown)!.classList.toggle('v-hidden', show); + + // "Hide comment" dropdown + select('form.js-comment-minimize', dropdown)!.classList.toggle('v-hidden', !show); +} + +function resetDropdowns(event: delegate.Event): void { + toggleSubMenu(event.delegateTarget, false); +} + +function showSubmenu(event: delegate.Event): void { + generateSubmenu(event.delegateTarget); + toggleSubMenu(event.delegateTarget, true); + + event.stopImmediatePropagation(); + event.preventDefault(); +} + +function init(): void { + // `useCapture` required to be fired before GitHub's handlers + delegate(document, '.js-comment-hide-button', 'click', showSubmenu, true); + delegate(document, '.rgh-quick-comment-hiding-details', 'toggle', resetDropdowns, true); +} + +void features.add(__filebasename, { + include: [ + pageDetect.hasComments, + ], + deduplicate: 'has-rgh-inner', + init, +}); |