Akshay/previously searched

[akshaynthakur]

Summary

This PR adds persistent search history functionality, updates the logic of what tree cards to suggest as a search is being typed, and adds more user feedback during different stages of searching.

• Search history:
  • Stores up to 5 tree cards using Async Storage
  • Tree cards added to "Recents" either when pressed on or when search is entered (first card of submitted search will be added)
  • If most recent search is searched again, does not get added to history (avoids unnecessary repetition)
• Suggested search logic:
  • As search is typed, list of all tree cards is filtered to only those that contain the current search string
  • Tree cards in list are displayed in order depending on tree name or tree ID/location
    • If string entered is numerical: will order by tree ID/location, with values starting with the entered string first, and all other cards after (within each of the 2 groups, cards are ordered by ascending numerical value)
    • If string entered is non-numerical: will order by tree name, with values starting with the entered string first, and all other cards after (within each of the 2 groups, cards are ordered alphabetically)
• Search stages:
  • When search bar is empty: up to 5 "Recents" search cards displayed with most recent first (if no recent searches, component isn't rendered), followed by search cards of all trees
  • As search is typed: label changes from "Recents" or "All trees" to "Suggestions", suggested tree cards appear (if none suggested, labeled "Oops, that's an invalid search. Try again!")
  • When search is entered: label displays number of results

Test Plan

Go to the search screen, try different search values entries of searches/pressing on search cards:

• Are search cards ordered in an intuitive/meaningful way?
• Are recent searches stored and displayed properly?

Notes

Next Steps

Relevant Links

Online Sources

Related PRs

Screenshots and Tests

screen-20220413-172113_2.mp4

[nikkisuzani]

Great job! Just a few minor fixes but it looks good :)

[GuessingMan]

I noticed that if I click on a Tree Card and it is already in the "Recents stack", it will add a duplicate on top. Instead, can you change "Recents" so that 1 instance of the same tree card can ever appear at the same time, so that if i click on a tree card it is brough to the top of the list.

Also getting this console warning:

we should change the imports to the ones stated in the warning