...
We will turn the offer search editable, allowing the user to type the offer name.
It cannot take much time to show the offer searched.
We have to warn the user when the offer does not exist in the list.
It needs to search in the list for every offer that contains at least three characters of the name in any part of it (beginning, middle, ending) according to what was typed.
It should consider every character typed as lowercase to search in the list.
Space won’t count as a character too.
It should always show Sanity offer in an increasing alphabetical order.
It should have a temporary feature flag to ensure everything is working fine, such as
enable-search-assigned-offers
.
✅ Proposed Solution
Solution #1
The first solution is allowing the offer name to be editable using a different component (AutoComplete) and when . When the Sanity offer is searched, it will look for the offer by comparing the name with what was typed.
...
This solution allows the offer name to be still editable using a TextBox and when . When the offer is searched, it will look for the Sanity offer by comparing the name with what was typed, in another component (Select) or a List that would render according to the list of offer offers available.
Cons:
Creation The creation of more dependencies between componentcomponents
Use at least two components to do the same search instead of a specific one that does all the work
...
Test Scenario | Result | Screenshots |
---|---|---|
Show the entire offers list |
| |
Show only offers with a specific character or words typed |
| |
Show a warning error for absent offer in the list |
|