@flagship.io/react-sdk 2.2.0-beta.6 → 3.0.0

package/README.md

@@ -7,8 +7,8 @@
 
 ## Docs
 
-- coming soon
+- [docs](https://docs.developers.flagship.io/docs/react-v3-0-x)
 
 ## Licence
 
-[Apache License.](https://github.com/abtasty/flagship-react-sdk/blob/master/LICENSE)
+[Apache License.](https://github.com/flagship-io/flagship-react-sdk/blob/master/LICENSE)

package/dist/es/Flag.js

@@ -0,0 +1,36 @@
+import { FlagMetadata, LogLevel } from '@flagship.io/js-sdk';
+import { noVisitorMessage } from './constants';
+import { log } from './utils';
+export class Flag {
+  constructor(defaultValue) {
+    log(LogLevel.ERROR, noVisitorMessage, 'GetFlag');
+    this._defaultValue = defaultValue;
+  }
+
+  getValue() {
+    log(LogLevel.ERROR, noVisitorMessage, 'exists');
+    return this._defaultValue;
+  }
+
+  exists() {
+    log(LogLevel.ERROR, noVisitorMessage, 'exists');
+    return false;
+  }
+
+  userExposed() {
+    log(LogLevel.ERROR, noVisitorMessage, 'userExposed');
+    return Promise.resolve();
+  }
+
+  get metadata() {
+    log(LogLevel.ERROR, noVisitorMessage, 'metadata');
+    return new FlagMetadata({
+      campaignId: '',
+      campaignType: '',
+      isReference: false,
+      variationGroupId: '',
+      variationId: ''
+    });
+  }
+
+}

package/dist/es/FlagshipContext.js

@@ -1,7 +1,7 @@
 // eslint-disable-next-line no-use-before-define
 import React, { useState, useEffect, createContext, useRef } from 'react';
 import { Flagship, FlagshipStatus } from '@flagship.io/js-sdk';
-import { getModificationsFromCampaigns, logError } from './utils';
+import { getModificationsFromCampaigns, logError, uuidV4 } from './utils';
 const initStat = {
   status: {
     isLoading: true,
@@ -36,6 +36,7 @@ export const FlagshipProvider = ({
   initialBucketing,
   initialCampaigns,
   initialModifications,
+  initialFlagsData,
   synchronizeOnBucketingUpdated,
   activateDeduplicationTime,
   hitDeduplicationTime,
@@ -45,7 +46,11 @@ export const FlagshipProvider = ({
 }) => {
   let modifications = new Map();
 
-  if (initialModifications) {
+  if (initialFlagsData && initialFlagsData.forEach) {
+    initialFlagsData.forEach(flag => {
+      modifications.set(flag.key, flag);
+    });
+  } else if (initialModifications && initialModifications.forEach) {
     initialModifications.forEach(modification => {
       modifications.set(modification.key, modification);
     });
@@ -63,7 +68,7 @@ export const FlagshipProvider = ({
     if (synchronizeOnBucketingUpdated) {
       var _state$visitor;
 
-      (_state$visitor = state.visitor) === null || _state$visitor === void 0 ? void 0 : _state$visitor.synchronizeModifications();
+      (_state$visitor = state.visitor) === null || _state$visitor === void 0 ? void 0 : _state$visitor.fetchFlags();
     }
   }, [lastModified]);
   useEffect(() => {
@@ -90,14 +95,14 @@ export const FlagshipProvider = ({
     if (state.visitor.anonymousId && !visitorData.isAuthenticated) {
       state.visitor.unauthenticate();
     } else if (!state.visitor.anonymousId && visitorData.isAuthenticated) {
-      state.visitor.authenticate(visitorData.id);
+      state.visitor.authenticate(visitorData.id || uuidV4());
     }
 
     if (visitorData.id) {
       state.visitor.visitorId = visitorData.id;
     }
 
-    state.visitor.synchronizeModifications();
+    state.visitor.fetchFlags();
   };
 
   function initializeState(param) {
@@ -163,7 +168,7 @@ export const FlagshipProvider = ({
       if ((_stateRef$current = stateRef.current) !== null && _stateRef$current !== void 0 && _stateRef$current.visitor) {
         var _stateRef$current2;
 
-        (_stateRef$current2 = stateRef.current) === null || _stateRef$current2 === void 0 ? void 0 : _stateRef$current2.visitor.synchronizeModifications();
+        (_stateRef$current2 = stateRef.current) === null || _stateRef$current2 === void 0 ? void 0 : _stateRef$current2.visitor.fetchFlags();
       } else {
         const fsVisitor = Flagship.newVisitor({
           visitorId: visitorData.id,
@@ -171,7 +176,8 @@ export const FlagshipProvider = ({
           isAuthenticated: visitorData.isAuthenticated,
           hasConsented: visitorData.hasConsented,
           initialCampaigns,
-          initialModifications
+          initialModifications,
+          initialFlagsData
         });
         fsVisitor === null || fsVisitor === void 0 ? void 0 : fsVisitor.on('ready', error => {
           onVisitorReady(fsVisitor, error);
@@ -222,7 +228,7 @@ export const FlagshipProvider = ({
   const handleDisplay = () => {
     const isFirstInit = !state.visitor;
 
-    if (state.status.isLoading && loadingComponent && isFirstInit) {
+    if (state.status.isLoading && loadingComponent && isFirstInit && fetchNow) {
       return /*#__PURE__*/React.createElement(React.Fragment, null, loadingComponent);
     }
 
@@ -237,7 +243,6 @@ export const FlagshipProvider = ({
   }, handleDisplay());
 };
 FlagshipProvider.defaultProps = {
-  nodeEnv: 'production',
   activateDeduplicationTime: 10,
   hitDeduplicationTime: 10
 };

package/dist/es/FlagshipHooks.js

@@ -1,6 +1,8 @@
 import { useContext } from 'react';
 import { FlagshipContext } from './FlagshipContext';
 import { logError, logWarn } from './utils';
+import { Flag } from './Flag';
+import { noVisitorDefault, noVisitorMessage } from './constants';
 
 const checkType = (value, defaultValue) => typeof value === 'object' && typeof defaultValue === 'object' && Array.isArray(value) === Array.isArray(defaultValue) || typeof value === typeof defaultValue;
 
@@ -44,6 +46,7 @@ const fsModificationsSync = args => {
 };
 /**
  * Retrieve a modification value by its key. If no modification match the given key or if the stored value type and default value type do not match, default value will be returned.
+ * @deprecated use useFsGetFlag instead
  */
 
 
@@ -67,6 +70,7 @@ export const useFsModifications = (params, activateAll) => {
 };
 /**
  * Retrieve a modification value by its key. If no modification match the given key or if the stored value type and default value type do not match, default value will be returned.
+ * @deprecated use useFsGetFlag instead
  */
 
 export const useFsModification = params => {
@@ -119,6 +123,7 @@ const fsModificationInfoSync = args => {
 /**
  * Get the campaign modification information value matching the given key.
  * @param {string} key key which identify the modification.
+ * @deprecated use useFsGetFlag instead
  */
 
 
@@ -148,22 +153,6 @@ const fsSynchronizeModifications = async (functionName, visitor, config) => {
     logError(config, error.message || error, functionName);
   }
 };
-/**
- * This function calls the decision api and update all the campaigns modifications from the server according to the visitor context.
-*/
-
-
-export const useFsSynchronizeModifications = async () => {
-  const {
-    state
-  } = useContext(FlagshipContext);
-  const {
-    visitor,
-    config
-  } = state;
-  const functionName = 'useFsSynchronizeModifications';
-  await fsSynchronizeModifications(functionName, visitor, config);
-};
 
 const fsActivate = async (params, functionName, visitor, config) => {
   try {
@@ -177,13 +166,35 @@ const fsActivate = async (params, functionName, visitor, config) => {
     logWarn(config, error.message || error, functionName);
   }
 };
+/**
+ * This hook returns a flag object by its key. If no flag match the given key an empty flag will be returned.
+ * @param key
+ * @param defaultValue
+ * @returns
+ */
+
+
+export const useFsFlag = (key, defaultValue) => {
+  const {
+    state
+  } = useContext(FlagshipContext);
+  const {
+    visitor
+  } = state;
+
+  if (!visitor) {
+    return new Flag(defaultValue);
+  }
+
+  return visitor.getFlag(key, defaultValue);
+};
 /**
  * Report this user has seen this modification. Report this user has seen these modifications.
  * @param params
+ * @deprecated use useFsGetFlag instead
  * @returns
  */
 
-
 export const useFsActivate = async params => {
   const {
     state
@@ -249,8 +260,8 @@ export const useFlagship = () => {
     visitor.unauthenticate();
   };
   /**
-  * Send a Hit to Flagship servers for reporting.
-  */
+   * Send a Hit to Flagship servers for reporting.
+   */
 
 
   const fsSendHit = hit => {
@@ -264,8 +275,8 @@ export const useFlagship = () => {
     return visitor.sendHit(hit);
   };
   /**
-  * Send a Hit to Flagship servers for reporting.
-  */
+   * Send a Hit to Flagship servers for reporting.
+   */
 
 
   const fsSendHits = hit => {
@@ -316,7 +327,39 @@ export const useFlagship = () => {
     });
   };
 
+  function getFlag(key, defaultValue) {
+    if (!visitor) {
+      return new Flag(defaultValue);
+    }
+
+    return visitor.getFlag(key, defaultValue);
+  }
+
+  function fetchFlags() {
+    if (!visitor) {
+      logWarn(config, noVisitorMessage, 'fetchFlags');
+      return Promise.resolve();
+    }
+
+    return visitor === null || visitor === void 0 ? void 0 : visitor.fetchFlags();
+  }
+
+  function setConsent(hasConsented) {
+    if (!visitor) {
+      logWarn(config, noVisitorMessage, 'setConsent');
+      return;
+    }
+
+    visitor.setConsent(hasConsented);
+  }
+
   return {
+    visitorId: visitor === null || visitor === void 0 ? void 0 : visitor.visitorId,
+    anonymousId: visitor === null || visitor === void 0 ? void 0 : visitor.anonymousId,
+    context: { ...(visitor === null || visitor === void 0 ? void 0 : visitor.context)
+    },
+    hasConsented: visitor === null || visitor === void 0 ? void 0 : visitor.hasConsented,
+    setConsent,
     updateContext: fsUpdateContext,
     clearContext: fsClearContext,
     authenticate: fsAuthenticate,
@@ -326,15 +369,16 @@ export const useFlagship = () => {
     synchronizeModifications,
     getModifications,
     modifications: modifications || [],
+    FlagsData: (visitor === null || visitor === void 0 ? void 0 : visitor.getFlagsDataArray()) || [],
     getModificationInfo,
     hit: {
       send: fsSendHit,
       sendMultiple: fsSendHits
-    }
+    },
+    getFlag,
+    fetchFlags
   };
 };
-export const noVisitorMessage = 'sdk not correctly initialized... Make sure fsVisitor is ready.';
-export const noVisitorDefault = 'fsVisitor not initialized, returns default value';
 
 const reportNoVisitor = (config, tag) => {
   logError(config, noVisitorMessage, tag);

package/dist/es/constants.js

@@ -0,0 +1,2 @@
+export const noVisitorMessage = 'sdk not correctly initialized... Make sure fsVisitor is ready.';
+export const noVisitorDefault = 'fsVisitor not initialized, returns default value';

package/dist/es/utils.js

@@ -20,6 +20,16 @@ export function logWarn(config, message, tag) {
 
   config.logManager.warning(message, tag);
 }
+export function log(level, message, tag) {
+  const now = new Date(); // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+  const getTwoDigit = value => {
+    return value.toString().length === 1 ? `0${value}` : value;
+  };
+
+  const out = `[${getTwoDigit(now.getFullYear())}-${getTwoDigit(now.getMonth())}-${getTwoDigit(now.getDay())} ${getTwoDigit(now.getHours())}:${getTwoDigit(now.getMinutes())}] [Flagship SDK] [${LogLevel[level]}] [${tag}] : ${message}`;
+  console.log(out);
+}
 export const getModificationsFromCampaigns = campaigns => {
   const modifications = new Map();
 
@@ -43,4 +53,11 @@ export const getModificationsFromCampaigns = campaigns => {
     }
   });
   return modifications;
-};
+};
+export function uuidV4() {
+  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (char) {
+    const rand = Math.random() * 16 | 0;
+    const value = char === 'x' ? rand : rand & 0x3 | 0x8;
+    return value.toString(16);
+  });
+}

package/dist/esm/Flag.js

@@ -0,0 +1,55 @@
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import { FlagMetadata, LogLevel } from '@flagship.io/js-sdk';
+import { noVisitorMessage } from './constants';
+import { log } from './utils';
+export var Flag = /*#__PURE__*/function () {
+  function Flag(defaultValue) {
+    _classCallCheck(this, Flag);
+
+    _defineProperty(this, "_defaultValue", void 0);
+
+    log(LogLevel.ERROR, noVisitorMessage, 'GetFlag');
+    this._defaultValue = defaultValue;
+  }
+
+  _createClass(Flag, [{
+    key: "getValue",
+    value: function getValue() {
+      log(LogLevel.ERROR, noVisitorMessage, 'exists');
+      return this._defaultValue;
+    }
+  }, {
+    key: "exists",
+    value: function exists() {
+      log(LogLevel.ERROR, noVisitorMessage, 'exists');
+      return false;
+    }
+  }, {
+    key: "userExposed",
+    value: function userExposed() {
+      log(LogLevel.ERROR, noVisitorMessage, 'userExposed');
+      return Promise.resolve();
+    }
+  }, {
+    key: "metadata",
+    get: function get() {
+      log(LogLevel.ERROR, noVisitorMessage, 'metadata');
+      return new FlagMetadata({
+        campaignId: '',
+        campaignType: '',
+        isReference: false,
+        variationGroupId: '',
+        variationId: ''
+      });
+    }
+  }]);
+
+  return Flag;
+}();

package/dist/esm/FlagshipContext.js

@@ -19,7 +19,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 // eslint-disable-next-line no-use-before-define
 import React, { useState, useEffect, createContext, useRef } from 'react';
 import { Flagship, FlagshipStatus } from '@flagship.io/js-sdk';
-import { getModificationsFromCampaigns, logError } from './utils';
+import { getModificationsFromCampaigns, logError, uuidV4 } from './utils';
 var initStat = {
   status: {
     isLoading: true,
@@ -53,6 +53,7 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
       initialBucketing = _ref.initialBucketing,
       initialCampaigns = _ref.initialCampaigns,
       initialModifications = _ref.initialModifications,
+      initialFlagsData = _ref.initialFlagsData,
       synchronizeOnBucketingUpdated = _ref.synchronizeOnBucketingUpdated,
       activateDeduplicationTime = _ref.activateDeduplicationTime,
       hitDeduplicationTime = _ref.hitDeduplicationTime,
@@ -61,7 +62,11 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
       disableCache = _ref.disableCache;
   var modifications = new Map();
 
-  if (initialModifications) {
+  if (initialFlagsData && initialFlagsData.forEach) {
+    initialFlagsData.forEach(function (flag) {
+      modifications.set(flag.key, flag);
+    });
+  } else if (initialModifications && initialModifications.forEach) {
     initialModifications.forEach(function (modification) {
       modifications.set(modification.key, modification);
     });
@@ -87,7 +92,7 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
     if (synchronizeOnBucketingUpdated) {
       var _state$visitor;
 
-      (_state$visitor = state.visitor) === null || _state$visitor === void 0 ? void 0 : _state$visitor.synchronizeModifications();
+      (_state$visitor = state.visitor) === null || _state$visitor === void 0 ? void 0 : _state$visitor.fetchFlags();
     }
   }, [lastModified]);
   useEffect(function () {
@@ -114,14 +119,14 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
     if (state.visitor.anonymousId && !visitorData.isAuthenticated) {
       state.visitor.unauthenticate();
     } else if (!state.visitor.anonymousId && visitorData.isAuthenticated) {
-      state.visitor.authenticate(visitorData.id);
+      state.visitor.authenticate(visitorData.id || uuidV4());
     }
 
     if (visitorData.id) {
       state.visitor.visitorId = visitorData.id;
     }
 
-    state.visitor.synchronizeModifications();
+    state.visitor.fetchFlags();
   };
 
   function initializeState(param) {
@@ -185,7 +190,7 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
       if ((_stateRef$current = stateRef.current) !== null && _stateRef$current !== void 0 && _stateRef$current.visitor) {
         var _stateRef$current2;
 
-        (_stateRef$current2 = stateRef.current) === null || _stateRef$current2 === void 0 ? void 0 : _stateRef$current2.visitor.synchronizeModifications();
+        (_stateRef$current2 = stateRef.current) === null || _stateRef$current2 === void 0 ? void 0 : _stateRef$current2.visitor.fetchFlags();
       } else {
         var fsVisitor = Flagship.newVisitor({
           visitorId: visitorData.id,
@@ -193,7 +198,8 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
           isAuthenticated: visitorData.isAuthenticated,
           hasConsented: visitorData.hasConsented,
           initialCampaigns: initialCampaigns,
-          initialModifications: initialModifications
+          initialModifications: initialModifications,
+          initialFlagsData: initialFlagsData
         });
         fsVisitor === null || fsVisitor === void 0 ? void 0 : fsVisitor.on('ready', function (error) {
           onVisitorReady(fsVisitor, error);
@@ -244,7 +250,7 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
   var handleDisplay = function handleDisplay() {
     var isFirstInit = !state.visitor;
 
-    if (state.status.isLoading && loadingComponent && isFirstInit) {
+    if (state.status.isLoading && loadingComponent && isFirstInit && fetchNow) {
       return /*#__PURE__*/React.createElement(React.Fragment, null, loadingComponent);
     }
 
@@ -259,7 +265,6 @@ export var FlagshipProvider = function FlagshipProvider(_ref) {
   }, handleDisplay());
 };
 FlagshipProvider.defaultProps = {
-  nodeEnv: 'production',
   activateDeduplicationTime: 10,
   hitDeduplicationTime: 10
 };