FlagsterFlagster
SDKs/React/Hooks

useFlags

Retrieve flags values from Flagster instance

PropTypeDefault
names?
string[]
[]

Usage

Without passing any flags, you can get all the flags from the Flagster instance.

import { useFlags } from 'flagster-react';
 
const MyComponent = () => {
  const flags = useFlags();
 
  if(flags.github_auth) {
    console.log('GitHub Auth is enabled');
  }
 
  return (
    <div>
      {flags.github_auth ? <p>GitHub Auth is enabled</p> : <p>GitHub Auth is disabled</p>}
    </div>
  );
};

When passing some flags, you can get only the flags you want from the Flagster instance. This is useful when you only need a few flags in your component and optimize the performance.

import { useFlags } from 'flagster';
 
const MyComponent = () => {
  const flags = useFlags(['github_auth', 'sms_verification']);
 
  if(flags.github_auth) {
    console.log('GitHub Auth is enabled');
  }
 
  return (
    <div>
      {flags.github_auth ? <p>GitHub Auth is enabled</p> : <p>GitHub Auth is disabled</p>}
      {flags.sms_verification ? <p>SMS Verification is enabled</p> : <p>SMS Verification is disabled</p>}
    </div>
  );
};

On this page