@statsig/react-bindings 0.0.1-beta.35 → 0.0.1-beta.37

package/README.md

@@ -1,8 +1,5 @@
 # Statsig - React
 
-> [!IMPORTANT]
-> This version of the SDK is still in beta. The non-beta version can be found [here](https://github.com/statsig-io/react-sdk).
-
 ReactJS specific additions for use with a Statsig Javascript SDK.
 
 Learn more by visiting: https://docs.statsig.com/client/javascript-sdk

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@statsig/react-bindings",
-  "version": "0.0.1-beta.35",
+  "version": "0.0.1-beta.37",
   "dependencies": {
-    "@statsig/client-core": "0.0.1-beta.35"
+    "@statsig/client-core": "0.0.1-beta.37"
   },
   "peerDependencies": {
     "react": "^16.6.3 || ^17.0.0 || ^18.0.0"

package/src/NoopEvaluationsClient.js

@@ -56,7 +56,10 @@ const _client = {
     updateUserAsync: _noopAsync,
     getContext: () => (Object.assign({}, context)),
     getAsyncContext: () => __awaiter(void 0, void 0, void 0, function* () {
-        return (Object.assign(Object.assign({}, context), { sessionID: '', stableID: '' }));
+        return (Object.assign(Object.assign({}, context), { session: {
+                data: { sessionID: '', startTime: 0, lastUpdate: 0 },
+                sdkKey: '',
+            }, stableID: '' }));
     }),
     checkGate: () => false,
     getFeatureGate: _defaultEvaluation('gate'),
@@ -66,7 +69,8 @@ const _client = {
     logEvent: _noop,
     on: _noop,
     off: _noop,
-    __on: _noop,
+    $on: _noop,
+    $emt: _noop,
     dataAdapter: _noopDataAdapter,
 };
 exports.NoopEvaluationsClient = _client;

package/src/StatsigProvider.js

@@ -12,7 +12,7 @@ function StatsigProvider({ client, children, }) {
             setRenderVersion((v) => v + 1);
         };
         client_core_1.SDKType._setBindingType('react');
-        client.__on('values_updated', onValuesUpdated);
+        client.$on('values_updated', onValuesUpdated);
         return () => {
             client.shutdown().catch((error) => {
                 client_core_1.Log.error('An error occured during shutdown', error);

package/src/useDynamicConfig.js

@@ -16,6 +16,6 @@ function default_1(configName, options) {
         }
         client_core_1.Log.warn(`useDynamicConfig hook failed to find a valid Statsig client for dynamic config '${configName}'.`);
         return NoopEvaluationsClient_1.NoopEvaluationsClient.getDynamicConfig(configName, options);
-    }, [configName, renderVersion, options]);
+    }, [configName, client, renderVersion, options]);
 }
 exports.default = default_1;

package/src/useExperiment.js

@@ -16,6 +16,6 @@ function default_1(experimentName, options) {
         }
         client_core_1.Log.warn(`useExperiment hook failed to find a valid Statsig client for experiment '${experimentName}'.`);
         return NoopEvaluationsClient_1.NoopEvaluationsClient.getExperiment(experimentName, options);
-    }, [experimentName, renderVersion, options]);
+    }, [experimentName, client, renderVersion, options]);
 }
 exports.default = default_1;

package/src/useFeatureGate.js

@@ -16,7 +16,7 @@ function default_1(gateName, options) {
         }
         client_core_1.Log.warn(`useFeatureGate hook failed to find a valid Statsig client for gate '${gateName}'.`);
         return NoopEvaluationsClient_1.NoopEvaluationsClient.getFeatureGate(gateName, options);
-    }, [gateName, renderVersion, options]);
+    }, [gateName, client, renderVersion, options]);
     return gate;
 }
 exports.default = default_1;

package/src/useGateValue.js

@@ -16,7 +16,7 @@ function default_1(gateName, options) {
         }
         client_core_1.Log.warn(`useFeatureGate hook failed to find a valid Statsig client for gate '${gateName}'.`);
         return NoopEvaluationsClient_1.NoopEvaluationsClient.checkGate(gateName, options);
-    }, [gateName, renderVersion, options]);
+    }, [gateName, client, renderVersion, options]);
     return gate;
 }
 exports.default = default_1;

package/src/useLayer.js

@@ -16,7 +16,7 @@ function default_1(layerName, options) {
         }
         client_core_1.Log.warn(`useLayer hook failed to find a valid Statsig client for layer '${layerName}'.`);
         return NoopEvaluationsClient_1.NoopEvaluationsClient.getLayer(layerName, options);
-    }, [layerName, renderVersion, options]);
+    }, [layerName, client, renderVersion, options]);
     return layer;
 }
 exports.default = default_1;

package/src/useStatsigClient.d.ts

@@ -1,2 +1,6 @@
 import { PrecomputedEvaluationsInterface } from '@statsig/client-core';
-export declare function useStatsigClient(): PrecomputedEvaluationsInterface;
+type HositedFuncs = Pick<PrecomputedEvaluationsInterface, 'checkGate' | 'getFeatureGate' | 'getDynamicConfig' | 'getExperiment' | 'getLayer' | 'logEvent'>;
+export declare function useStatsigClient(): HositedFuncs & {
+    client: PrecomputedEvaluationsInterface;
+};
+export {};

package/src/useStatsigClient.js

@@ -7,11 +7,38 @@ const NoopEvaluationsClient_1 = require("./NoopEvaluationsClient");
 const OnDeviceVsPrecomputedUtils_1 = require("./OnDeviceVsPrecomputedUtils");
 const StatsigContext_1 = require("./StatsigContext");
 function useStatsigClient() {
-    const { client } = (0, react_1.useContext)(StatsigContext_1.default);
-    if ((0, OnDeviceVsPrecomputedUtils_1.isPrecomputedEvalClient)(client)) {
-        return client;
-    }
-    client_core_1.Log.warn('Attempting to retrive a Statsig StatsigClient but none was set.');
-    return NoopEvaluationsClient_1.NoopEvaluationsClient;
+    const { client: anyClient, renderVersion } = (0, react_1.useContext)(StatsigContext_1.default);
+    const client = (0, react_1.useMemo)(() => {
+        if ((0, OnDeviceVsPrecomputedUtils_1.isPrecomputedEvalClient)(anyClient)) {
+            return anyClient;
+        }
+        client_core_1.Log.warn('Attempting to retrieve a StatsigClient but none was set.');
+        return NoopEvaluationsClient_1.NoopEvaluationsClient;
+    }, [anyClient, renderVersion]);
+    const deps = [client, renderVersion];
+    return {
+        client,
+        checkGate: (0, react_1.useCallback)((name, options) => {
+            return client.checkGate(name, options);
+        }, deps),
+        getFeatureGate: (0, react_1.useCallback)((name, options) => {
+            return client.getFeatureGate(name, options);
+        }, deps),
+        getDynamicConfig: (0, react_1.useCallback)((name, options) => {
+            return client.getDynamicConfig(name, options);
+        }, deps),
+        getExperiment: (0, react_1.useCallback)((name, options) => {
+            return client.getExperiment(name, options);
+        }, deps),
+        getLayer: (0, react_1.useCallback)((name, options) => {
+            return client.getLayer(name, options);
+        }, deps),
+        logEvent: (0, react_1.useCallback)((eventName, value, metadata) => {
+            if (typeof eventName === 'string') {
+                return client.logEvent(eventName, value, metadata);
+            }
+            return client.logEvent(eventName);
+        }, deps),
+    };
 }
 exports.useStatsigClient = useStatsigClient;

package/src/useStatsigOnDeviceEvalClient.d.ts

@@ -1,2 +1,6 @@
 import { OnDeviceEvaluationsInterface } from '@statsig/client-core';
-export declare function useStatsigOnDeviceEvalClient(): OnDeviceEvaluationsInterface;
+type HositedFuncs = Pick<OnDeviceEvaluationsInterface, 'checkGate' | 'getFeatureGate' | 'getDynamicConfig' | 'getExperiment' | 'getLayer' | 'logEvent'>;
+export declare function useStatsigOnDeviceEvalClient(): HositedFuncs & {
+    client: OnDeviceEvaluationsInterface;
+};
+export {};

package/src/useStatsigOnDeviceEvalClient.js

@@ -7,11 +7,38 @@ const NoopEvaluationsClient_1 = require("./NoopEvaluationsClient");
 const OnDeviceVsPrecomputedUtils_1 = require("./OnDeviceVsPrecomputedUtils");
 const StatsigContext_1 = require("./StatsigContext");
 function useStatsigOnDeviceEvalClient() {
-    const { client } = (0, react_1.useContext)(StatsigContext_1.default);
-    if (!(0, OnDeviceVsPrecomputedUtils_1.isPrecomputedEvalClient)(client)) {
-        return client;
-    }
-    client_core_1.Log.warn('Attempting to retrive a Statsig StatsigOnDeviceEvalClient but none was set.');
-    return NoopEvaluationsClient_1.NoopEvaluationsClient;
+    const { client: anyClient, renderVersion } = (0, react_1.useContext)(StatsigContext_1.default);
+    const client = (0, react_1.useMemo)(() => {
+        if (!(0, OnDeviceVsPrecomputedUtils_1.isPrecomputedEvalClient)(anyClient)) {
+            return anyClient;
+        }
+        client_core_1.Log.warn('Attempting to retrieve a StatsigOnDeviceEvalClient but none was set.');
+        return NoopEvaluationsClient_1.NoopEvaluationsClient;
+    }, [anyClient, renderVersion]);
+    const deps = [client, renderVersion];
+    return {
+        client,
+        checkGate: (0, react_1.useCallback)((name, options) => {
+            return client.checkGate(name, options);
+        }, deps),
+        getFeatureGate: (0, react_1.useCallback)((name, options) => {
+            return client.getFeatureGate(name, options);
+        }, deps),
+        getDynamicConfig: (0, react_1.useCallback)((name, options) => {
+            return client.getDynamicConfig(name, options);
+        }, deps),
+        getExperiment: (0, react_1.useCallback)((name, options) => {
+            return client.getExperiment(name, options);
+        }, deps),
+        getLayer: (0, react_1.useCallback)((name, options) => {
+            return client.getLayer(name, options);
+        }, deps),
+        logEvent: (0, react_1.useCallback)((eventName, user, value, metadata) => {
+            if (typeof eventName === 'string') {
+                return client.logEvent(eventName, user, value, metadata);
+            }
+            return client.logEvent(eventName, user);
+        }, deps),
+    };
 }
 exports.useStatsigOnDeviceEvalClient = useStatsigOnDeviceEvalClient;

package/src/useStatsigUser.d.ts

@@ -1,7 +1,12 @@
 import { StatsigUser } from '@statsig/client-core';
+type UpdaterArg = StatsigUser | ((previous: StatsigUser) => StatsigUser);
+type UpdaterFunc<T> = (updated: UpdaterArg) => T;
+type SyncUpdateFunc = UpdaterFunc<void>;
+type AsyncUpdateFunc = UpdaterFunc<Promise<void>>;
 export type UseStatsigUserResult = {
     user: StatsigUser;
-    updateUserSync: (fn: (prevState: StatsigUser) => StatsigUser) => void;
-    updateUserAsync: (fn: (prevState: StatsigUser) => StatsigUser) => Promise<void>;
+    updateUserSync: SyncUpdateFunc;
+    updateUserAsync: AsyncUpdateFunc;
 };
 export declare function useStatsigUser(): UseStatsigUserResult;
+export {};

package/src/useStatsigUser.js

@@ -5,22 +5,27 @@ const react_1 = require("react");
 const StatsigContext_1 = require("./StatsigContext");
 const useStatsigClient_1 = require("./useStatsigClient");
 function useStatsigUser() {
-    const client = (0, useStatsigClient_1.useStatsigClient)();
+    const { client } = (0, useStatsigClient_1.useStatsigClient)();
     const { renderVersion } = (0, react_1.useContext)(StatsigContext_1.default);
+    const deps = [client, renderVersion];
     const memoUser = (0, react_1.useMemo)(() => {
         const context = client.getContext();
         return context.user;
-    }, [client, renderVersion]);
+    }, deps);
     return {
         user: memoUser,
-        updateUserSync: (fn) => {
-            const user = fn(memoUser);
-            client.updateUserSync(user);
-        },
-        updateUserAsync: (fn) => {
-            const user = fn(memoUser);
-            return client.updateUserAsync(user);
-        },
+        updateUserSync: (0, react_1.useCallback)((arg) => {
+            if (typeof arg === 'function') {
+                arg = arg(memoUser);
+            }
+            client.updateUserSync(arg);
+        }, deps),
+        updateUserAsync: (0, react_1.useCallback)((arg) => {
+            if (typeof arg === 'function') {
+                arg = arg(memoUser);
+            }
+            return client.updateUserAsync(arg);
+        }, deps),
     };
 }
 exports.useStatsigUser = useStatsigUser;