parse-community / parse-dashboard

A dashboard for managing Parse Server
https://parseplatform.org
Other
3.73k stars 1.38k forks source link

Improve filer dialog auto-complete usability #2478

Open mtrezza opened 1 year ago

mtrezza commented 1 year ago

New Feature / Enhancement Checklist

Current Limitation

https://github.com/parse-community/parse-dashboard/pull/2463 introduced auto-complete in the filter dialog. However, it's usability should be improved. When opening the filter dialog, a key is pre-selected and needs to be manually deleted for the whole key list to become visible. This can be more time consuming than before the auto-complete feature was added.

Feature / Enhancement Description

Behavior when opening empty filter dialog (without any filter set), and when clicking on the "Add" button to add a new filter condition:

parse-github-assistant[bot] commented 1 year ago

Thanks for opening this issue!

mtrezza commented 1 year ago

cc @patelmilanun

patelmilanun commented 1 year ago

I intentionally added the default key for autocomplete. If we do not do it than we need to put some validation. The component itself doesn't have the validation so it need to be added externally.

Do you still want to go ahead with this? I mean if u click on the field the whole text will get selected anyway. It's just 1 keystroke more than the older version.

mtrezza commented 1 year ago

I'd expect by default seeing an empty text field with the whole list showing.

The pre-selection of the key is really arbitrary and chances are that in most cases its not the text field someone is looking for. Could you disable the 'apply' and 'save' buttons unless every field has a valid key selected? If that's too difficult, I would just clear the text field as soon as someone clicks into it.

I think the issue is that the dashboard is currently not very keyboard friendly. There's a lot of mouse action and that is always slower than keyword shortcuts. I would imagine at some point we get to the following scenario:

  1. Hit key F -> filter dialog opens; text field has focus automatically.
  2. Enter em -> fields email and email2 shows in list.
  3. Hit arrow down key -> field email is selected.
  4. Hit Enter key -> search filter is applied (like clicking the "Apply" button)

In order to get to that, it would be good if when you open the filter dialog, the text field gets focused and is empty, with the whole field list showing.

mtrezza commented 2 months ago

@Bhavyajain21 this may be interesting for you