dekkerglen / CubeCobra

An open source web application for building, managing, and playtesting Magic the Gathering cubes.
https://www.cubecobra.com
Apache License 2.0
193 stars 120 forks source link

Enable Enter/Return key to apply current Filter [Fixes #2421] #2440

Closed Qashworth closed 10 months ago

Qashworth commented 10 months ago

Description

This PR wraps the button in a form to handle Enter / 'Return' keypress events within the .component instead of requiring users specifically click the 'Apply' Button discussed in #2421

Background

Currently users need to explicitly press the 'Apply' button to submit filtered searches. This is an attempt to handle Enter/Return Key presses within the Filtercollapse.js component instead of requiring users specifically click the 'Apply' Button. I've wrapped the InputGroup in a Form, removed the 'Apply' button's onClick event, added the "submit" type to the 'Apply' button, and added a function to handle when the onSubmit event is fired.

This should allow the 'Apply' button to maintain it's ability to be clicked as well as fire when the Enter/Return Key is pressed.

How to test

Additional Notes:

My first PR here (of hopefully many more) please be gentle! 😂

Qashworth commented 10 months ago

Thanks @lunakv, I'll be sure to format future PR's accordingly!

I did just notice that I failed to add the Form component to the other imported components for FilterCollapse.js in this PR, which breaks List view entirely: Screenshot 2024-01-24 223039 Screenshot 2024-01-24 223035

What would be the best way to go about including that component? Reverting this PR, opening a new one, some other third thing?