Basically I’m building a ‘reaction’ app that lets users give a ‘Like’ to other users based on something they noted at work. But I wanted to make the ‘Like’ icon unclickable for 30 minutes after it was clicked and don’t know how to do it.
I’m fiddling with ‘current date/time’ conditions but not really making any progress.
when icon is clicked → store the current date & time:plus 30 minutes in a custom state. Let’s call this state nextReactionTime.
Store a yes/no in the user’s data type. Let’s call this allowedToReact . if the default is yes, switch it to no when the user clicks the icon. This is the toggle that allows them to click the reaction button again.
add a workflow, Do when condition is True and mark it as Every time.
The condition is: when current date/time > nextReactionTime
Add a workflow to toggle the user’s allowedToReact to yes.
The user should be able to click on the icon without reloading the page after these 30 minutes now.
You can test this by shortening the stored time to current date/time: plus 1 minute as the state in your test cases, so you don’t have to wait a full 30 min to go through each test. You can always use the debugger to track the current states on the page.
At scale, this will slow down your bubble app, and a custom JS implementation is probably more optimal.
Great explanation. If the user refreshes the browser, they will be able to click the icon again though. Save the value to the DB rather than a state if you wish to stop the user use refresh to bypass this limitation or if the same time frame applies to all users.
ah yes-- the custom state won’t work here 
thx for catching this !
This topic was automatically closed after 70 days. New replies are no longer allowed.
