``` yarn add flagsup-js ``` or ``` npm install flagsup-js ``` ### Integration - Docs: [Integration doc](https://confluence.teko.vn/display/PS/User+guide+for+setting+up+feature+flags) - Init client ``` import FlagSup from 'flagsup-js'; FlagSup.init(
npm install flagsup-js
yarn add flagsup-js
or
npm install flagsup-js
$3
- Docs: Integration doc
- Init client
import FlagSup from 'flagsup-js';
FlagSup.init({
target: "https://flagsup.tekoapis.com",
userId: "5f8e4768e00e4d12ba69ed3e7bf3e893" // optional, use IAM ID // pragma: whitelist secret
})
- To get flag status (and experiment info if available) for a specific user using User IAM ID
-
-
- To get flag status when user is not logged in (note: this will disable canary release, black/white list, experiment)
-
-
- Integrate with Tracker-js sdk for experiment metrics tracking
- Use batchEvaluateFlags to fetch all experiment flags
- Calls track("setLabelProp", FlagSup.getTrackerLabel(), FlagSup.getTrackerContent()) to store experiment branches
info
$3
`
import React, { useEffect } from 'react';
import FlagSup from 'flagsup-js';const App = () => {
useEffect(() => {
// Log user in with IAM
// ...
// Initialisation, provide FlagSup SDK with target domain and userId from IAM (if available)
FlagSup.init({
target: "https://flagsup.tekoapis.com",
userId: "5f8e4768e00e4d12ba69ed3e7bf3e893", // optional // pragma: whitelist secret
useCacheRefresh: true, // optional, whether to use batch to refresh cache
refreshInterval: refreshInterval, // optional, set refresh interval (secs) for cache
})
// Use getFlag() and batchGetFlags() for flows without/before getting user IAM ID
// Option 1: Get flags with User ID
// Fetch multiple flag values for the logged in user. Response is cached in memory for subsequent calls.
// Refresh every
FlagSup.batchEvaluateFlags(
['flag01', 'flag03'], // Flags to evaluate
false, // Default status
"default_treatment", // Default treatment, for experiment only
0, // Default experiment ID, for experiment only
0, // Default experiment branch ID, for experiment only
).then((flags) => {
console.log(flags)
}); // (Optional) Update tracker JS SDK with experiment branch IDs
track("setLabelProp", FlagSup.getTrackerLabel(), FlagSup.getTrackerContent())
// Fetch a flag value for the logged in user. Response is cached in memory for subsequent calls.
// Refresh every
FlagSup.evaluateFlag(
'flag01', // flag to evaluate
false, // Default status
"default_treatment", // Default treatment, for experiment only
0, // Default experiment ID, for experiment only
0, // Default experiment branch ID, for experiment only
).then((flag) => {
console.log(flag);
if (flag.enabled) {
// Flow when flag is enabled
}
else {
// Flow when flag is disabled
}
}); // Option 2: Get flags without User ID
// Note: it is recommended to use this ONLY when you don't have user IAM ID
// Fetch multiple flag values. Response is cached in memory for subsequent calls. Refresh with
// To reduce network overhead, call this to fetch all flags when your app initialise
FlagSup.batchGetFlags(
['flag01', 'flag02'], // Flags to evaluate
false, // Default status
).then((flags) => {
console.log(flags)
});
// Fetch a single flag value. Response is cached in memory for subsequent calls.
FlagSup.getFlag(
'flag01', // Flags to evaluate
false, // Default status
).then((flag) => {
console.log(flag);
if (flag.enabled) {
// Flow when flag is enabled
}
else {
// Flow when flag is disabled
}
});
// Flags are cached locally. To flush, use FlagSup.flushFlags()
}, [])
return (
);
}export default App;