Skip to content

Flags

Use and manage cozy feature flags. Flags can be toggled for a cozy instance, a context or globally. See the stack documentation on flags for more information.

  • ✅ jQuery like API for getter/setter
  • ✅ Devtool component to set/unset flags

Installation

npm install --save cozy-flags
# or yarn add cozy-flags

A CozyClient plugin is exported that

  • initializes flags on client’s login
  • resets them on client’s logout
import flag from 'cozy-flags'
client.registerPlugin(flag.plugin)

ℹ️ It will fetch server flags for consumption by the app

  • either from DOM data (if data-cozy={{ .CozyData }} or data-flags={{ .Flags }}, on web
  • or by fetching data from the server (on mobile)

Usage

⚠️ Make sure you have registered the flag plugin before using the flags.

import flag from 'cozy-flags'

if (flag('my-feature')) {
  enableMyFeature()
}

The FlagSwitcher shows all flags in use and displays all flags in use.

import flag from 'cozy-flags'
import FlagSwitcher from 'cozy-flags/dist/FlagSwitcher'

if (process.env.NODE_ENV !== 'production'
    && flag('switcher') === null) {
    flag('switcher', true) // set default flag in dev mode
}

const App = () => {
  return (
    <div>
      { flag('switcher') && <FlagSwitcher /> }
      <MyApp />
    </div>
  )
}

Demo

The FlagSwitcher component helps toggling the flags.

Flags enabled at build time

It is possible to handle flags enabled at build time. Your app should just provide a global __ENABLED_FLAGS__ array with flag names that should be enabled. If such a global exists, cozy-flags will iterate on the array and enable all the flags it contains when it is imported.