DEV Community

Cover image for Simple Feature Flag for Multitenant applications
Sibelius Seraphini for Woovi

Posted on

Simple Feature Flag for Multitenant applications

What are Feature Flags?

Feature flags are conditional branches in the code that enable or disable certain features. They act as dynamic switches, allowing developers to activate or deactivate specific functionalities without modifying the codebase. This versatility is particularly advantageous in multitenant architectures where different tenants may require distinct features or configurations.

You can read more about why changing behavior over deployment is a wrong approach here Deploys Are the ✨WRONG✨ Way to Change User Experience

How to implement Feature Flags?

You can choose from a very simple implementation to an open source like Unleash, to a complete SaaS solution.

I would say that a SaaS solution to implementing a basic feature flag for most products would be overkill.
Even unleash would be overkill for most Startups.

My advice to most Startups is to start very simple with a feature flag, no need for rollout if you don't have enough users.

Feature Flag for Multitenant apps

At Woovi we implement feature flags per tenant. Each tenant has an array of features that enable the feature for them. Example:

const TenantSchema = new mongoose.Schema({
   features: {
      type: [String],
    },
});
Enter fullscreen mode Exit fullscreen mode

The above code is a mongoose schema that defines that the Tenant collection/table would have a features of type array of strings.

To check on the backend if the tenant has the feature we would use a simple function or condition check:

const hasFeature = (tenant, feature) => 
 tenant.features.includes(feature)
Enter fullscreen mode Exit fullscreen mode

A basic FeatureFlag component to use in your React components

export const FeatureFlag = ({
  feature,
  fallbackComponent = null,
  children,
  ...props,
}: Props) => {
  const tenant = useFragment(
    graphql`
      fragment FeatureFlag_tenant on Tenant {
        features
      }
    `,
    props.tenant,
  );

  if (!hasFeature(tenant, feature)) {
    return fallbackComponent;
  }

  return children;
};
Enter fullscreen mode Exit fullscreen mode

the usage would be:

<FeatureFlag feature={FEATURE.CASHBACK}>
   <Button>Give Cashback</Button>
</FeatureFlag>
Enter fullscreen mode Exit fullscreen mode

Organizing your Features

You can create an enum to organize all your available features

enum FEATURES = {
 BETA,
 CASHBACK,
 PIX,
 CREDIT_CARD,
}
Enter fullscreen mode Exit fullscreen mode

If you use a multirepo approach you can copy the features to keep the many repos synced. Otherwise, if you use a monorepo, you can create a package to share this.

You can also expose all available features and features available for the tenant using REST or GraphQL API, with GraphQL the query would be like this one:

query {
   features # all available features
   tenant {
     features # features available for this particular tenant
   }
}
Enter fullscreen mode Exit fullscreen mode

In Brief

Sometimes I think we forget that we can build our in-house software solutions instead of delegating to a SaaS or open source.
The approach of this article is working well for Woovi even as we scale. We do have a rollout approach to some features, but we don't need an automated rollout yet.

If you are not using feature flags yet, you are developing software in the wrong way.

If you are using feature flags, what are you using to manage them?


Woovi
Woovi is a Startup that enables shoppers to pay as they like. To make this possible, Woovi provides instant payment solutions for merchants to accept orders.

If you want to work with us, we are hiring!


Photo by Joshua Reddekopp on Unsplash

Top comments (1)

Collapse
 
joabesv profile image
Joabe

I think it would be nice, to have an article explaining how woovi apply multi-tenancy and best practices. Theres not a lot of content on this topic.