Untitled

import React, { useEffect } from 'react';
import { GrowthBook, GrowthBookProvider } from '@growthbook/growthbook-react';



// TypeScript types for user attributes (adapt as needed)
interface UserAttributes {
  id: string;
  company: string;
}



// Create a typed GrowthBook instance
const gb = new GrowthBook({
  apiHost: "https://cdn.growthbook.io",
  clientKey: "sdk-abc123",
  enableDevMode: true,
  subscribeToChanges: true,
  trackingCallback: (experiment, result) => {
    console.log("Experiment Viewed", {
      experimentId: experiment.key,
      variationId: result.key,
    });
  },
});



interface AdroitGrowthbookProviderProps {
  user: UserAttributes;
  children?: React.ReactNode;
}



const accessToken = localStorage.getItem('accessToken')

const idToken = localStorage.getItem('idToken')



const AdroitGrowthbookProvider: React.FC<AdroitGrowthbookProviderProps> = ({ user, children }) => {
  useEffect(() => {
    gb.loadFeatures().catch(error => {
      console.error("Error loading features from GrowthBook:", error);
    });
  }, []);



  useEffect(() => {

// ini masih aku omongin sama mas fajar untuk tenant handlingnya gimana


    if (accessToken && idToken ) {
      gb.setAttributes({
        id: ambil id dari token,
        tenant: ambil tenant dari token,
      });
    }
  }, [user, accessToken, idToken]);



  return (
    <GrowthBookProvider growthbook={gb}>
      {children}
    </GrowthBookProvider>
  );
};



export default AdroitGrowthbookProvider;