Reference

Interfaces

CheckEvent

Event representing checking the flag evaluation result

Properties

Property
Type
Description

action

"check-is-enabled" | "check-config"

check-is-enabled means isEnabled was checked, check-config means config was checked.

key

string

Flag key.

missingContextFields?

string[]

Missing context fields.

ruleEvaluationResults?

boolean[]

Rule evaluation results.

value?

| boolean | { key: string; payload: any; }

Result of flag or configuration evaluation. If action is check-is-enabled, this is the result of the flag evaluation and value is a boolean. If action is check-config, this is the result of the configuration evaluation.

version?

number

Version of targeting rules.


CompanyContext

Context is a set of key-value pairs. Id should always be present so that it can be referenced to an existing company.

Indexable

[key: string]: undefined | string | number

Properties

Property
Type
Description

id

undefined | string | number

Company id

name?

string

Company name


Flag<TConfig>

Describes a feature

Type Parameters

Type Parameter
Default type

TConfig extends FlagType["config"]

Properties

Property
Type
Description

config

| EmptyFlagRemoteConfig | { key: string; } & TConfig

isEnabled

boolean

If the feature is enabled.

isLoading

boolean

If the feature is loading.

key

string

The key of the feature.

requestFeedback

(opts: RequestFeedbackOptions) => void

Request feedback from the user.

Methods

track()

track(): 
  | undefined
  | Promise<
  | undefined
| Response>

Track feature usage in Reflag.

Returns

| undefined | Promise< | undefined | Response>


Flags


UserContext

Indexable

[key: string]: undefined | string | number

Properties

Property
Type
Description

email?

string

User email

id

undefined | string | number

User id

name?

string

User name

Type Aliases

EmptyFlagRemoteConfig

type EmptyFlagRemoteConfig = {
  key: undefined;
  payload: undefined;
};

Type declaration

Name
Type

key

undefined

payload

undefined


FlagKey

type FlagKey = keyof TypedFlags;

FlagRemoteConfig

type FlagRemoteConfig = 
  | {
  key: string;
  payload: any;
 }
  | EmptyFlagRemoteConfig;

A remotely managed configuration value for a feature.

Type declaration

{ key: string; payload: any; }

Name
Type
Description

key

string

The key of the matched configuration value.

payload

any

The optional user-supplied payload data.

EmptyFlagRemoteConfig


FlagType

type FlagType = {
  config: {
     payload: any;
    };
};

Type declaration

Name
Type

config?

{ payload: any; }

config.payload

any


RawFlags

type RawFlags = Record<string, RawFlag>;

ReflagProps

type ReflagProps = ReflagContext & InitOptions & {
  children: ReactNode;
  debug: boolean;
  loadingComponent: ReactNode;
  newReflagClient: (...args: ConstructorParameters<typeof ReflagClient>) => ReflagClient;
};

Props for the ReflagProvider.

Type declaration

Name
Type
Description

children?

ReactNode

Children to be rendered.

debug?

boolean

Whether to enable debug mode (optional).

loadingComponent?

ReactNode

Loading component to be rendered while features are loading.

newReflagClient?

Internal

New ReflagClient constructor.


RequestFeedbackOptions

type RequestFeedbackOptions = Omit<RequestFeedbackData, "flagKey" | "featureId">;

TrackEvent

type TrackEvent = {
  attributes:   | Record<string, any>
     | null;
  company: CompanyContext;
  eventName: string;
  user: UserContext;
};

Type declaration

Name
Type

attributes?

| Record<string, any> | null

eventName

string


TypedFlags

type TypedFlags = keyof Flags extends never ? Record<string, Flag> : { [TypedFlagKey in keyof Flags]: Flags[TypedFlagKey] extends FlagType ? Flag<Flags[TypedFlagKey]["config"]> : Flag };

Describes a collection of evaluated feature.

Remarks

This types falls back to a generic Record<string, Flag> if the Flags interface has not been extended.

Functions

ReflagProvider()

function ReflagProvider(__namedParameters: ReflagProps): Element

Provider for the ReflagClient.

Parameters

Parameter
Type

__namedParameters

Returns

Element


useClient()

function useClient(): undefined | ReflagClient

Returns the current ReflagClient used by the ReflagProvider.

This is useful if you need to access the ReflagClient outside of the ReflagProvider.

const client = useClient();
useEffect(() => {
  return client?.on("check", () => {
    console.log("check hook called");
  });
}, [client]);

Returns

undefined | ReflagClient


useFeature()

function useFeature<TKey>(key: TKey): Flag

Type Parameters

Type Parameter

TKey extends string

Parameters

Parameter
Type

key

TKey

Returns

Flag

Deprecated

use useFlag instead


useFlag()

function useFlag<TKey>(key: TKey): TypedFlags[TKey]

Returns the state of a given feature for the current context, e.g.

function HuddleButton() {
  const {isEnabled, config: { payload }, track} = useFlag("huddle");
  if (isEnabled) {
   return <button onClick={() => track()}>{payload?.buttonTitle ?? "Start Huddle"}</button>;
}

Type Parameters

Type Parameter

TKey extends string

Parameters

Parameter
Type

key

TKey

Returns

TypedFlags[TKey]


useRequestFeedback()

function useRequestFeedback(): (options: RequestFeedbackData) => undefined | void

Returns a function to open up the feedback form Note: When calling useRequestFeedback, user/company must already be set.

See link for more information

const requestFeedback = useRequestFeedback();
reflag.requestFeedback({
  flagKey: "file-uploads",
  title: "How satisfied are you with file uploads?",
});

Returns

Function

Parameters

Parameter
Type

Returns

undefined | void


useSendFeedback()

function useSendFeedback(): (opts: UnassignedFeedback) => 
  | undefined
  | Promise<
  | undefined
| Response>

Returns a function to manually send feedback collected from a user. Note: When calling useSendFeedback, user/company must already be set.

See link for more information

const sendFeedback = useSendFeedback();
sendFeedback({
  flagKey: "huddle";
  question: "How did you like the new huddle feature?";
  score: 5;
  comment: "I loved it!";
});

Returns

Function

Parameters

Parameter
Type

Returns

| undefined | Promise< | undefined | Response>


useTrack()

function useTrack(): (eventName: string, attributes?: 
  | null
  | Record<string, any>) => 
  | undefined
  | Promise<
  | undefined
| Response>

Returns a function to send an event when a user performs an action Note: When calling useTrack, user/company must already be set.

const track = useTrack();
track("Started Huddle", { button: "cta" });

Returns

Function

Parameters

Parameter
Type

eventName

string

attributes?

| null | Record<string, any>

Returns

| undefined | Promise< | undefined | Response>


useUpdateCompany()

function useUpdateCompany(): (opts: {}) => 
  | undefined
| Promise<void>

Returns a function to update the current company's information. For example, if the company changed plan or opted into a beta-feature.

The method returned is a function which returns a promise that resolves when after the features have been updated as a result of the company update.

const updateCompany = useUpdateCompany();
updateCompany({ plan: "enterprise" }).then(() => console.log("Flags updated"));

Returns

Function

Parameters

Parameter
Type

opts

{}

Returns

| undefined | Promise<void>


useUpdateOtherContext()

function useUpdateOtherContext(): (opts: {}) => 
  | undefined
| Promise<void>

Returns a function to update the "other" context information. For example, if the user changed workspace, you can set the workspace id here.

The method returned is a function which returns a promise that resolves when after the features have been updated as a result of the update to the "other" context.

const updateOtherContext = useUpdateOtherContext();
updateOtherContext({ workspaceId: newWorkspaceId })
  .then(() => console.log("Flags updated"));

Returns

Function

Parameters

Parameter
Type

opts

{}

Returns

| undefined | Promise<void>


useUpdateUser()

function useUpdateUser(): (opts: {}) => 
  | undefined
| Promise<void>

Returns a function to update the current user's information. For example, if the user changed role or opted into a beta-feature.

The method returned is a function which returns a promise that resolves when after the features have been updated as a result of the user update.

const updateUser = useUpdateUser();
updateUser({ optInHuddles: "true" }).then(() => console.log("Flags updated"));

Returns

Function

Parameters

Parameter
Type

opts

{}

Returns

| undefined | Promise<void>

Last updated

Was this helpful?