Feature Flags React

Install

npm i feature-flags-react

Usage

1 - Configure the client

In order to set up the client you need two things: the base url of you flags service instance and a client token for the specific project-environment combination that you want to query flags for.

import { useSetupClient } from 'feature-flags-react';

useSetupClient('http://localhost:8000/v1', 'b7f606f3-2044-41e7-9a82-3f078b9b29aa');

If you are not using react, you can still call the FlagsClient instance directly

import { FlagsClient } from 'feature-flags-react';

FlagsClient.setup('http://localhost:8000/v1', 'b7f606f3-2044-41e7-9a82-3f078b9b29aa');

2 - Query for flags

There are multiple ways of querying for flags: using the utility hooks that are provided, or calling the FlagsClient directly

import { useFlag, useLazyFlag, FlagsClient } from 'feature-flags-react';

/// Using lazy loading
const [{ flag, loading, error }, getFlag] = useLazyFlag();
getFlag(
  key, // your flag name eg: google-pay
  userId, // unique identifier for the user
  {} // context
);

/// Using the utility hook that auto fetches info
const { flag, loading, error } = useFlag(
  key, // your flag name eg: google-pay
  userId, // unique identifier for the user
  {} // context
);

/// Calling the FlagsClient directly
const flag = FlagsClient.getFlag(key, context); // in this case, you should put the `userId` key inside context manually