@ninetailed/experience.js-react 4.4.0-beta.1 → 4.5.0-beta.1

package/index.cjs

@@ -1929,6 +1929,23 @@ const useProfile = () => {
   });
 };
 
+const ExperimentsContext = /*#__PURE__*/React.createContext(undefined);
+
+const useExperimentsContext = () => {
+  const context = React.useContext(ExperimentsContext);
+  if (context === undefined) {
+    throw new Error('The component using the the context must be a descendant of the ExperimentsProvider');
+  }
+  return context;
+};
+
+const useExperiments = () => {
+  const context = useExperimentsContext();
+  return {
+    experiments: context.experiments
+  };
+};
+
 const useExperienceSelectionMiddleware = ({
   experiences,
   baseline,
@@ -1963,6 +1980,9 @@ const useExperience = ({
   experiences
 }) => {
   const profileState = useProfile();
+  const {
+    experiments
+  } = useExperiments();
   const hasVariants = experiences.map(experience => experience_js.selectHasExperienceVariants(experience, baseline)).reduce((acc, curr) => acc || curr, false);
   const {
     status,
@@ -2019,7 +2039,7 @@ const useExperience = ({
     // @ts-ignore
     return overrideResult(emptyReturn);
   }
-  const activeExperiments = experience_js.selectActiveExperiments(experiences, profile);
+  const activeExperiments = experience_js.selectActiveExperiments(experiments, profile);
   const experience = experience_js.selectExperience({
     experiences,
     activeExperiments,
@@ -2062,16 +2082,6 @@ const useExperience = ({
   }));
 };
 
-const ExperimentsContext = /*#__PURE__*/React.createContext(undefined);
-
-const useExperimentsContext = () => {
-  const context = React.useContext(ExperimentsContext);
-  if (context === undefined) {
-    throw new Error('The component using the the context must be a descendant of the ExperimentsProvider');
-  }
-  return context;
-};
-
 const useJoinExperiment = () => {
   const context = useExperimentsContext();
   return context.joinExperiment;
@@ -2145,17 +2155,14 @@ const Experience = _a => {
   });
   const joinExperiment = useJoinExperiment();
   React.useEffect(() => {
-    if (status === 'success' && experience && experience.type === 'nt_experiment' && variant && profile) {
+    if (status === 'success' && experience && profile) {
       joinExperiment({
         experiences,
         experiment: experience,
-        variant: Object.assign(Object.assign({}, variant), {
-          hidden: 'hidden' in variant ? variant.hidden : false
-        }),
         profile
       });
     }
-  }, [status, experience, variant, profile]);
+  }, [status, experience, profile]);
   if (!hasVariants) {
     return /*#__PURE__*/React.createElement(Component, Object.assign({}, passthroughProps, baseline, {
       key: baseline.id
@@ -2315,13 +2322,15 @@ const debounce = (fn, wait) => {
     debouncedFn();
   };
 };
-// TODO: the majority of this code should be moved to the experience.js javascript package
-const useProvideJoinExperiment = _ => {
+const useProvideJoinExperiment = ({
+  experiments,
+  maximumActiveExperiments: _maximumActiveExperiments = 1
+}) => {
   const {
     identify
   } = useNinetailed();
   const joinExperimentIdentify = debounce(args => {
-    const traits = args.reduce((traits, [experimentJoinTraits]) => {
+    const traits = args.slice(0, _maximumActiveExperiments).reduce((traits, [experimentJoinTraits]) => {
       return Object.assign(Object.assign({}, experimentJoinTraits), traits);
     }, {});
     identify('', traits);
@@ -2329,7 +2338,6 @@ const useProvideJoinExperiment = _ => {
   return React.useCallback(data => __awaiter(void 0, void 0, void 0, function* () {
     const {
       experiment,
-      variant,
       profile
     } = data;
     const isExperiment = experiment.type === 'nt_experiment';
@@ -2337,17 +2345,17 @@ const useProvideJoinExperiment = _ => {
       experience_jsShared.logger.warn(`The experience ${experiment.id}, which you tried to join, is not an experiment.`);
       return;
     }
-    if (!experience_jsShared.isExperienceSticky(experiment)) {
-      experience_jsShared.logger.debug("Won't add experiment to traits, as it's not sticky.");
+    const activeExperiments = experience_js.selectActiveExperiments(experiments, profile);
+    if (activeExperiments.length >= _maximumActiveExperiments) {
+      experience_jsShared.logger.warn(`The maximum number of active experiments (${_maximumActiveExperiments}) has been reached.`);
       return;
     }
-    const activeExperimentIds = experience_jsShared.selectActiveExperimentIds(profile);
-    if (activeExperimentIds.some(activeExperimentId => activeExperimentId === experiment.id)) {
+    if (activeExperiments.some(activeExperiment => activeExperiment.id === experiment.id)) {
       experience_jsShared.logger.debug(`The user is already part of experiment ${experiment.id}. Won't join again.`);
       return;
     }
     joinExperimentIdentify({
-      [`${EXPERIENCE_TRAIT_PREFIX}${experiment.id}`]: variant.hidden ? 'hidden' : variant.id
+      [`${EXPERIENCE_TRAIT_PREFIX}${experiment.id}`]: true
     });
     experience_jsShared.logger.debug(`Sent event to join experiment ${experiment.id}.`);
   }), []);
@@ -2358,7 +2366,10 @@ const ExperimentsProvider = ({
   maximumActiveExperiments: _maximumActiveExperiments = 1,
   children
 }) => {
-  const joinExperiment = useProvideJoinExperiment();
+  const joinExperiment = useProvideJoinExperiment({
+    experiments,
+    maximumActiveExperiments: _maximumActiveExperiments
+  });
   return jsxRuntime.jsx(ExperimentsContext.Provider, Object.assign({
     value: {
       experiments,
@@ -2369,18 +2380,6 @@ const ExperimentsProvider = ({
   }));
 };
 
-/**
- * @deprecated
- *
- * This will get removed in v5 of the SDK.
- */
-const useExperiments = () => {
-  const context = useExperimentsContext();
-  return {
-    experiments: context.experiments
-  };
-};
-
 const NinetailedProvider = props => {
   const ninetailed = React.useMemo(() => {
     if ('ninetailed' in props) {
@@ -2396,7 +2395,8 @@ const NinetailedProvider = props => {
       requestTimeout,
       plugins = [],
       onLog,
-      onError
+      onError,
+      buildClientContext
     } = props;
     return new experience_js.Ninetailed({
       clientId,
@@ -2409,18 +2409,21 @@ const NinetailedProvider = props => {
       locale,
       requestTimeout,
       onLog,
-      onError
+      onError,
+      buildClientContext
     });
   }, []);
   const {
+    experiments = [],
+    maximumActiveExperiments,
     children
   } = props;
   return jsxRuntime.jsx(NinetailedContext.Provider, Object.assign({
     value: ninetailed
   }, {
     children: jsxRuntime.jsx(ExperimentsProvider, Object.assign({
-      experiments: [],
-      maximumActiveExperiments: 10000
+      experiments: experiments,
+      maximumActiveExperiments: maximumActiveExperiments
     }, {
       children: children
     }))

package/index.js

@@ -2,7 +2,7 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import React, { createContext, useContext, useEffect, useState, useRef, useMemo, createElement as createElement$1, useCallback } from 'react';
 import { selectDistribution, makeExperienceSelectMiddleware, selectHasExperienceVariants, selectActiveExperiments, selectExperience, selectExperienceVariant, Ninetailed, selectVariant } from '@ninetailed/experience.js';
 import { useInView } from 'react-intersection-observer';
-import { isBrowser, logger, isExperienceSticky, selectActiveExperimentIds } from '@ninetailed/experience.js-shared';
+import { isBrowser, logger } from '@ninetailed/experience.js-shared';
 import { isEqual, debounce as debounce$1, get as get$1 } from 'radash';
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -1921,6 +1921,23 @@ const useProfile = () => {
   });
 };
 
+const ExperimentsContext = /*#__PURE__*/createContext(undefined);
+
+const useExperimentsContext = () => {
+  const context = useContext(ExperimentsContext);
+  if (context === undefined) {
+    throw new Error('The component using the the context must be a descendant of the ExperimentsProvider');
+  }
+  return context;
+};
+
+const useExperiments = () => {
+  const context = useExperimentsContext();
+  return {
+    experiments: context.experiments
+  };
+};
+
 const useExperienceSelectionMiddleware = ({
   experiences,
   baseline,
@@ -1955,6 +1972,9 @@ const useExperience = ({
   experiences
 }) => {
   const profileState = useProfile();
+  const {
+    experiments
+  } = useExperiments();
   const hasVariants = experiences.map(experience => selectHasExperienceVariants(experience, baseline)).reduce((acc, curr) => acc || curr, false);
   const {
     status,
@@ -2011,7 +2031,7 @@ const useExperience = ({
     // @ts-ignore
     return overrideResult(emptyReturn);
   }
-  const activeExperiments = selectActiveExperiments(experiences, profile);
+  const activeExperiments = selectActiveExperiments(experiments, profile);
   const experience = selectExperience({
     experiences,
     activeExperiments,
@@ -2054,16 +2074,6 @@ const useExperience = ({
   }));
 };
 
-const ExperimentsContext = /*#__PURE__*/createContext(undefined);
-
-const useExperimentsContext = () => {
-  const context = useContext(ExperimentsContext);
-  if (context === undefined) {
-    throw new Error('The component using the the context must be a descendant of the ExperimentsProvider');
-  }
-  return context;
-};
-
 const useJoinExperiment = () => {
   const context = useExperimentsContext();
   return context.joinExperiment;
@@ -2137,17 +2147,14 @@ const Experience = _a => {
   });
   const joinExperiment = useJoinExperiment();
   useEffect(() => {
-    if (status === 'success' && experience && experience.type === 'nt_experiment' && variant && profile) {
+    if (status === 'success' && experience && profile) {
       joinExperiment({
         experiences,
         experiment: experience,
-        variant: Object.assign(Object.assign({}, variant), {
-          hidden: 'hidden' in variant ? variant.hidden : false
-        }),
         profile
       });
     }
-  }, [status, experience, variant, profile]);
+  }, [status, experience, profile]);
   if (!hasVariants) {
     return /*#__PURE__*/createElement$1(Component, Object.assign({}, passthroughProps, baseline, {
       key: baseline.id
@@ -2307,13 +2314,15 @@ const debounce = (fn, wait) => {
     debouncedFn();
   };
 };
-// TODO: the majority of this code should be moved to the experience.js javascript package
-const useProvideJoinExperiment = _ => {
+const useProvideJoinExperiment = ({
+  experiments,
+  maximumActiveExperiments: _maximumActiveExperiments = 1
+}) => {
   const {
     identify
   } = useNinetailed();
   const joinExperimentIdentify = debounce(args => {
-    const traits = args.reduce((traits, [experimentJoinTraits]) => {
+    const traits = args.slice(0, _maximumActiveExperiments).reduce((traits, [experimentJoinTraits]) => {
       return Object.assign(Object.assign({}, experimentJoinTraits), traits);
     }, {});
     identify('', traits);
@@ -2321,7 +2330,6 @@ const useProvideJoinExperiment = _ => {
   return useCallback(data => __awaiter(void 0, void 0, void 0, function* () {
     const {
       experiment,
-      variant,
       profile
     } = data;
     const isExperiment = experiment.type === 'nt_experiment';
@@ -2329,17 +2337,17 @@ const useProvideJoinExperiment = _ => {
       logger.warn(`The experience ${experiment.id}, which you tried to join, is not an experiment.`);
       return;
     }
-    if (!isExperienceSticky(experiment)) {
-      logger.debug("Won't add experiment to traits, as it's not sticky.");
+    const activeExperiments = selectActiveExperiments(experiments, profile);
+    if (activeExperiments.length >= _maximumActiveExperiments) {
+      logger.warn(`The maximum number of active experiments (${_maximumActiveExperiments}) has been reached.`);
       return;
     }
-    const activeExperimentIds = selectActiveExperimentIds(profile);
-    if (activeExperimentIds.some(activeExperimentId => activeExperimentId === experiment.id)) {
+    if (activeExperiments.some(activeExperiment => activeExperiment.id === experiment.id)) {
       logger.debug(`The user is already part of experiment ${experiment.id}. Won't join again.`);
       return;
     }
     joinExperimentIdentify({
-      [`${EXPERIENCE_TRAIT_PREFIX}${experiment.id}`]: variant.hidden ? 'hidden' : variant.id
+      [`${EXPERIENCE_TRAIT_PREFIX}${experiment.id}`]: true
     });
     logger.debug(`Sent event to join experiment ${experiment.id}.`);
   }), []);
@@ -2350,7 +2358,10 @@ const ExperimentsProvider = ({
   maximumActiveExperiments: _maximumActiveExperiments = 1,
   children
 }) => {
-  const joinExperiment = useProvideJoinExperiment();
+  const joinExperiment = useProvideJoinExperiment({
+    experiments,
+    maximumActiveExperiments: _maximumActiveExperiments
+  });
   return jsx(ExperimentsContext.Provider, Object.assign({
     value: {
       experiments,
@@ -2361,18 +2372,6 @@ const ExperimentsProvider = ({
   }));
 };
 
-/**
- * @deprecated
- *
- * This will get removed in v5 of the SDK.
- */
-const useExperiments = () => {
-  const context = useExperimentsContext();
-  return {
-    experiments: context.experiments
-  };
-};
-
 const NinetailedProvider = props => {
   const ninetailed = useMemo(() => {
     if ('ninetailed' in props) {
@@ -2388,7 +2387,8 @@ const NinetailedProvider = props => {
       requestTimeout,
       plugins = [],
       onLog,
-      onError
+      onError,
+      buildClientContext
     } = props;
     return new Ninetailed({
       clientId,
@@ -2401,18 +2401,21 @@ const NinetailedProvider = props => {
       locale,
       requestTimeout,
       onLog,
-      onError
+      onError,
+      buildClientContext
     });
   }, []);
   const {
+    experiments = [],
+    maximumActiveExperiments,
     children
   } = props;
   return jsx(NinetailedContext.Provider, Object.assign({
     value: ninetailed
   }, {
     children: jsx(ExperimentsProvider, Object.assign({
-      experiments: [],
-      maximumActiveExperiments: 10000
+      experiments: experiments,
+      maximumActiveExperiments: maximumActiveExperiments
     }, {
       children: children
     }))

package/lib/Experience/ExperimentsProvider.d.ts

@@ -1,17 +1,7 @@
 import React, { PropsWithChildren } from 'react';
 import { ExperienceConfiguration, Reference } from '@ninetailed/experience.js';
 type ExperimentsProviderProps<Variant extends Reference> = React.PropsWithChildren<{
-    /**
-     * @deprecated
-     *
-     * This will get removed in v5
-     */
     experiments: ExperienceConfiguration<Variant>[];
-    /**
-     * @deprecated
-     *
-     * This will get removed in v5
-     */
     maximumActiveExperiments?: number;
 }>;
 export declare const ExperimentsProvider: <Variant extends Reference>({ experiments, maximumActiveExperiments, children, }: React.PropsWithChildren<ExperimentsProviderProps<Variant>>) => JSX.Element;

package/lib/Experience/useExperiments.d.ts

@@ -1,8 +1,3 @@
-/**
- * @deprecated
- *
- * This will get removed in v5 of the SDK.
- */
 export declare const useExperiments: () => {
     experiments: import("@ninetailed/experience.js-shared").ExperienceConfiguration<any>[];
 };

package/lib/Experience/useProvideJoinExperiment.d.ts

@@ -2,18 +2,12 @@ import { Profile, ExperienceConfiguration, Reference, VariantRef } from '@nineta
 export type JoinExperimentArgs = {
     experiences: ExperienceConfiguration[];
     experiment: ExperienceConfiguration<Reference | VariantRef>;
-    variant: VariantRef;
     profile: Profile;
 };
 export type JoinExperiment = (args: JoinExperimentArgs) => Promise<void>;
 type UseJoinExperimentArgs = {
     experiments: ExperienceConfiguration[];
-    /**
-     * @deprecated
-     *
-     * This will get removed in v5 of the sdk
-     */
     maximumActiveExperiments?: number;
 };
-export declare const useProvideJoinExperiment: (_: UseJoinExperimentArgs) => (data: JoinExperimentArgs) => Promise<void>;
+export declare const useProvideJoinExperiment: ({ experiments, maximumActiveExperiments, }: UseJoinExperimentArgs) => (data: JoinExperimentArgs) => Promise<void>;
 export {};

package/lib/NinetailedProvider.d.ts

@@ -1,14 +1,8 @@
 import React from 'react';
 import { Ninetailed, NinetailedPlugin, ExperienceConfiguration } from '@ninetailed/experience.js';
-import { Profile, Locale, OnErrorHandler, OnLogHandler } from '@ninetailed/experience.js-shared';
+import { Profile, Locale, OnErrorHandler, OnLogHandler, NinetailedRequestContext } from '@ninetailed/experience.js-shared';
 type ExperimentProviderProps = {
-    /**
-     * @deprecated
-     */
     experiments?: ExperienceConfiguration<any>[];
-    /**
-     * @deprecated
-     */
     maximumActiveExperiments?: number;
 };
 export type NinetailedProviderInstantiationProps = {
@@ -22,6 +16,7 @@ export type NinetailedProviderInstantiationProps = {
     requestTimeout?: number;
     onLog?: OnLogHandler;
     onError?: OnErrorHandler;
+    buildClientContext?: () => NinetailedRequestContext;
 } & ExperimentProviderProps;
 export type NinetailedProviderProps = NinetailedProviderInstantiationProps | ({
     ninetailed: Ninetailed;

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@ninetailed/experience.js-react",
-  "version": "4.4.0-beta.1",
+  "version": "4.5.0-beta.1",
   "peerDependencies": {
     "react": ">=16.8.0"
   },
   "dependencies": {
     "@analytics/google-analytics": "0.5.3",
     "react-visibility-sensor": "5.1.1",
-    "@ninetailed/experience.js": "4.4.0-beta.1",
+    "@ninetailed/experience.js": "4.5.0-beta.1",
     "react-intersection-observer": "8.34.0",
-    "@ninetailed/experience.js-shared": "4.4.0-beta.1",
+    "@ninetailed/experience.js-shared": "4.5.0-beta.1",
     "radash": "10.9.0",
     "analytics": "0.8.1"
   },