[EXTERNAL] Exposing fontprovider setter in `PaywallView` and `PaywallFooterView` by @Jjastiny #1589

tonidero · 2024-02-01T08:03:48Z

External contribution from #1588

Checklist

If applicable, create follow-up issues for purchases-ios and hybrids

Motivation

It's not possible for us to change the font family in react-native-purchase.
My hope was to expose this font provider methods for the RN Bridge so that we can at least set custom font family.

Description

Exposing fontProviders for PaywallFooterView and PaywallView.
theme composition local provider should update this autmoatically.

Need to add something like this on the React Native side.
If user did link the font via

<font-family xmlns:app="http://schemas.android.com/apk/res/android">
        <font app:fontStyle="normal" android:fontWeight="200" android:font="@font/montserrat" />
</font-family>

    ReactFontManager.getInstance().addCustomFont(this, "Montserrat", R.font.montserrat);

We could just bring the font family

    @ReactProp(name= "fontFamily")
    fun setFontFamily(view: PaywallFooterView, fontFamily: String?){
        val typeface = ReactFontManager.getInstance()
            .getTypeface(fontFamily /** Montserrat in this case. **/, ReactFontManager.TypefaceStyle.NORMAL, assets)
        
        view.setFontProvider(CustomFontProvider(FontFamily(typeface)))
    }

…tom font.

…oseview can listen to the state change.

…to exposing-fontprovider # Conflicts: # ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/views/PaywallFooterView.kt

…ew(context)) expose the font provider. set a private getter and setter to reduce some boilerplate

…function out. Expose fontProvider.

### Checklist - [ ] If applicable, create follow-up issues for `purchases-ios` and hybrids ### Motivation - It's not possible for us to change the font family in react-native-purchase. - My hope was to expose this font provider methods for the RN Bridge so that we can at least set custom font family. ### Description - Exposing fontProviders for PaywallFooterView and PaywallView. - theme composition local provider should update this autmoatically. Need to add something like this on the React Native side. If user did link the font via ```xml <font-family xmlns:app="http://schemas.android.com/apk/res/android"> <font app:fontStyle="normal" android:fontWeight="200" android:font="@font/montserrat" /> </font-family> ``` ```kotlin ReactFontManager.getInstance().addCustomFont(this, "Montserrat", R.font.montserrat); ``` We could just bring the font family ```kotlin @ReactProp(name= "fontFamily") fun setFontFamily(view: PaywallFooterView, fontFamily: String?){ val typeface = ReactFontManager.getInstance() .getTypeface(fontFamily /** Montserrat in this case. **/, ReactFontManager.TypefaceStyle.NORMAL, assets) view.setFontProvider(CustomFontProvider(FontFamily(typeface))) } ``` <img width="350" alt="Screenshot 2024-01-26 at 10 04 03 PM" src="https://github.com/RevenueCat/purchases-android/assets/6516487/e8e41b0d-c1fd-4446-8d5b-11cb9de200e5">

tonidero · 2024-02-01T08:26:01Z

...ter/src/defaults/kotlin/com/revenuecat/apitester/kotlin/revenuecatui/PaywallFooterViewAPI.kt

@@ -14,7 +15,7 @@ import com.revenuecat.purchases.ui.revenuecatui.views.PaywallFooterView
 private class PaywallFooterViewAPI {

    fun checkType(context: Context) {
-        val paywallFooterView: FrameLayout = PaywallFooterView(context)
+        val paywallFooterView: AbstractComposeView = PaywallFooterView(context)


This is a breaking change... But feels that it should be ok... Any thoughts?

If it works I think we should go for it, it will simplify the views

Paywalls is still experimental so :)

codecov · 2024-02-01T08:59:01Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (fce561f) 83.71% compared to head (4cf3a8e) 83.71%.
Report is 1 commits behind head on main.

❗ Current head 4cf3a8e differs from pull request most recent head 123f64e. Consider uploading reports for the commit 123f64e to get more accurate results

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #1589   +/-   ##
=======================================
  Coverage   83.71%   83.71%           
=======================================
  Files         218      218           
  Lines        7260     7260           
  Branches     1011     1011           
=======================================
  Hits         6078     6078           
  Misses        788      788           
  Partials      394      394

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

vegaro · 2024-02-01T14:26:19Z

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/views/PaywallView.kt

@@ -113,16 +126,6 @@ class PaywallView : FrameLayout {
            .setOfferingId(initialOfferingId)
            .setShouldDisplayDismissButton(shouldDisplayDismissButton ?: false)
            .build()
-        addView(


Can we change line 123 to be paywallOptions = PaywallOptions.Builder?

NachoSoto · 2024-02-01T15:50:07Z

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/views/PaywallView.kt

@@ -133,4 +136,12 @@ class PaywallView : FrameLayout {
        this.initialFontProvider = fontProvider
        this.shouldDisplayDismissButton = shouldDisplayDismissButton
    }
+
+    @Composable
+    override fun Content() {


This is much nicer

…3626) This is the iOS counterpart to RevenueCat/purchases-android#1589 This exposes the `fontName` as a parameter and sets `CustomFontProvider`. ### Description - Created `updateFontWithFontName` for `PaywallViewController` - Created init function for `offerIdentifier` and `fontName` <img width="450" alt="301765252-95f61abb-10a1-4903-a2ef-12572ae3eaff" src="https://github.com/RevenueCat/purchases-ios/assets/6516487/56061916-0391-447a-ae74-57f2dddcf7a7"> --------- Co-authored-by: NachoSoto <NachoSoto@users.noreply.github.com>

@Jjastiny

@Jjastiny) (#3628) Original PR: #3626. This is the iOS counterpart to RevenueCat/purchases-android#1589 This exposes the `fontName` as a parameter and sets `CustomFontProvider`. ### Changes: - Created `updateFontWithFontName` for `PaywallViewController` - Created init function for `offerIdentifier` and `fontName` <img width="450" alt="301765252-95f61abb-10a1-4903-a2ef-12572ae3eaff" src="https://github.com/RevenueCat/purchases-ios/assets/6516487/56061916-0391-447a-ae74-57f2dddcf7a7"> --------- Co-authored-by: Justin Yang <jjastiny@gmail.com>

#1589 made `PaywallFooterView` an `AbstractComposeView`, which broke React Native's implementation because we override `onMeasure` which is final in `AbstractComposeView`

@Jjastiny

**This is an automatic release.** ### New Features * [EXTERNAL] Exposing fontprovider setter in `PaywallView` and `PaywallFooterView` by @Jjastiny (#1589) via Toni Rico (@tonidero) ### RevenueCatUI * `Paywalls`: add 4 new variables (#1599) via NachoSoto (@NachoSoto) ### Bugfixes * Catch Exception instead of only IllegalArgumentException when decoding paywallData (#1601) via Cesar de la Vega (@vegaro) * Revert making PaywallFooterView an AbstractComposeView (#1598) via Cesar de la Vega (@vegaro) * Add missing forwarding to `PaywallListener.onPurchaseCancelled` (#1590) via Cesar de la Vega (@vegaro) ### Dependency Updates * Bump danger from 9.4.2 to 9.4.3 (#1597) via dependabot[bot] (@dependabot[bot]) ### Other Changes * Update CHANGELOG with 6.9.6 release notes (#1596) via Toni Rico (@tonidero) Co-authored-by: revenuecat-ops <ops@revenuecat.com>

@Jjastiny

…View (contributed by @Jjastiny) (#916) Thank you for contributing to react-native-purchases. Before pressing the "Create Pull Request" button, please provide the following: - [x] A description about what and why you are contributing, even if it's trivial. - [x] The issue number(s) or PR number(s) in the description if you are contributing in response to those. - [ ] If applicable, unit tests. This PR adds a fontFamily string in PaywallOptions Prop, which enables the developers to change the font for the paywall to their custom font. ```typescript export interface PaywallViewOptions { offering?: PurchasesOffering | null; fontFamily?: String | null; // New } ``` This is the RN native module update for following PR's RevenueCat/purchases-ios#3628 AND RevenueCat/purchases-android#1589 --------- Co-authored-by: Jjastiny <jjastiny@gmail.com>

Jjastiny and others added 10 commits January 26, 2024 11:39

Expose font provider, so that react native bridge can redraw with cus…

f1b2feb

…tom font.

Add comments. Expose fontProvider for paywallView as well.

daabc0f

remove unnecessary invalidate from setFontProvider.

5648728

making the FontProvider and OfferingId to a mutableState so that comp…

beb3362

…oseview can listen to the state change.

Merge branch 'main' of other.github.com:Jjastiny/purchases-android in…

c3b00cb

…to exposing-fontprovider # Conflicts: # ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/views/PaywallFooterView.kt

use abstract compose view, to remove unnecessary addSubView(ComposeVi…

a4ef262

…ew(context)) expose the font provider. set a private getter and setter to reduce some boilerplate

remove unused imports

0acb908

remove paywall view font provider for now

b3591c8

PaywallView now uses AbstractComposeView, to abstract the composable …

06a286b

…function out. Expose fontProvider.

tonidero added the feat A new feature label Feb 1, 2024

Fix detekt

a6c4c12

tonidero commented Feb 1, 2024

View reviewed changes

tonidero marked this pull request as ready for review February 1, 2024 08:26

tonidero requested a review from a team February 1, 2024 08:26

tonidero changed the title ~~[EXTERNAL] Exposing fontprovider in PaywallView and PaywallFooterView by @Jjastiny~~ [EXTERNAL] Exposing fontprovider setter in PaywallView and PaywallFooterView by @Jjastiny Feb 1, 2024

Fix api tests

4cf3a8e

tonidero force-pushed the external/Jjastiny/exposing-fontprovider branch from 2cb4572 to 4cf3a8e Compare February 1, 2024 08:38

vegaro approved these changes Feb 1, 2024

View reviewed changes

Fix comment from review

123f64e

tonidero enabled auto-merge (squash) February 1, 2024 15:42

NachoSoto reviewed Feb 1, 2024

View reviewed changes

tonidero merged commit 8704c8f into main Feb 1, 2024
7 checks passed

tonidero deleted the external/Jjastiny/exposing-fontprovider branch February 1, 2024 16:00

Jjastiny mentioned this pull request Feb 2, 2024

PaywallViewController: expose fontName for CustomFontProvider RevenueCat/purchases-ios#3626

Merged

NachoSoto mentioned this pull request Feb 2, 2024

PaywallViewController: expose fontName for CustomFontProvider (by @Jjastiny) RevenueCat/purchases-ios#3628

Merged

vegaro mentioned this pull request Feb 5, 2024

Revert making PaywallFooterView an AbstractComposeView #1598

Merged

RCGitBot mentioned this pull request Feb 6, 2024

[AUTOMATIC] Release/7.5.0 #1602

Merged

Jjastiny mentioned this pull request Feb 11, 2024

Adding fontFamily from RN to CustomFontProvider in PaywallView. RevenueCat/react-native-purchases#902

Merged

3 tasks

tonidero mentioned this pull request Feb 23, 2024

[EXTERNAL] Adding fontFamily from RN to CustomFontProvider in PaywallView (contributed by @Jjastiny) RevenueCat/react-native-purchases#916

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[EXTERNAL] Exposing fontprovider setter in `PaywallView` and `PaywallFooterView` by @Jjastiny #1589

[EXTERNAL] Exposing fontprovider setter in `PaywallView` and `PaywallFooterView` by @Jjastiny #1589

tonidero commented Feb 1, 2024 •

edited

Loading

tonidero Feb 1, 2024

vegaro Feb 1, 2024

NachoSoto Feb 1, 2024

codecov bot commented Feb 1, 2024 •

edited

Loading

vegaro Feb 1, 2024

NachoSoto Feb 1, 2024

[EXTERNAL] Exposing fontprovider setter in PaywallView and PaywallFooterView by @Jjastiny #1589

[EXTERNAL] Exposing fontprovider setter in PaywallView and PaywallFooterView by @Jjastiny #1589

Conversation

tonidero commented Feb 1, 2024 • edited Loading

Checklist

Motivation

Description

tonidero Feb 1, 2024

Choose a reason for hiding this comment

vegaro Feb 1, 2024

Choose a reason for hiding this comment

NachoSoto Feb 1, 2024

Choose a reason for hiding this comment

codecov bot commented Feb 1, 2024 • edited Loading

Codecov Report

vegaro Feb 1, 2024

Choose a reason for hiding this comment

NachoSoto Feb 1, 2024

Choose a reason for hiding this comment

[EXTERNAL] Exposing fontprovider setter in `PaywallView` and `PaywallFooterView` by @Jjastiny #1589

[EXTERNAL] Exposing fontprovider setter in `PaywallView` and `PaywallFooterView` by @Jjastiny #1589

tonidero commented Feb 1, 2024 •

edited

Loading

codecov bot commented Feb 1, 2024 •

edited

Loading