flipflag-sdk 1.1.0

package/dist/react.js

@@ -0,0 +1,634 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+class FlipFlagSDK {
+    constructor(config) {
+        this.cache = new Map();
+        this.defaultBaseUrl = "https://app.flipflag.ru/api";
+        this.stateListeners = new Set();
+        this.config = {
+            baseUrl: this.defaultBaseUrl,
+            cacheTimeout: 30000, // 30 seconds
+            retryAttempts: 3,
+            retryDelay: 1000, // 1 second
+            pullInterval: 60000, // 1 minute
+            ...config,
+        };
+        this.state = {
+            flags: {},
+            abTests: {},
+            lastFetch: null,
+            isLoading: false,
+            error: null,
+        };
+        // Start automatic pulling if pullInterval is set
+        if (this.config.pullInterval && this.config.pullInterval > 0) {
+            this.startPulling();
+        }
+    }
+    /**
+     * Identify user for A/B testing and user-specific flags
+     */
+    identifyUser(options) {
+        this.config.userId = options.userId;
+        // Clear A/B test cache since user changed
+        this.clearABTestCache();
+        // If we have a user, we might want to refresh immediately
+        if (this.config.pullInterval && this.config.pullInterval > 0) {
+            this.pullData();
+        }
+    }
+    /**
+     * Get current SDK state
+     */
+    getState() {
+        return { ...this.state };
+    }
+    /**
+     * Subscribe to state changes
+     */
+    subscribe(callback) {
+        this.stateListeners.add(callback);
+        // Return unsubscribe function
+        return () => {
+            this.stateListeners.delete(callback);
+        };
+    }
+    /**
+     * Get a feature flag value from current state
+     */
+    getFlagValue(flagName) {
+        var _a;
+        return (_a = this.state.flags[flagName]) !== null && _a !== void 0 ? _a : false;
+    }
+    /**
+     * Get A/B test variant from current state
+     */
+    getABTestVariant(testName) {
+        return this.state.abTests[testName] || null;
+    }
+    /**
+     * Start automatic data pulling
+     */
+    startPulling() {
+        if (this.pullIntervalId) {
+            clearInterval(this.pullIntervalId);
+        }
+        this.pullIntervalId = setInterval(() => {
+            this.pullData();
+        }, this.config.pullInterval);
+        // Initial pull
+        this.pullData();
+    }
+    /**
+     * Stop automatic data pulling
+     */
+    stopPulling() {
+        if (this.pullIntervalId) {
+            clearInterval(this.pullIntervalId);
+            this.pullIntervalId = undefined;
+        }
+    }
+    /**
+     * Pull fresh data from API
+     */
+    async pullData() {
+        try {
+            this.updateState({ isLoading: true, error: null });
+            // Pull flags
+            const flagsResponse = await this.fetchAllFlags();
+            // Pull A/B tests if user is identified
+            let abTestsResponse = null;
+            if (this.config.userId) {
+                try {
+                    abTestsResponse = await this.fetchAllABTests();
+                }
+                catch (error) {
+                    console.warn("Failed to fetch A/B tests:", error);
+                }
+            }
+            const newState = {
+                flags: (flagsResponse === null || flagsResponse === void 0 ? void 0 : flagsResponse.flags) || {},
+                lastFetch: new Date(),
+                isLoading: false,
+                error: null,
+            };
+            if (abTestsResponse) {
+                const abTestsMap = {};
+                abTestsResponse.abTests.forEach((test) => {
+                    // For each test, get the variant for current user
+                    if (this.config.userId) {
+                        // This would normally fetch the variant, but for demo we'll simulate
+                        abTestsMap[test.name] = {
+                            testName: test.name,
+                            testId: test.id,
+                            variantId: "variant_a", // Default variant
+                            variant: test.variants[0] || {
+                                id: "default",
+                                name: "Default",
+                                value: null,
+                                weight: 100,
+                            },
+                            timestamp: new Date().toISOString(),
+                        };
+                    }
+                });
+                newState.abTests = abTestsMap;
+            }
+            this.updateState(newState);
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error ? error.message : "Unknown error";
+            this.updateState({
+                isLoading: false,
+                error: errorMessage,
+            });
+            console.error("Failed to pull data:", error);
+        }
+    }
+    /**
+     * Update state and notify listeners
+     */
+    updateState(newState) {
+        this.state = { ...this.state, ...newState };
+        // Notify all listeners
+        this.stateListeners.forEach((callback) => {
+            try {
+                callback(this.state);
+            }
+            catch (error) {
+                console.error("State listener error:", error);
+            }
+        });
+    }
+    /**
+     * Fetch all flags from API
+     */
+    async fetchAllFlags() {
+        try {
+            return await this.makeRequest(`/sdk/flags/${this.config.projectId}`);
+        }
+        catch (error) {
+            console.error("Failed to fetch flags:", error);
+            return null;
+        }
+    }
+    /**
+     * Fetch all A/B tests from API
+     */
+    async fetchAllABTests() {
+        try {
+            return await this.makeRequest(`/sdk/ab-tests/${this.config.projectId}`);
+        }
+        catch (error) {
+            console.error("Failed to fetch A/B tests:", error);
+            return null;
+        }
+    }
+    /**
+     * Clear A/B test cache
+     */
+    clearABTestCache() {
+        const abTestKeys = Array.from(this.cache.keys()).filter((key) => key.startsWith("abtest:"));
+        abTestKeys.forEach((key) => this.cache.delete(key));
+    }
+    /**
+     * Get all feature flags for a project
+     */
+    async getFlags(projectId = this.config.projectId, environment) {
+        const cacheKey = `flags:${projectId}:${environment || "all"}`;
+        const cached = this.getFromCache(cacheKey);
+        if (cached) {
+            return cached;
+        }
+        const url = new URL(`/sdk/flags/${projectId}`, this.config.baseUrl);
+        if (environment || this.config.environment) {
+            url.searchParams.set("environment", environment || this.config.environment);
+        }
+        const response = await this.makeRequest(url.toString());
+        this.setCache(cacheKey, response, this.config.cacheTimeout);
+        return response;
+    }
+    /**
+     * Get a specific feature flag value
+     */
+    async getFlag(flagName, projectId = this.config.projectId, environment) {
+        var _a;
+        // If we have the flag in state, return it immediately
+        if (this.state.flags[flagName] !== undefined) {
+            return {
+                projectId: this.config.projectId,
+                flagName,
+                environment: this.config.environment || "all",
+                value: this.state.flags[flagName],
+                timestamp: ((_a = this.state.lastFetch) === null || _a === void 0 ? void 0 : _a.toISOString()) || new Date().toISOString(),
+            };
+        }
+        const cacheKey = `flag:${projectId}:${flagName}:${environment || "all"}`;
+        const cached = this.getFromCache(cacheKey);
+        if (cached) {
+            return cached;
+        }
+        const url = new URL(`/sdk/flags/${projectId}/${flagName}`, this.config.baseUrl);
+        if (environment || this.config.environment) {
+            url.searchParams.set("environment", environment || this.config.environment);
+        }
+        const response = await this.makeRequest(url.toString());
+        this.setCache(cacheKey, response, this.config.cacheTimeout);
+        return response;
+    }
+    /**
+     * Get A/B test variant for a user
+     */
+    async getAbTestVariant(testName, userId, projectId = this.config.projectId) {
+        // If we have the A/B test in state, return it immediately
+        const stateVariant = this.state.abTests[testName];
+        if (stateVariant && stateVariant.testName === testName) {
+            return stateVariant;
+        }
+        const cacheKey = `abtest:${projectId}:${testName}:${userId}`;
+        const cached = this.getFromCache(cacheKey);
+        if (cached) {
+            return cached;
+        }
+        const url = `${this.config.baseUrl}/sdk/ab-test/${projectId}/${testName}`;
+        const response = await this.makeRequest(url, {
+            headers: {
+                "X-User-ID": userId,
+            },
+        });
+        // Cache A/B test variants for longer since they shouldn't change frequently for a user
+        this.setCache(cacheKey, response, this.config.cacheTimeout * 10);
+        return response;
+    }
+    /**
+     * Record an A/B test event
+     */
+    async recordAbTestEvent(testName, userId, event, variantId, eventData, projectId = this.config.projectId) {
+        const url = `${this.config.baseUrl}/sdk/ab-test/${projectId}/${testName}/event`;
+        return this.makeRequest(url, {
+            method: "POST",
+            headers: {
+                "X-User-ID": userId,
+                "Content-Type": "application/json",
+            },
+            body: JSON.stringify({
+                event,
+                variantId,
+                eventData,
+            }),
+        });
+    }
+    /**
+     * Get all A/B tests for a project
+     */
+    async getAbTests(projectId = this.config.projectId) {
+        const cacheKey = `abtests:${projectId}`;
+        const cached = this.getFromCache(cacheKey);
+        if (cached) {
+            return cached;
+        }
+        const url = `${this.config.baseUrl}/sdk/ab-tests/${projectId}`;
+        const response = await this.makeRequest(url);
+        this.setCache(cacheKey, response, this.config.cacheTimeout);
+        return response;
+    }
+    /**
+     * Clear cache for specific key or all cache
+     */
+    clearCache(key) {
+        if (key) {
+            this.cache.delete(key);
+        }
+        else {
+            this.cache.clear();
+        }
+    }
+    /**
+     * Update configuration
+     */
+    updateConfig(newConfig) {
+        this.config = { ...this.config, ...newConfig };
+    }
+    async makeRequest(url, options = {}) {
+        const headers = {
+            "X-API-Key": this.config.apiKey,
+            "Content-Type": "application/json",
+            ...options.headers,
+        };
+        const requestOptions = {
+            ...options,
+            headers,
+        };
+        return this.makeRequestWithRetry(url, requestOptions);
+    }
+    async makeRequestWithRetry(url, options, retryOptions = {
+        attempts: this.config.retryAttempts,
+        delay: this.config.retryDelay,
+        backoff: 2,
+    }) {
+        let lastError;
+        for (let attempt = 1; attempt <= retryOptions.attempts; attempt++) {
+            try {
+                const response = await fetch(url, options);
+                if (!response.ok) {
+                    const errorData = await response.json().catch(() => ({}));
+                    throw new Error(`HTTP ${response.status}: ${errorData.error || response.statusText}`);
+                }
+                return await response.json();
+            }
+            catch (error) {
+                lastError = error;
+                // Don't retry on client errors (4xx) except 429 (rate limit)
+                if (error instanceof Error && error.message.includes("HTTP 4")) {
+                    if (!error.message.includes("HTTP 429")) {
+                        throw error;
+                    }
+                }
+                if (attempt < retryOptions.attempts) {
+                    const delay = retryOptions.delay * Math.pow(retryOptions.backoff, attempt - 1);
+                    await new Promise((resolve) => setTimeout(resolve, delay));
+                }
+            }
+        }
+        throw lastError;
+    }
+    getFromCache(key) {
+        const entry = this.cache.get(key);
+        if (!entry) {
+            return null;
+        }
+        if (Date.now() - entry.timestamp > entry.ttl) {
+            this.cache.delete(key);
+            return null;
+        }
+        return entry.data;
+    }
+    setCache(key, data, ttl) {
+        this.cache.set(key, {
+            data,
+            timestamp: Date.now(),
+            ttl,
+        });
+    }
+    /**
+     * Cleanup method - should be called when SDK is no longer needed
+     */
+    destroy() {
+        this.stopPulling();
+        this.stateListeners.clear();
+        this.cache.clear();
+    }
+}
+
+const FeatureFlagContext = react.createContext(null);
+function FeatureFlagProvider({ children, config, }) {
+    const sdk = new FlipFlagSDK(config);
+    const contextValue = {
+        sdk,
+        config,
+    };
+    return (jsxRuntime.jsx(FeatureFlagContext.Provider, { value: contextValue, children: children }));
+}
+function useFeatureFlagContext() {
+    const context = react.useContext(FeatureFlagContext);
+    if (!context) {
+        throw new Error("useFeatureFlagContext must be used within a FeatureFlagProvider");
+    }
+    return context;
+}
+
+function useFeatureFlag(flagName, options = {}) {
+    var _a;
+    const [value, setValue] = react.useState((_a = options.fallbackValue) !== null && _a !== void 0 ? _a : false);
+    const [loading, setLoading] = react.useState(true);
+    const [error, setError] = react.useState(null);
+    // Try to get SDK from context, otherwise create new instance
+    let sdk;
+    try {
+        const context = useFeatureFlagContext();
+        sdk = context.sdk;
+    }
+    catch (_b) {
+        if (!options.config) {
+            throw new Error("useFeatureFlag must be used within FeatureFlagProvider or config must be provided");
+        }
+        sdk = new FlipFlagSDK(options.config);
+    }
+    const updateFromState = react.useCallback(() => {
+        if (!options.enabled && options.enabled !== undefined) {
+            return;
+        }
+        try {
+            const flagValue = sdk.getFlagValue(flagName);
+            setValue(flagValue);
+            setLoading(false);
+            setError(null);
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : "Unknown error";
+            setError(errorMessage);
+            // Use fallback value if provided
+            if (options.fallbackValue !== undefined) {
+                setValue(options.fallbackValue);
+            }
+            setLoading(false);
+        }
+    }, [sdk, flagName, options.fallbackValue, options.enabled]);
+    const refetch = react.useCallback(async () => {
+        // Clear cache for this specific flag and force refresh
+        sdk.clearCache(`flag:${sdk["config"].projectId}:${flagName}:${sdk["config"].environment || "all"}`);
+        setLoading(true);
+        try {
+            const response = await sdk.getFlag(flagName);
+            setValue(response.value);
+            setError(null);
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : "Unknown error";
+            setError(errorMessage);
+            if (options.fallbackValue !== undefined) {
+                setValue(options.fallbackValue);
+            }
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [sdk, flagName, options.fallbackValue]);
+    react.useEffect(() => {
+        // Subscribe to state changes
+        const unsubscribe = sdk.subscribe((state) => {
+            if (!options.enabled && options.enabled !== undefined) {
+                return;
+            }
+            const flagValue = state.flags[flagName];
+            if (flagValue !== undefined) {
+                setValue(flagValue);
+                setLoading(false);
+                setError(state.error);
+            }
+        });
+        // Initial update from current state
+        updateFromState();
+        return unsubscribe;
+    }, [updateFromState, options.enabled]);
+    return {
+        value,
+        loading,
+        error,
+        refetch,
+    };
+}
+
+function useFeatureFlags(flagNames, options = {}) {
+    const [flags, setFlags] = react.useState(() => {
+        // Initialize with fallback values
+        const initialFlags = {};
+        flagNames.forEach((flagName) => {
+            var _a, _b;
+            initialFlags[flagName] = (_b = (_a = options.fallbackValues) === null || _a === void 0 ? void 0 : _a[flagName]) !== null && _b !== void 0 ? _b : false;
+        });
+        return initialFlags;
+    });
+    const [loading, setLoading] = react.useState(true);
+    const [error, setError] = react.useState(null);
+    // Try to get SDK from context, otherwise create new instance
+    let sdk;
+    try {
+        const context = useFeatureFlagContext();
+        sdk = context.sdk;
+    }
+    catch (_a) {
+        if (!options.config) {
+            throw new Error("useFeatureFlags must be used within FeatureFlagProvider or config must be provided");
+        }
+        sdk = new FlipFlagSDK(options.config);
+    }
+    const fetchFlags = react.useCallback(async () => {
+        if (!options.enabled && options.enabled !== undefined) {
+            return;
+        }
+        try {
+            setLoading(true);
+            setError(null);
+            const response = await sdk.getFlags();
+            const newFlags = { ...flags };
+            flagNames.forEach((flagName) => {
+                var _a, _b, _c;
+                // Use API value if available, otherwise fallback
+                newFlags[flagName] =
+                    (_c = (_a = response.flags[flagName]) !== null && _a !== void 0 ? _a : (_b = options.fallbackValues) === null || _b === void 0 ? void 0 : _b[flagName]) !== null && _c !== void 0 ? _c : false;
+            });
+            setFlags(newFlags);
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : "Unknown error";
+            setError(errorMessage);
+            // Use fallback values
+            const fallbackFlags = {};
+            flagNames.forEach((flagName) => {
+                var _a, _b;
+                fallbackFlags[flagName] = (_b = (_a = options.fallbackValues) === null || _a === void 0 ? void 0 : _a[flagName]) !== null && _b !== void 0 ? _b : false;
+            });
+            setFlags(fallbackFlags);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [sdk, flagNames, options.fallbackValues, options.enabled, flags]);
+    const refetch = react.useCallback(async () => {
+        // Clear cache for flags
+        sdk.clearCache(`flags:${sdk["config"].projectId}:${sdk["config"].environment || "all"}`);
+        await fetchFlags();
+    }, [sdk, fetchFlags]);
+    react.useEffect(() => {
+        fetchFlags();
+    }, [fetchFlags]);
+    return {
+        flags,
+        loading,
+        error,
+        refetch,
+    };
+}
+
+function useABTest(testName, options) {
+    const [variant, setVariant] = react.useState(null);
+    const [variantId, setVariantId] = react.useState(null);
+    const [loading, setLoading] = react.useState(true);
+    const [error, setError] = react.useState(null);
+    // Try to get SDK from context, otherwise create new instance
+    let sdk;
+    try {
+        const context = useFeatureFlagContext();
+        sdk = context.sdk;
+    }
+    catch (_a) {
+        if (!options.config) {
+            throw new Error("useABTest must be used within FeatureFlagProvider or config must be provided");
+        }
+        sdk = new FlipFlagSDK(options.config);
+    }
+    const fetchVariant = react.useCallback(async () => {
+        if (!options.enabled && options.enabled !== undefined) {
+            return;
+        }
+        try {
+            setLoading(true);
+            setError(null);
+            const response = await sdk.getAbTestVariant(testName, options.userId);
+            setVariant(response.variant.value);
+            setVariantId(response.variantId);
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : "Unknown error";
+            setError(errorMessage);
+            setVariant(null);
+            setVariantId(null);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [sdk, testName, options.userId, options.enabled]);
+    const recordEvent = react.useCallback(async (event, eventData) => {
+        if (!variantId) {
+            console.warn("Cannot record event: no variant assigned yet");
+            return;
+        }
+        try {
+            await sdk.recordAbTestEvent(testName, options.userId, event, variantId, eventData);
+        }
+        catch (err) {
+            console.error("Failed to record A/B test event:", err);
+        }
+    }, [sdk, testName, options.userId, variantId]);
+    react.useEffect(() => {
+        fetchVariant();
+    }, [fetchVariant]);
+    return {
+        variant,
+        variantId,
+        loading,
+        error,
+        recordEvent,
+    };
+}
+
+/**
+ * Identify user for A/B testing and user-specific flags
+ * Must be called within FeatureFlagProvider
+ */
+function identifyUser(options) {
+    const context = useFeatureFlagContext();
+    context.sdk.identifyUser(options);
+}
+
+exports.FeatureFlagProvider = FeatureFlagProvider;
+exports.identifyUser = identifyUser;
+exports.useABTest = useABTest;
+exports.useFeatureFlag = useFeatureFlag;
+exports.useFeatureFlagContext = useFeatureFlagContext;
+exports.useFeatureFlags = useFeatureFlags;
+//# sourceMappingURL=react.js.map