AFFiNE/libs/datasource/feature-flags

Feature Flags

Usage

• Set token at environment variable
  • The key can be obtained from the Feature Flag Portal

# .env.local
AFFINE_FEATURE_FLAG_TOKEN=XXXXXXX

• Set provider

import { FeatureFlagsProvider } from '@toeverything/datasource/feature-flags';

const App = () => {
    return (
        <FeatureFlagsProvider>
            <Page />
        </FeatureFlagsProvider>
    );
};

• use flag

import { useFlag } from '@toeverything/datasource/feature-flags';

const App = () => {
    //                   flag key, default value
    const flag1 = useFlag('flag1', false);
    // ^? boolean
    const flag2 = useFlag<boolean>('flag2');
    // ^? boolean | undefined
    return flag1 && <div>The flag1 is enable!</div>;
};

How to add a new feature flag?

• Enter Portal
• Click New Switch button
  • Input Switch Name, and Enter
  • Adjust data and save

Test flags

When entering development mode feature flag will NOT be updated in real time

• activateFfcDevMode(PASSWORD) play with feature flags locally
  • The devModePassword can be obtained from src/config.ts
• quitFfcDevMode() quit dev mode

Running unit tests

Run nx test datasource/feature-flags to execute the unit tests via Jest.

References

• Feature Flag Portal
• Feature Flag React Web APP DEMO