Options
All
  • Public
  • Public/Protected
  • All
Menu

LaunchDarkly React SDK (2.17.1)

Index

Functions

asyncWithLDProvider

  • asyncWithLDProvider(config: ProviderConfig): Promise<FunctionComponent<{}>>
  • This is an async function which initializes LaunchDarkly's JS SDK (launchdarkly-js-client-sdk) and awaits it so all flags and the ldClient are ready before the consumer app is rendered.

    The difference between withLDProvider and asyncWithLDProvider is that withLDProvider initializes launchdarkly-js-client-sdk at componentDidMount. This means your flags and the ldClient are only available after your app has mounted. This can result in a flicker due to flag changes at startup time.

    asyncWithLDProvider initializes launchdarkly-js-client-sdk at the entry point of your app prior to render. This means that your flags and the ldClient are ready at the beginning of your app. This ensures your app does not flicker due to flag changes at startup time.

    asyncWithLDProvider accepts a config object which is used to initialize launchdarkly-js-client-sdk. It returns a provider which is a React FunctionComponent which:

    • saves all flags and the ldClient instance in the context API
    • subscribes to flag changes and propagate them through the context API

    Parameters

    • config: ProviderConfig

      The configuration used to initialize LaunchDarkly's JS SDK

    Returns Promise<FunctionComponent<{}>>

Const camelCaseKeys

  • camelCaseKeys(rawFlags: LDFlagSet): LDFlagSet
  • Transforms a set of flags so that their keys are camelCased. This function ignores flag keys which start with $.

    Parameters

    • rawFlags: LDFlagSet

      A mapping of flag keys and their values

    Returns LDFlagSet

    A transformed LDFlagSet with camelCased flag keys

Const initLDClient

  • initLDClient(clientSideID: string, user?: LDUser, reactOptions?: LDReactOptions, options?: LDOptions, targetFlags?: LDFlagSet): Promise<AllFlagsLDClient>
  • Internal function to initialize the LDClient.

    Parameters

    • clientSideID: string

      Your project and environment specific client side ID

    • Default value user: LDUser = { anonymous: true }

      A LaunchDarkly user object

    • Default value reactOptions: LDReactOptions = defaultReactOptions
    • Optional options: LDOptions

      LaunchDarkly initialization options

    • Optional targetFlags: LDFlagSet

      If specified, launchdarkly-react-client-sdk will only request and listen to these flags.

    Returns Promise<AllFlagsLDClient>

    An initialized client and flags

Const useFlags

  • useFlags(): LDFlagSet
  • useFlags is a custom hook which returns all feature flags. It uses the useContext primitive to access the LaunchDarkly context set up by withLDProvider. As such you will still need to use the withLDProvider HOC at the root of your app to initialize the React SDK and populate the context with ldClient and your flags.

    Returns LDFlagSet

    All the feature flags configured in your LaunchDarkly project

Const useLDClient

  • useLDClient(): undefined | LDClient
  • useLDClient is a custom hook which returns the underlying LaunchDarkly JavaScript SDK client object. Like the useFlags custom hook, useLDClient also uses the useContext primitive to access the LaunchDarkly context set up by withLDProvider. You will still need to use the withLDProvider HOC to initialise the react sdk to use this custom hook.

    Returns undefined | LDClient

    The launchdarkly-js-client-sdk LDClient object

withLDConsumer

  • withLDConsumer is a function which accepts an optional options object and returns a function which accepts your React component. This function returns a HOC with flags and the ldClient instance injected via props.

    Parameters

    • Default value options: ConsumerOptions = { clientOnly: false }

      If you need only the ldClient instance and not flags, then set { clientOnly: true } to only pass the ldClient prop to your component. Defaults to { clientOnly: false }.

    Returns withLDConsumerHoc

    A HOC with flags and the ldClient instance injected via props

withLDProvider

  • withLDProvider is a function which accepts a config object which is used to initialize launchdarkly-js-client-sdk.

    This HOC does three things:

    • It initializes the ldClient instance by calling launchdarkly-js-client-sdk initialize on componentDidMount
    • It saves all flags and the ldClient instance in the context API
    • It subscribes to flag changes and propagate them through the context API

    The difference between withLDProvider and asyncWithLDProvider is that withLDProvider initializes launchdarkly-js-client-sdk at componentDidMount. This means your flags and the ldClient are only available after your app has mounted. This can result in a flicker due to flag changes at startup time.

    asyncWithLDProvider initializes launchdarkly-js-client-sdk at the entry point of your app prior to render. This means that your flags and the ldClient are ready at the beginning of your app. This ensures your app does not flicker due to flag changes at startup time.

    Parameters

    • config: ProviderConfig

      The configuration used to initialize LaunchDarkly's JS SDK

    Returns withLDProviderHoc

    A function which accepts your root React component and returns a HOC

Object literals

Const defaultReactOptions

defaultReactOptions: object

Contains default values for the reactOptions object.

useCamelCaseFlagKeys

useCamelCaseFlagKeys: boolean = true

Generated using TypeDoc