Android & IOS: How to Setup Multi Group Subscriptions with React Native

In this comprehensive guide, we'll show you how to set up multi-group subscriptions in RevenueCat using React Native for both iOS and Android. Whether you're a beginner or a seasoned developer, our step-by-step approach will provide the insights and tips you need to streamline the setup process. These actionable strategies enhance your app's user experience and revenue generation potential. By the end of this guide, you'll have a solid understanding of implementing multi-group subscriptions, leveraging in-app purchases, and unlocking new revenue streams for your app.

Key Concepts Covered

• React Native: A framework for building native apps using React.

• Multi-Group Subscriptions: Managing multiple subscription tiers or groups within an app.

• Android & iOS Integration: Platform-specific setup and configurations.

What is RevenueCat?

RevenueCat is a powerful platform for managing in-app subscriptions and purchases, designed to help app developers unlock their full revenue potential. Whether you're implementing multi-group subscriptions or streamlining your in-app purchase process, RevenueCat has you covered. In this blog post, we'll guide you through setting up multi-group subscriptions with in-app purchases in RevenueCat, helping you maximize your app's revenue and improve user experience.

Understanding Multi-Group Subscriptions

Before diving into the setup process, it's crucial to understand multi-group subscriptions and their benefits for your app. Multi-group subscriptions allow users to access different tiers or levels of content within your app through multiple subscription purchases. This can include various levels of features, content, or access to premium services. By offering multi-group subscriptions, you provide users with more options and flexibility while increasing the potential for recurring revenue.

Problem Overview

One of Buzzvel's clients needed a unique feature allowing users to manage multiple subscriptions simultaneously.

Typically, in-app purchases for the Apple Store and Google Play Store are designed for a single subscription per user, meaning a user can have only one active subscription, such as Basic, Premium, or Gold.

However, our client's requirements were different. They wanted users to manage several subscriptions across various groups within the app. For example, a user could have a Basic subscription for each subaccount in the application. This multi-subscription feature is ideal for users who need to organize and manage multiple accounts efficiently.

Before You Start

Before we dive into the setup process, ensure you have the following:

1 - A Revenue Cat Account

2 - Google Play Developer Account

3 - App Store Developer Account

4 - Setup In-App Purchases in Google Play

5 - Setup In-App Purchases in Apple Store

Our Use Case

Understanding how multi-group subscriptions work in your application is crucial to understand the concept. These subscriptions allow users to access various levels or tiers of your app's content with a single purchase. Our multi-subscription use case focused on allowing users to subscribe to different attachment storage packages for app groups (e.g., 200GB, 500GB, 1TB).

In a typical scenario, we would create the following group of subscriptions on Google Play and the App Store:

• Basic Subscription

• Premium Subscription

• Gold Subscription

The problem we identified is that Google Play and the App Store do not natively support assigning subscriptions to specific groups. If a user subscribes to a Basic or Premium Subscription, the subscription will be valid for the entire app.

How We Solved This Problem

After organizing the subscriptions in the stores, we reflected these subscriptions as products in RevenueCat (pay attention to the subscription IDs set in the stores). We then used RevenueCat to organize this structure into offerings.

At Buzzvel, we organized our offerings as follows:

• Group 1

group1_basic (android_group1_basic, ios_group1_basic)

group1_premium (android_group1_premium, ios_group1_premium)

group1_gold (android_group1_gold, ios_group1_gold)

• Group 2

group2_basic (android_group2_basic, ios_group2_basic)

group2_premium (android_group2_premium, ios_group2_premium)

group2_gold (android_group2_gold, ios_group2_gold)

• Group 3

group3_basic (android_group3_basic, ios_group3_basic)

group3_premium (android_group3_premium, ios_group3_premium)

group3_gold (android_group3_gold, ios_group3_gold)

Setup Example:

• Apple Store

Group 1 is a Subscription Group

ios_group1_basic is a Subscription

• Play Store

Group 1 is a Subscription

android_group1_basic is a Base Plan/Offer

• Revenue Cat

Group 1 is an Offering

Package Example: group1_basic

Products: android_group1_basic and ios_group1_basic

That's it. You are now able to consult and manage multiple subscriptions with RevenueCat.

Managing Subscriptions

To subscribe using this model, we need control among the groups. Here at Buzzvel, we use RevenueCat as a subscription aggregator because it offers a great SDK for React Native.

JavaScript

const [oferrings, setOferrings] = useState(null);
 const { user } = useAuth()

  async function loadOfferings() {
    const offerings = await Purchases.getOfferings();
    setOferrings(offerings);
  }
	
   const availablePlans = ["group1", "group2", "group3"];

  const currentPackages = useMemo(() => {
    const oferingId = user?.current_subscription?.offering_id;

    if (!oferrings) return [];

    if (oferingId) {
      const currentOferring = oferrings.all?.[oferingId];
      return currentOferring?.availablePackages ?? [];
    } else {
      const oferindIdAvailable = avaiablePlans[0];
      const currentOferring = oferrings.all[oferindIdAvailable];
      return currentOferring?.availablePackages ?? [];
    }
  }, [oferrings, subscription, avaiablePlans]);
  
  useEffect(() => {
	  loadOfferings()
  }, [])

• The availablePlans constant can be replaced by a list of plans the user has already subscribed to. The plan identifier is found in the webhook configured in RevenueCat after a purchase.

• The current_subscription object is configured in the user object after a purchase. This allows us to identify the current group subscription so that the user can view others besides the one they already subscribe to.

• The currentPackages array will return the list of available packages based on the group

After that, you can list this array in a component and add a purchase action using a button.

Limitations

The main one is the limited number of plans.

As seen in this tutorial, creating just one subscription takes considerable effort. The process involves setting up the subscriptions in the stores, connecting them to RevenueCat, integrating with the backend, and configuring the response in the webhook.

Managing subscriptions in stores is also challenging, as there is no way to identify subscription groups if the user wants to manage a subscription outside the app (e.g., in the Google Play Store or iOS subscriptions). Subscriptions usually appear under the name of the tier.

Before setting up, check the use case for the number of accounts/subscriptions a user could have and create them initially. For example, we made eight groups for our client, knowing that it would be difficult to reach this point. If it becomes necessary to create one, it will be worth it because the client will be paying for nine subscriptions.

Conclusion

In conclusion, while setting up and managing multi-group subscriptions for Android and iOS applications using React Native can be a complex and resource-intensive process, the benefits are substantial. By leveraging tools like RevenueCat, developers can achieve a nuanced subscription model that caters to diverse user needs and maximizes revenue potential.

Our approach at Buzzvel demonstrates that with proper organization, thoughtful integration, and strategic planning, it is possible to create a scalable and efficient subscription management system. Although challenges such as limited plan options and the difficulty of managing subscriptions outside the app exist, these can be mitigated with careful initial planning and ongoing monitoring. Ultimately, the effort invested in establishing a robust multi-group subscription system will pay off in terms of user satisfaction and long-term business growth.