Skip to main content
← Data, API & Backend
Data, API & Backend October 28, 2022 · 6 replies

Conditional callbacks - using "premium locked content"

Archived from the Bravo community forum (2021–2026). Some answers may refer to older versions of Bravo.

Does anyone know how to "lock" certain list items as premium?

My goal
A list of items where half are clickable > and go to a detail page. The other half when clicked go to a premium locked page.**

**How it would work
**1. List view of all available content (some of the content is locked, some isn't)2. When clicking un-locked content > successfully go to _Detail page
_
 3. When clicking locked/premium content
     If non-premium user > go to error or sign-up page
     If premium user > successfully open detail page.

My guess:
My guess at the moment would be to use a conditional statement to check if the user is considered premium or now. But I'm not sure how to use "get-endpoints" on list items without using Figma prototype mode, it kinda breaks the get/page/{id} request that is working.

**Why the conditional tutorial doesn't work:**This tutorial shows all the locked content behind a specific paywall. My experience with premium apps converting well is if you show users a preview of the list content, and then when they click on it they see it's locked. This tutorial gates everything off with no previews.

For example, if half of these list items had a lock on them:

image.png

6 replies

Alex October 28, 2022

***And I'm trying to do this without using Bravos In-app purchases (on business account). The business accounts are just too expensive ($200+), so i'll probably just fake the checkout flow to validate if users would signup and then give it free.

Or I'll a stretch would be to try and take payment on my website with Outseta and side step AppStore/Bravo fees.

Jerzy October 29, 2022

Hi, so I have two ideas how to approach this.

  1. I would try to make three lists - first one with freemium items, maybe return only 2-4 records, second one with premium records, but locked by design. these two lists should be visible only to freemium user; third list without constraints, visible only to premium users (by conditional visibility)

  2. i tried to make sticky layer on top of your regular list. the layer blocks interaction with list, and can leave some space on top. essentially it is like paywall that gives you sneak peek of content on the top of page.
    this idea has two downsides. the list is still scrolabble so user have access to more elements. this probably can be solved by conditional visibility and serving freemium users short list - like 5 records); but secondly - i don't see option to apply conditional visibility to layer itself...

Fred October 29, 2022

Yeah I believe this is the limitation of conditional actions they only work for forms in PATCH or POST requests

Calda October 29, 2022

Hey, this can resolved with multiple solutions, but in any case, you can do ti without the in-app purchases. 

How we would approach this problem:

  • you create one list of items, where for each item it's specified whether it's a premium item or not
  • in that container, which would be bound to that list request, you create a hidden field with action:remote tag on it
  • that action remote is then bound to GET request which determines if an item is premium or not 
  • through conditional actions you navigate a user to the detail page (if an item is not premium) or a payment gateway page (if item is premium)
  • payment gateway can still be handled by Stripe (you just have to use their API to bind everything with your backend).

 

Let us know if we can help in any way.

Alex October 31, 2022

Oh awesome! That's a slick solution.

So just clarifying:

  1. The Conditional would be:
  • "If user is freemium (Xano boolen) > GOTO Paywall"
  • "If premium user" > get/page/{id}"
  • And then... because of this manual remote action, I would remove the prototype connection in the Figma art boards?
  1. Stripe subscription payments: I'm on stripe so would be excited to set that up! But I assumed this wasn't allowed given App Store's 15-30% cut?

Yeah I might have to hit you guys up for some help in the future after this 😎

Alex October 31, 2022

I like this solution too. Do you know if the list containers dynamically size themselves? So that the 2nd or 3rd lists don't have an awkward space above them?

Wrote something in this thread and want it removed? Request removal

Still stuck?

Ask the community on Discord

This archive is read-only. New questions, office hours and product updates now happen in the Bravo Discord.

Join the Discord