Filtering realtime DB Firebase results

Hi folks. Still working on my little personal project, and have come across another bit of a hurdle that I’m having trouble working my way past.

Odds are it’s something reasonably simple that I’m missing/getting wrong, but I have not been able to work it out so far.

This is a simplified version of my DB structure, to help illustrate what I am after:

The goal is to present a listing of drink names, and to be able to filter the DB of drinks using a fuzzy search/filter from a text box. As the user starts typing, once they’ve typed > 2 chars, it starts to filter down the results, based on ANY field in the records, not just the name.

So using the above demo data, this is how the screen initially loads:


I want to be able to type “vod” (and now that I just typed that, it’s become obvious that I also need to see about doing something about case-sensitivity - not too sure how i’ll tackle that in the current context… as I am comparing a list to some text. The text is easy enough to handle… but how do I handle the list it’s comparing it with?), and for the list to filter down to just the Espresso, as that’s the only record that has that text in the record.

This is what I have so far (I have since changed the “null” to “empty list” after that screenshot was taken). The initial sections work fine, populate the list with the names of drinks in my DB. But as soon as the filter section kicks in (ie. I type 3 or more chars in the filter box), the entire preview screen disappears, and I have to go back to the editing screen.

I’ve been having a fair look around, and based most of the above on Muneers very helpful reply on this topic:

https://community.thunkable.com/t/solved-how-do-i-display-data-from-the-realtime-database-as-a-list-in-my-app/1821443/4