Add context menu to quickly filter bundles (resolves #241) #246
Conversation
|
|
| <li className={itemClassName} onClick={this.handleClickHideChunk}>Hide chunk</li> | ||
| <li className={itemClassName} onClick={this.handleClickFilterToParents}>Show parent chunks</li> | ||
| <li className={itemClassName} onClick={this.handleClickFilterToChunk}>Hide all other chunks</li> | ||
| <hr/> |
There was a problem hiding this comment.
I might have made the laziest possible interpretation of @th0r's request in #241 (comment) to add group separators here.
I could see either abstracting out the ContextMenu component so it can be passed a declarative config of options/option groups OR swapping out in favor of an existing open-source context menu, as there might be one that already has good UX thought put into it and that supports hierarchical menu options/nested menus.
There was a problem hiding this comment.
I could see either abstracting out the ContextMenu component so it can be passed a declarative config of options/option groups
No-no-no, let's keep it like that - it's absolutely fine!
What about adding a capture-phase click event handler on document and preventing its propagation? open() {
// ...
document.addEventListener('click', event => {
if (elementIsOutside(event.currentTarget, this.containerElem) {
event.preventDefault();
event.stopPropagation();
this.close();
}
}, true);
}
function elementIsOutside(elem, container) {
return !(elem === container || container.contains(elem));
} |
|
@th0r that did it, thanks -- just pushed that fix up! (But without the |
TODOs: - refactor out shared functionality with Tooltip - styling - test coverage
bregenspan
force-pushed
the
add-context-menu
branch
from
849e211
to
65c8c03
Compare
|
Hi there @bregenspan, sorry that you've had to wait for so long with this PR. I took this PR for a spin now and it feels to be working nicely. However, I found myself quite confused on the terminology, and I'm worried that people not so knowledgeable in webpack will have an even harder time to figure out what "parent chunk" means. At the very least, we would need to document what "parent chunk" means in the readme. How would you describe this to a newcomer? |
bregenspan
force-pushed
the
add-context-menu
branch
from
7734c42
to
2b53d43
Compare
|
@th0r I just looked a bit more into whether to add Opening context menus via a secondary click triggered by Ctrl feels a bit like a forced fit on Windows, but I think Windows users are more likely to use an actual hardware right click, or are used to the special behavior or Menu key immediately opening an app-specific context menu (which I didn't see working great for this context-specific, not app-wide, case). Besides that question, I think this might be ready now - all feedback should be addressed, let me know if anything missing. Thanks again @th0r and @valscion for all your time reviewing this! |
Ok, lets not do it. |
|
Awesome! Thanks a lot! |
|
Released in v3.3.0 |
As discussed in #241, adding a context menu that exposes options for each chunk can allow for an easier way to trigger certain operations, such as filtering to show only a single chunk, filtering to show all chunks, filtering down to parents of a chunk, or hiding a particular chunk.
This is a first stab at adding such a right-click/Ctrl-click triggered context menu for chunk options, with these options to start with:
Show parent chunks(removed for now, see comments)One possible limitation of the current approach is that I went for a bespoke context menu based partly on the existing Tooltip component. To add features like a multi-level hierarchy in the context menu in future or more dynamic/context-specific options, it might make more sense to replace with an existing full-featured open-source component.
TODOs:
event.metaKeyin addition toevent.ctrlKey?Possible future cleanup: