@flagship.io/react-sdk 3.0.4 → 3.0.6

package/README.md

@@ -1,14 +1,27 @@
-<p align="center">
-<img  src="https://mk0abtastybwtpirqi5t.kinstacdn.com/wp-content/uploads/picture-solutions-persona-product-flagship.jpg"  width="211"  height="182"  alt="flagship-java"  />
-</p>
-<h3 align="center">Bring your features to life</h3>
+[![Code coverage](https://github.com/flagship-io/flagship-react-sdk/actions/workflows/workflow.yml/badge.svg)](https://github.com/flagship-io/flagship-react-sdk/actions/workflows/workflow.yml) [![npm version](https://badge.fury.io/js/@flagship.io%2Freact-sdk.svg)](https://badge.fury.io/js/@flagship.io%2Freact-sdk)
 
-**Visit [https://developers.flagship.io/](https://developers.flagship.io/) to get started with Flagship.**
+## About Flagship
 
-## Docs
+​
+<img src="https://www.flagship.io/wp-content/uploads/Flagship-horizontal-black-wake-AB.png" alt="drawing" width="150"/>
+​
+[Flagship by AB Tasty](https://www.flagship.io/) is a feature flagging platform for modern engineering and product teams. It eliminates the risks of future releases by separating code deployments from these releases :bulb: With Flagship, you have full control over the release process. You can:
+​
 
-- [docs](https://docs.developers.flagship.io/docs/react-v3-0-x)
-
-## Licence
-
-[Apache License.](https://github.com/flagship-io/flagship-react-sdk/blob/master/LICENSE)
+- Switch features on or off through remote config.
+- Automatically roll-out your features gradually to monitor performance and gather feedback from your most relevant users.
+- Roll back any feature should any issues arise while testing in production.
+- Segment users by granting access to a feature based on certain user attributes.
+- Carry out A/B tests by easily assigning feature variations to groups of users.
+  ​
+  <img src="https://www.flagship.io/wp-content/uploads/demo-setup.png" alt="drawing" width="600"/>
+  ​
+  Flagship also allows you to choose whatever implementation method works for you from our many available SDKs or directly through a REST API. Additionally, our architecture is based on multi-cloud providers that offer high performance and highly-scalable managed services.
+  ​
+  **To learn more:**
+  ​
+- [Solution overview](https://www.flagship.io/#showvideo) - A 5mn video demo :movie_camera:
+- [Documentation](https://docs.developers.flagship.io/) - Our dev portal with guides, how tos, API and SDK references
+- [Sign up for a free trial](https://www.flagship.io/sign-up/) - Create your free account
+- [Guide to feature flagging](https://www.flagship.io/feature-flags/) - Everyhting you need to know about feature flag related use cases
+- [Blog](https://www.flagship.io/blog/) - Additional resources about release management

package/dist/Flag.js

@@ -0,0 +1,66 @@
+import Flagship, { FlagMetadata } from '@flagship.io/js-sdk';
+import { GET_FLAG_CAST_ERROR, GET_METADATA_CAST_ERROR, noVisitorMessage } from './constants';
+import { hasSameType, logInfo, logWarn, sprintf } from './utils';
+var Flag = /** @class */ (function () {
+    function Flag(defaultValue, key, flagsData) {
+        if (!flagsData) {
+            logWarn(Flagship.getConfig(), noVisitorMessage, 'GetFlag');
+        }
+        this.defaultValue = defaultValue;
+        this.key = key;
+        this.flag = flagsData === null || flagsData === void 0 ? void 0 : flagsData.get(key);
+    }
+    Flag.prototype.NotSameType = function () {
+        var _a;
+        return this.defaultValue !== null && this.defaultValue !== undefined && !hasSameType((_a = this.flag) === null || _a === void 0 ? void 0 : _a.value, this.defaultValue);
+    };
+    Flag.prototype.getValue = function () {
+        if (!this.flag) {
+            logWarn(Flagship.getConfig(), noVisitorMessage, 'getValue');
+            return this.defaultValue;
+        }
+        if (this.NotSameType()) {
+            logInfo(Flagship.getConfig(), sprintf(GET_FLAG_CAST_ERROR, this.key), "getValue");
+            return this.defaultValue;
+        }
+        return this.flag.value;
+    };
+    Flag.prototype.exists = function () {
+        if (!this.flag) {
+            logWarn(Flagship.getConfig(), noVisitorMessage, 'exists');
+            return false;
+        }
+        return !!(this.flag.campaignId && this.flag.variationId && this.flag.variationGroupId);
+    };
+    Flag.prototype.userExposed = function () {
+        if (!this.flag) {
+            logWarn(Flagship.getConfig(), noVisitorMessage, 'userExposed');
+        }
+        return Promise.resolve();
+    };
+    Object.defineProperty(Flag.prototype, "metadata", {
+        get: function () {
+            var functionName = 'metadata';
+            if (!this.flag) {
+                logWarn(Flagship.getConfig(), noVisitorMessage, functionName);
+                return FlagMetadata.Empty();
+            }
+            if (this.NotSameType()) {
+                logInfo(Flagship.getConfig(), sprintf(GET_METADATA_CAST_ERROR, this.key), functionName);
+                return FlagMetadata.Empty();
+            }
+            return new FlagMetadata({
+                campaignId: this.flag.campaignId,
+                variationGroupId: this.flag.variationGroupId,
+                variationId: this.flag.variationId,
+                isReference: !!this.flag.isReference,
+                campaignType: this.flag.campaignType,
+                slug: this.flag.slug
+            });
+        },
+        enumerable: false,
+        configurable: true
+    });
+    return Flag;
+}());
+export { Flag };

package/dist/FlagshipContext.js

@@ -0,0 +1,181 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+// 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, useNonInitialEffect, } from "./utils";
+var initStat = {
+    status: { isLoading: true, isSdkReady: false },
+};
+export var FlagshipContext = createContext({
+    state: __assign({}, initStat),
+});
+export var FlagshipProvider = function (_a) {
+    var children = _a.children, fetchNow = _a.fetchNow, envId = _a.envId, apiKey = _a.apiKey, decisionMode = _a.decisionMode, decisionApiUrl = _a.decisionApiUrl, timeout = _a.timeout, logLevel = _a.logLevel, statusChangedCallback = _a.statusChangedCallback, logManager = _a.logManager, pollingInterval = _a.pollingInterval, visitorData = _a.visitorData, onInitStart = _a.onInitStart, onInitDone = _a.onInitDone, onBucketingSuccess = _a.onBucketingSuccess, onBucketingFail = _a.onBucketingFail, loadingComponent = _a.loadingComponent, onBucketingUpdated = _a.onBucketingUpdated, onUpdate = _a.onUpdate, enableClientCache = _a.enableClientCache, initialBucketing = _a.initialBucketing, initialCampaigns = _a.initialCampaigns, initialModifications = _a.initialModifications, initialFlagsData = _a.initialFlagsData, fetchFlagsOnBucketingUpdated = _a.fetchFlagsOnBucketingUpdated, activateDeduplicationTime = _a.activateDeduplicationTime, hitDeduplicationTime = _a.hitDeduplicationTime, visitorCacheImplementation = _a.visitorCacheImplementation, hitCacheImplementation = _a.hitCacheImplementation, disableCache = _a.disableCache, language = _a.language;
+    var modifications = new Map();
+    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);
+        });
+    }
+    else if (initialCampaigns) {
+        modifications = getModificationsFromCampaigns(initialCampaigns);
+    }
+    var _b = useState(__assign(__assign({}, initStat), { modifications: modifications })), state = _b[0], setState = _b[1];
+    var _c = useState(), lastModified = _c[0], setLastModified = _c[1];
+    var stateRef = useRef();
+    stateRef.current = state;
+    useNonInitialEffect(function () {
+        var _a;
+        if (fetchFlagsOnBucketingUpdated) {
+            (_a = state.visitor) === null || _a === void 0 ? void 0 : _a.fetchFlags();
+        }
+    }, [lastModified]);
+    useNonInitialEffect(function () {
+        createVisitor(true);
+    }, [JSON.stringify(visitorData)]);
+    useEffect(function () {
+        initSdk();
+    }, [envId, apiKey, decisionMode]);
+    function initializeState(param) {
+        var newStatus = {
+            isSdkReady: param.isSdkReady,
+            isLoading: param.isLoading,
+            isVisitorDefined: !!param.fsVisitor,
+            lastRefresh: new Date().toISOString(),
+        };
+        setState(function (currentState) {
+            if (!currentState.status.firstInitSuccess) {
+                newStatus.firstInitSuccess = new Date().toISOString();
+            }
+            return __assign(__assign({}, currentState), { visitor: param.fsVisitor, modifications: param.fsVisitor.modifications, config: Flagship.getConfig(), status: __assign(__assign({}, currentState.status), newStatus) });
+        });
+        return newStatus;
+    }
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    var onVisitorReady = function (fsVisitor, error) {
+        if (error) {
+            logError(Flagship.getConfig(), error.message || error, "onReady");
+            return;
+        }
+        var newStatus = initializeState({
+            fsVisitor: fsVisitor,
+            isSdkReady: true,
+            isLoading: false,
+        });
+        if (onUpdate) {
+            onUpdate({
+                fsModifications: fsVisitor.modifications,
+                config: Flagship.getConfig(),
+                status: newStatus,
+            });
+        }
+    };
+    var createVisitor = function (fetchFlags) {
+        if (fetchFlags === void 0) { fetchFlags = false; }
+        if (!visitorData) {
+            return;
+        }
+        var fsVisitor = Flagship.newVisitor({
+            visitorId: visitorData.id,
+            context: visitorData.context,
+            isAuthenticated: visitorData.isAuthenticated,
+            hasConsented: visitorData.hasConsented,
+            initialCampaigns: initialCampaigns,
+            initialModifications: initialModifications,
+            initialFlagsData: initialFlagsData,
+        });
+        fsVisitor === null || fsVisitor === void 0 ? void 0 : fsVisitor.on("ready", function (error) {
+            onVisitorReady(fsVisitor, error);
+        });
+        if (!fetchNow && fsVisitor && !fetchFlags) {
+            initializeState({
+                fsVisitor: fsVisitor,
+                isSdkReady: true,
+                isLoading: false,
+            });
+        }
+        if (fetchFlags && !fetchNow) {
+            fsVisitor === null || fsVisitor === void 0 ? void 0 : fsVisitor.fetchFlags();
+        }
+    };
+    var statusChanged = function (status) {
+        if (statusChangedCallback) {
+            statusChangedCallback(status);
+        }
+        switch (status) {
+            case FlagshipStatus.STARTING:
+                if (status === FlagshipStatus.STARTING && onInitStart) {
+                    onInitStart();
+                }
+                break;
+            case FlagshipStatus.READY_PANIC_ON:
+            case FlagshipStatus.READY:
+                if (onInitDone) {
+                    onInitDone();
+                }
+                createVisitor();
+                break;
+            case FlagshipStatus.NOT_INITIALIZED:
+                setState(function (prev) { return (__assign(__assign({}, prev), { config: Flagship.getConfig() })); });
+                break;
+        }
+    };
+    var onBucketingLastModified = function (lastUpdate) {
+        if (onBucketingUpdated) {
+            onBucketingUpdated(lastUpdate);
+        }
+        setLastModified(lastUpdate);
+    };
+    var initSdk = function () {
+        Flagship.start(envId, apiKey, {
+            decisionMode: decisionMode,
+            fetchNow: fetchNow,
+            timeout: timeout,
+            logLevel: logLevel,
+            statusChangedCallback: statusChanged,
+            logManager: logManager,
+            pollingInterval: pollingInterval,
+            onBucketingFail: onBucketingFail,
+            onBucketingSuccess: onBucketingSuccess,
+            enableClientCache: enableClientCache,
+            decisionApiUrl: decisionApiUrl,
+            onBucketingUpdated: onBucketingLastModified,
+            initialBucketing: initialBucketing,
+            activateDeduplicationTime: activateDeduplicationTime,
+            hitDeduplicationTime: hitDeduplicationTime,
+            visitorCacheImplementation: visitorCacheImplementation,
+            hitCacheImplementation: hitCacheImplementation,
+            disableCache: disableCache,
+            language: language,
+        });
+    };
+    var handleDisplay = function () {
+        var isFirstInit = !state.visitor;
+        if (state.status.isLoading && loadingComponent && isFirstInit && fetchNow) {
+            return React.createElement(React.Fragment, null, loadingComponent);
+        }
+        return React.createElement(React.Fragment, null, children);
+    };
+    return (React.createElement(FlagshipContext.Provider, { value: { state: state, setState: setState } }, handleDisplay()));
+};
+FlagshipProvider.defaultProps = {
+    activateDeduplicationTime: 2,
+    hitDeduplicationTime: 2,
+    fetchNow: true,
+    language: 1,
+};

package/dist/{types/FlagshipHooks.d.ts → FlagshipHooks.d.ts}

@@ -2,12 +2,12 @@ import { FlagDTO, HitAbstract, HitShape, IFlag, IHit, Modification, modification
 import { FsStatus } from './FlagshipContext';
 /**
  * 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
+ * @deprecated use useFsFlag instead
  */
 export declare const useFsModifications: <T extends unknown>(params: modificationsRequested<T>[], activateAll?: boolean | undefined) => Record<string, T>;
 /**
  * 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
+ * @deprecated use useFsFlag instead
  */
 export declare const useFsModification: {
     <T>(params: modificationsRequested<T>): T;
@@ -15,7 +15,7 @@ export declare const useFsModification: {
 /**
  * Get the campaign modification information value matching the given key.
  * @param {string} key key which identify the modification.
- * @deprecated use useFsGetFlag instead
+ * @deprecated use useFsFlag instead
  */
 export declare const useFsModificationInfo: {
     (key: string): Modification | null;
@@ -30,7 +30,7 @@ export declare const useFsFlag: <T extends unknown>(key: string, defaultValue: T
 /**
  * Report this user has seen this modification. Report this user has seen these modifications.
  * @param params
- * @deprecated use useFsGetFlag instead
+ * @deprecated use useFsFlag instead
  * @returns
  */
 export declare const useFsActivate: {
@@ -56,27 +56,27 @@ export declare type UseFlagshipOutput = {
      */
     setConsent: (hasConsented: boolean) => void;
     modifications: Modification[];
-    FlagsData: FlagDTO[];
+    flagsData: FlagDTO[];
     status: FsStatus;
     /**
      *
      * @param params
      * @param activateAll
-     * @deprecated use useFsGetFlag instead
+     * @deprecated use getFlag instead
      */
     getModifications<T>(params: modificationsRequested<T>[], activateAll?: boolean): Record<string, T>;
     /**
      *
      * @param key
-     * @deprecated use useFsGetFlag instead
+     * @deprecated use getFlag instead
      */
     getModificationInfo(key: string): Modification | null;
     /**
-     * @deprecated use useFsFetchFlags instead
+     * @deprecated use fetchFlags instead
      */
     synchronizeModifications(): Promise<void>;
     /**
-     * @deprecated use useFsGetFlag instead
+     * @deprecated use getFlag instead
      */
     activateModification: {
         (keys: {