Hey, I wanted to share my experience with “dynamic buttons” and Zapier on a working example of a Meeting Room Booking Application with you.
The result GIF (click to expand)
This is a workaround and I would love to do the same WITHOUT Zapier, but I think it shows some possibilites and a way, that buttons would make a lot of sense in Coda. I already discussed a similiar test with Coda team im private, but this is a way better use case.
IMPORTANT: Before you use this workaround, check out the “Known Issues” at the end of this post!
Let’s imagine we want to make a simple Booking Application with the power of Coda. What we want is to book a specific room for a specific day at a specific time. Also we want only to be able to book the room when the room is free at this time and day. And all that with just one Drop Down (Date Picker) and one Button Click (or even with only one Button if we want to book for today).
So how does it work?
The principle is:
Coda → Dynamic link that transports data to Zapier
→ Zap that creats a new row with the data in Coda
Step by step guide
First I created the Date Picker and the two Tables.
The setup (click to expand)
Than I created a new Zap with a and chose „Webhook“ as my trigger in Zapier, to fetch dynamic data with a hyperlink.
What is a webhook? (click to expand)
A webhook is basically just a URL. E.g. “http://webhk.com/1234/”. If you open it, it can fire an event at the service where you created it. Also, a webhook can be used to send data from service A to service B. To do that, we have to add so-called “GET-parameters” to the webhook. You have seen them in the adressbar of your browser “http://webhk.com/1234/?parameter1=value1¶meter2=value2”. With that in mind, we can send data from Coda to Zapier and fire our event. E.g. “http://webhk.com/1234/?date=3/8/2018&room=blue”
After that, I created a “dynamic hyperlink” to fill my webhook with data. “Dynamic” because I used the Hyperlink & the Format function to generate a link with variables in it.
=Hyperlink(Format("https://hooks.zapier.com/hooks/catch/_MYWEBHOOKID_/?date={1}&time={2}&room=red&owner={3}",chosendate,thisRow.Time,User()),"Book now")
So this formula is set in the “Blue Room” (with room=blue) and “Red Room” (with room=red) columns. It fills in the date of the data picker, the time of the row, the room name and the logged in user in the hyperlink. If you open the link, data will be transfered to Zapier and the Zap will be triggered.
How the data looks in Zapier (click to expand)
All that is left now is the Coda integration as an endpoint in zapier to post this data in my table.
Coda integration alpha (click to expand)
The integration part is now ready and working. But there ist still one thing to do! We don’t want people to book a room twice. So I just added a IF to the formula of the link:
if(count(Bookings.Filter(Date = chosendate && Time = thisRow.Time && Room = "red")) > 0, "❌",Hyperlink(Format("https://hooks.zapier.com/hooks/catch/1220017/k6i60i/?date={1}&time={2}&room=red&owner={3}",chosendate,thisRow.Time,User()),"Book now"))
This formula checks now, if there is an entry at the date, time and room and shows the red X as an indicator for “Not available at this time”. But it could also be something like “booked by USER”
That’s it
Known Issues
This example works perfect - except of one funny fact: You are not allowed to click the buttons! You have to mouseover them. Check out why:
Known issues (click to expand)
Issue 1: Coda has a very nice features: Preview of Hyperlinks. That means that when you mouse over on a Hyperlink, Coda shows you whats underneath. That is great for websites, but a big problem with our webhooks. Because they FIRE WHEN YOU MOUSEOVER! That means, when you click a button, you fire it at least twice. Took me a while and costed me all the free Zapier tasks you can execude in a month within just a few hours to figure out why
Issue 2: The insertion of “user” doesn’t really work for me. I get the username, but not the user with picture and link. But since it is an alpha state, this is now big deal.
Issue 3 As you can see in the result clip, it is slow. The webhook takes about a second to fire and put the data back in.
How could it be done in Coda without Zapier?
I think of an “Insert/update” function, that can be executet by buttons or links. It could work like filter, something like =table.insert(values, filter optional) or in our given case:
=Bookings.insert(Date = chosendate && Time = thisRow.Time && Room = "blue" && Owner = User())
I’m super curious about your thoughts and feedback on that