famous-lifeguard-78870
06/14/2023, 4:50 PMfresh-football-47124
famous-lifeguard-78870
06/14/2023, 9:42 PMconst growthbook = new GrowthBook({
apiHost: "<https://cdn.growthbook.io>",
clientKey: "REDACTED",
enableDevMode: true,
trackingCallback: (experiment, result) => {
// TODO: Use your real analytics tracking system
console.log("Viewed Experiment", {
experimentId: experiment.key,
variationId: result.key
});
}
});
useEffect(()=>{
growthbook.loadFeatures({autoRefresh: true});
},[])
const useEasy = useFeatureIsOn('easylocation');
const f = useFeature("easylocation");
Then i get this :fresh-football-47124
famous-lifeguard-78870
06/14/2023, 11:14 PMfresh-football-47124
famous-lifeguard-78870
06/21/2023, 1:18 PMimport {useEffect, useRef, useState} from "react";
const useGb = (props = {}) => {
const {feature, fallbackValue, fallbackTimer = 200} = props;
const [ready,setReady] = useState(false);
const [featureDetail, setFeatureDetail] = useState(undefined);
const gbRef = useRef();
const timerRef = useRef();
const fallbackRef = useRef();
useEffect(()=>{
if(timerRef.current) {return}
timerRef.current = setInterval(()=>{
if(window._growthbook && window._growthbook?.ready) {
gbRef.current = window._growthbook;
setReady(true);
setFeatureDetail(gbRef.current.feature(feature));
clearInterval(timerRef.current)
}
},1000)
if(!!feature && !!fallbackValue) {
fallbackRef.current = setTimeout(() => {
var cur = undefined;
setFeatureDetail(val => {
if (!!val) {
return val;
} else {
return {value: fallbackValue, isFallback: true}
}
})
}, [fallbackTimer])
}
return () => {
if(timerRef.current) {
clearInterval(timerRef.current)
}
if(fallbackRef) {
clearTimeout(fallbackRef);
}
}
},[])
return {
growthbook: gbRef.current,
ready: ready,
value: featureDetail?.value,
detail: featureDetail
}
}
export default useGb;