Paywalls: Add simple paywall and use in tester app #1223

tonidero · 2023-09-06T12:51:01Z

Description

This PR adds a simple paywall to the revenuecatui library and uses it to display the paywall in paywall tester. Still pretty barebones but it's a start :P

Screen_recording_20230906_145136.mp4

tonidero · 2023-09-06T12:53:12Z

...ter/src/main/java/com/revenuecat/paywallstester/ui/screens/paywall/PaywallScreenViewModel.kt

+    private val offeringId = savedStateHandle.get<String?>(PaywallScreenViewModel.OFFERING_ID_KEY)
+
+    init {
+        updateOffering()


We need to refetch the offering, since after navigating to this screen, we only have the offeringId.

We are also loading in the PaywallViewModel right? Do we need to do it in both places?

This is in the paywall tester app, the other is in the library itself. We could offer an API so users can pass an offering id, and not an offering... But that seems worse, since they might send other strings, so I would prefer not to if possible.

Got it! Passing an offering and getting the current if null makes sense!

tonidero · 2023-09-06T12:54:18Z

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/InternalPaywallView.kt

+import com.revenuecat.purchases.Offering
+
+@Composable
+internal fun InternalPaywallView(


Moved the UI to an "internal" view, so we can separate the actual UI from the API.

I have something similar since the public one will have to do loading and processing of the config. The internal one is simpler if it depends on the actual final requirements.

tonidero · 2023-09-06T12:55:22Z

...nuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/PaywallViewModelFactory.kt

+import androidx.lifecycle.ViewModelProvider
+import com.revenuecat.purchases.Offering
+
+class PaywallViewModelFactory(private val offering: Offering?) : ViewModelProvider.NewInstanceFactory() {


To pass parameters to the view model, a factory like this is required... One of the problems of architecture component's viewModel.

tonidero · 2023-09-06T12:56:04Z

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/PaywallViewModel.kt

+                Log.e("PaywallTester", "Error purchasing package: $error")
+            },
+            onSuccess = { purchase, _ ->
+                Log.i("PaywallTester", "Purchased package: $purchase")


We should at least display some sort of UI, but in this PR, I'm just logging. Will follow-up with some alerts in the next PR.

codecov · 2023-09-06T13:09:28Z

Codecov Report

❗ No coverage uploaded for pull request base (paywalls@208385a). Click here to learn what that means.
Patch has no changes to coverable lines.

❗ Current head cda6832 differs from pull request most recent head bba0dc1. Consider uploading reports for the commit bba0dc1 to get more accurate results

Additional details and impacted files

@@             Coverage Diff             @@
##             paywalls    #1223   +/-   ##
===========================================
  Coverage            ?   85.25%           
===========================================
  Files               ?      186           
  Lines               ?     6319           
  Branches            ?      911           
===========================================
  Hits                ?     5387           
  Misses              ?      586           
  Partials            ?      346

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

NachoSoto · 2023-09-06T14:07:56Z

examples/paywall-tester/build.gradle

@@ -54,6 +64,7 @@ dependencies {
    implementation project(path: ':purchases')
    implementation project(path: ':feature:amazon')
    implementation project(path: ':ui:debugview')


NachoSoto · 2023-09-06T14:08:20Z

...ywall-tester/src/main/java/com/revenuecat/paywallstester/ui/screens/paywall/PaywallScreen.kt

+                Text(text = "Error: ${state.errorMessage}")
+            }
+            is PaywallScreenState.Loaded -> {
+                PaywallView(PaywallViewOptions.Builder().setOffering(state.offering).build())


NachoSoto · 2023-09-06T14:08:29Z

...-tester/src/main/java/com/revenuecat/paywallstester/ui/screens/paywall/PaywallScreenState.kt

+
+import com.revenuecat.purchases.Offering
+
+sealed class PaywallScreenState {


Love it. I wonder if you'll need to move it to the UI framework to handle these 3 states there instead.

There is a state in the library as well, but that's internal. This is needed because we need to refetch the Offering since we only get the offering_id in this screen.

NachoSoto · 2023-09-06T14:10:06Z

...ter/src/main/java/com/revenuecat/paywallstester/ui/screens/paywall/PaywallScreenViewModel.kt

+    }
+
+    private fun updateOffering() {
+        Purchases.sharedInstance.getOfferingsWith(


Would it be possible to use the coroutines? 😅

Yup! I wasn't thinking about it but we totally could! Will do that in a followup PR

NachoSoto · 2023-09-06T14:11:55Z

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/InternalPaywallView.kt

+import com.revenuecat.purchases.Offering
+
+@Composable
+internal fun InternalPaywallView(


I have something similar since the public one will have to do loading and processing of the config. The internal one is simpler if it depends on the actual final requirements.

NachoSoto · 2023-09-06T14:12:32Z

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/InternalPaywallView.kt

+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+            .padding(16.dp),


I'm not perfect at this, but I'd recommend starting to extract some of these magic numbers.

Honestly, this is too early in the UI 😅, since this whole UI is probably going away. But yeah, we should extract these.

NachoSoto · 2023-09-06T14:14:32Z

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/PaywallViewModel.kt

+    }
+
+    override fun purchasePackage(activity: Activity, packageToPurchase: Package) {
+        Purchases.sharedInstance.purchaseWith(


Is it possible to use coroutines here too?
It will make it easier to update the internal state to avoid multiple concurrent purchases (to disable the buttons on the UI).
See PurchaseHandler.

Yup as mentioned above, will do that in a followup PR

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/PaywallViewModel.kt

### Description This PR adds a simple paywall to the revenuecatui library and uses it to display the paywall in paywall tester. Still pretty barebones but it's a start :P https://github.com/RevenueCat/purchases-android/assets/808417/b4a4b85c-68dc-4cc0-9019-2baefb50e2e3

tonidero added refactor A code change that neither fixes a bug nor adds a feature test Adding missing tests or correcting existing tests labels Sep 6, 2023

tonidero commented Sep 6, 2023

View reviewed changes

tonidero marked this pull request as ready for review September 6, 2023 12:56

tonidero requested a review from a team September 6, 2023 12:56

NachoSoto approved these changes Sep 6, 2023

View reviewed changes

tonidero added the RevenueCatUI label Sep 6, 2023

tonidero changed the title ~~Add simple paywall and use in tester app~~ Paywalls: Add simple paywall and use in tester app Sep 6, 2023

Base automatically changed from toniricodiez/pwl-221-create-paywall-tester-sample-app-2 to paywalls September 6, 2023 17:04

Add simple paywall and use in tester app

bba0dc1

tonidero force-pushed the toniricodiez/pwl-221-create-paywall-tester-sample-app-3 branch from cda6832 to bba0dc1 Compare September 6, 2023 17:04

vegaro reviewed Sep 6, 2023

View reviewed changes

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/PaywallViewModel.kt Show resolved Hide resolved

tonidero merged commit 0377b53 into paywalls Sep 6, 2023
3 of 5 checks passed

tonidero deleted the toniricodiez/pwl-221-create-paywall-tester-sample-app-3 branch September 6, 2023 17:12

vegaro approved these changes Sep 6, 2023

View reviewed changes

This was referenced Oct 16, 2023

[DO NOT MERGE] Release/7.1.0-beta.1 #1355

Closed

[DO NOT MERGE] Release/7.1.0-beta.2 #1373

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Paywalls: Add simple paywall and use in tester app #1223

Paywalls: Add simple paywall and use in tester app #1223

tonidero commented Sep 6, 2023 •

edited

Loading

tonidero Sep 6, 2023

vegaro Sep 6, 2023

tonidero Sep 6, 2023

vegaro Sep 6, 2023

tonidero Sep 6, 2023

NachoSoto Sep 6, 2023

tonidero Sep 6, 2023

tonidero Sep 6, 2023

codecov bot commented Sep 6, 2023 •

edited

Loading

NachoSoto Sep 6, 2023

NachoSoto Sep 6, 2023

NachoSoto Sep 6, 2023

tonidero Sep 6, 2023

NachoSoto Sep 6, 2023

tonidero Sep 6, 2023

NachoSoto Sep 6, 2023

NachoSoto Sep 6, 2023

tonidero Sep 6, 2023

NachoSoto Sep 6, 2023

tonidero Sep 6, 2023


		import com.revenuecat.purchases.Offering

		sealed class PaywallScreenState {

Paywalls: Add simple paywall and use in tester app #1223

Paywalls: Add simple paywall and use in tester app #1223

Conversation

tonidero commented Sep 6, 2023 • edited Loading

Description

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

codecov bot commented Sep 6, 2023 • edited Loading

Codecov Report

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

tonidero commented Sep 6, 2023 •

edited

Loading

codecov bot commented Sep 6, 2023 •

edited

Loading