query-builder: typeahead for filter and post-filter - #1381
Conversation
🦋 Changeset detectedLatest commit: 41c834b The changes in this PR will be included in the next version bump. This PR includes changesets to release 21 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
MauricioUyaguari
changed the title
43a0239 to
e1d939c
Compare
ba4f34e to
c69b6ef
Compare
Codecov Report
@@ Coverage Diff @@
## master #1381 +/- ##
==========================================
+ Coverage 41.89% 42.10% +0.21%
==========================================
Files 1176 1179 +3
Lines 52484 52643 +159
Branches 11922 11966 +44
==========================================
+ Hits 21987 22167 +180
+ Misses 30422 30400 -22
- Partials 75 76 +1
|
akphi
changed the title
akphi
left a comment
akphi
left a comment
There was a problem hiding this comment.
Quite an elegant solution! Besides most of the suggested refactor, I think typeahead should be treated as one word.
| noOptionsMessage={noOptionsMessage} | ||
| /> | ||
| ) : ( | ||
| <input |
There was a problem hiding this comment.
In terms of styling, from the video, I notice the discrepancy in height of the custom selector component and the height of its container causes a jump when users input, let's fix that.
Also, I think we should consider whether we should show the caret down here as it suggests auto-complete is available as people type and it's sort of distracting. What we want to do here is just let people have the feeling like they are typing some text value per usual, and happen to have these suggestions popping up.
cad7f0e to
6ace4d2
Compare
2013830 to
b1f2bea
Compare
72e00f4 to
cde8767
Compare
cde8767 to
9553c5e
Compare
9553c5e to
0ebd8cc
Compare
d152784 to
41c834b
Compare
akphi
left a comment
akphi
left a comment
There was a problem hiding this comment.
Nice stuff! I left some comments, let's address them after merging.
| className?: string | undefined; | ||
| setValueSpecification: (val: ValueSpecification) => void; | ||
| resetValue: () => void; | ||
| selectorConfig?: |
There was a problem hiding this comment.
I'm not entirely convinced of this approach, I think what we should do is just let people pass in a function to return Promise<string[]> and we keep all the other states (loading, results) as part of this component or so.
| node.condition.operator.getDefaultFilterConditionValue(node.condition), | ||
| ); | ||
| }; | ||
| const debouncedTypeaheadSearch = useMemo( |
There was a problem hiding this comment.
I want to simplify the API of BasicValueSpecification further here. Also, I just thought of a case I don't know if we need to handle, that is what happens if we do typeahead search and the returns are booleans or numbers?
There was a problem hiding this comment.
we can further enhance that for numbers.
Maybe not yet for booleans.
2 participants
Summary
Fixes #1382
typeAhead.mp4