so I’m building app for booking bikes. I had a challenge of showing available “bike_sizes” when user searches available “bike categories” and “sizes” by date.
As I could not get correct “search” due to basic search queries in bubble and really bad advanced filters I finally made it by showing all options and hiding those that are not available at the moment with “Conditions”. So when user search for bike sizes she sees all bike sizes but those that are not available are just disabled (you cannot click on it and there is information that we do not have those at the moment).
However problem is that it takes some time to load and I need solution to show one loading spinner while all conditions are firing so user see final result. Options I’ve tried:
Use loading condition → that does not work The repeating group with bike size just loads and only then all conditions are firing.
I’ve tried to use loader for each thing in a list. That’s actually a working solution however it is not UX friendly.
Hey, as an alternative, you could consider removing the bikes that have already been booked by using a separate list. I’ll explain my working below:
Create a popup on the page. This popup will never be visible to users
On the popup, add a repeating group and search for all of the bikes that are not available. This could be all of the bikes that are already booked on a similar date to the date in which a user is searching for.
On you main repeating group, use the ‘minus list’ after your data source, then select to minus the list of bikes within the second repeating group inside of your popup. This will remove all of the already booked bikes from your main list.
That’s nice solution but this won’t allow me to achieve the goal.
Moreover I find more places in app where data just take few second to load and you actually see the process of page rendering or element rendering (like some data in repeating group).
I’m searching for solution when I can hide all those rendering behind loader so the user won’t face problems. Another example is when you search or filter. I want to show how many particular items are remaining. It takes few seconds to load and moreover It does not load at one moment but sequential so user sees how particular data elements are changing.
I want to hide it behind loader however as I see “load” event works either for page or “repeating group” and the fact that repeating group has loaded does not mean that all other data has loaded. The only solution I see is hardcode loader for fixed time (like 3-5 seconds) instead of tying it to rendering.
The repeating group with bike size just loads and only then all conditions are firing.