@featbit/react-client-sdk 1.0.3 → 1.0.5

package/README.md

@@ -1,10 +1,11 @@
-# Featbit Client-Side SDK for ReactJS
+# FeatBit Client-Side SDK for ReactJS
 
 ## Introduction
 
 This is the React client side SDK for the feature management platform [FeatBit](https://www.featbit.co).
 
-Be aware, this is a client side SDK, it is intended for use in a single-user context, which can be mobile, desktop or embeded applications. This SDK can only be ran in a browser environment, it is not suitable for React Native projects, React Native SDK will be available in our other repo.
+Be aware, this is a client side SDK, it is intended for use in a single-user context, which can be mobile, desktop or embeded applications. This SDK can only be ran in a browser environment, it is not suitable for React Native projects.
+If you are looking for React Native SDK, please check this [React Native SDK](https://github.com/featbit/featbit-react-native-sdk).
 
 > The React SDK is based on the JavaScript SDK  
 The React SDK builds on FeatBit's JavaScript SDK to provide a better integration for use in React applications. As a result, much of the JavaScript SDK functionality is also available for the React SDK to use. 

package/dist/asyncWithFbProvider.js

@@ -45,11 +45,23 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React, { useState, useEffect } from 'react';
 import { defaultReactOptions } from './types';
 import { Provider } from './context';
-import { initClient } from './initClient';
 import getFlagsProxy from "./getFlagsProxy";
+import { FbClientBuilder } from "@featbit/js-client-sdk";
+import { fetchFlags } from "./utils";
 /**
  * This is an async function which initializes feature-flags.co's JS SDK (`@featbit/js-client-sdk`)
  * and awaits it so all flags and the fbClient are ready before the consumer app is rendered.
@@ -76,25 +88,58 @@ import getFlagsProxy from "./getFlagsProxy";
  */
 export default function asyncWithFbProvider(config) {
     return __awaiter(this, void 0, void 0, function () {
-        var options, userReactOptions, platform, reactOptions, _a, fetchedFlags, fbClient, bootstrapFlags, FbProvider;
-        var _this = this;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var options, userReactOptions, platform, reactOptions, error, fetchedFlags, fbClient, e_1, bootstrapFlags, FbProvider;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     options = config.options, userReactOptions = config.reactOptions, platform = config.platform;
                     reactOptions = __assign(__assign({}, defaultReactOptions), userReactOptions);
-                    return [4 /*yield*/, initClient(reactOptions, options, platform)];
+                    fetchedFlags = {};
+                    fbClient = new FbClientBuilder(__assign({}, options))
+                        .platform(platform)
+                        .build();
+                    _a.label = 1;
                 case 1:
-                    _a = _b.sent(), fetchedFlags = _a.flags, fbClient = _a.fbClient;
+                    _a.trys.push([1, 4, , 5]);
+                    return [4 /*yield*/, fbClient.waitForInitialization()];
+                case 2:
+                    _a.sent();
+                    return [4 /*yield*/, fetchFlags(fbClient)];
+                case 3:
+                    fetchedFlags = _a.sent();
+                    return [3 /*break*/, 5];
+                case 4:
+                    e_1 = _a.sent();
+                    error = e_1;
+                    return [3 /*break*/, 5];
+                case 5:
                     bootstrapFlags = ((options === null || options === void 0 ? void 0 : options.bootstrap) || []).reduce(function (acc, flag) {
                         acc[flag.id] = flag.variation;
                         return acc;
                     }, {});
                     FbProvider = function (_a) {
                         var children = _a.children;
-                        var _b = useState(function () { return (__assign({ unproxiedFlags: fetchedFlags }, getFlagsProxy(fbClient, bootstrapFlags, fetchedFlags, reactOptions))); }), state = _b[0], setState = _b[1];
+                        var _b = useState(function () { return (__assign(__assign({ unproxiedFlags: fetchedFlags }, getFlagsProxy(fbClient, bootstrapFlags, fetchedFlags, reactOptions)), { fbClient: fbClient, error: error })); }), state = _b[0], setState = _b[1];
                         useEffect(function () {
-                            fbClient.on('update', function (changedKeys) {
+                            function onReady() {
+                                return __awaiter(this, void 0, void 0, function () {
+                                    var unproxiedFlags;
+                                    return __generator(this, function (_a) {
+                                        switch (_a.label) {
+                                            case 0: return [4 /*yield*/, fetchFlags(fbClient)];
+                                            case 1:
+                                                unproxiedFlags = _a.sent();
+                                                setState(function (prevState) { return (__assign(__assign(__assign({}, prevState), { unproxiedFlags: unproxiedFlags }), getFlagsProxy(fbClient, bootstrapFlags, unproxiedFlags, reactOptions))); });
+                                                return [2 /*return*/];
+                                        }
+                                    });
+                                });
+                            }
+                            function onFailed(e) {
+                                setState(function (prevState) { return (__assign(__assign({}, prevState), { error: e })); });
+                            }
+                            function onUpdate(changedKeys) {
+                                var _this = this;
                                 var updates = changedKeys.reduce(function (acc, key) { return __awaiter(_this, void 0, void 0, function () {
                                     var _a, _b;
                                     return __generator(this, function (_c) {
@@ -110,16 +155,28 @@ export default function asyncWithFbProvider(config) {
                                     });
                                 }); }, {});
                                 if (Object.keys(updates).length > 0) {
-                                    setState(function (_a) {
-                                        var unproxiedFlags = _a.unproxiedFlags;
-                                        var updatedUnproxiedFlags = __assign(__assign({}, unproxiedFlags), updates);
-                                        return __assign({ unproxiedFlags: updatedUnproxiedFlags }, getFlagsProxy(fbClient, bootstrapFlags, updatedUnproxiedFlags, reactOptions));
+                                    setState(function (prevState) {
+                                        var updatedUnproxiedFlags = __assign(__assign({}, prevState.unproxiedFlags), updates);
+                                        return __assign(__assign(__assign({}, prevState), { unproxiedFlags: updatedUnproxiedFlags }), getFlagsProxy(fbClient, bootstrapFlags, updatedUnproxiedFlags, reactOptions));
                                     });
                                 }
-                            });
+                            }
+                            fbClient.on('update', onUpdate);
+                            // Only subscribe to ready and failed if waitForInitialization timed out
+                            // because we want the introduction of init timeout to be as minimal and backwards
+                            // compatible as possible.
+                            if (error === null || error === void 0 ? void 0 : error.name.toLowerCase().includes('timeout')) {
+                                fbClient.on('failed', onFailed);
+                                fbClient.on('ready', onReady);
+                            }
+                            return function cleanup() {
+                                fbClient.off('update', onUpdate);
+                                fbClient.off('failed', onFailed);
+                                fbClient.off('ready', onReady);
+                            };
                         }, []);
-                        var flags = state.flags, flagKeyMap = state.flagKeyMap;
-                        return React.createElement(Provider, { value: { flags: flags, flagKeyMap: flagKeyMap, fbClient: fbClient } }, children);
+                        var _ = state.unproxiedFlags, rest = __rest(state, ["unproxiedFlags"]);
+                        return React.createElement(Provider, { value: rest }, children);
                     };
                     return [2 /*return*/, FbProvider];
             }

package/dist/asyncWithFbProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"asyncWithFbProvider.js","sourceRoot":"../src/","sources":["asyncWithFbProvider.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAkB,mBAAmB,EAAY,MAAM,SAAS,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,CAAC,OAAO,UAAgB,mBAAmB,CAAC,MAAsB;;;;;;;oBAC/D,OAAO,GAA8C,MAAM,QAApD,EAAgB,gBAAgB,GAAc,MAAM,aAApB,EAAE,QAAQ,GAAI,MAAM,SAAV,CAAW;oBAC7D,YAAY,yBAAO,mBAAmB,GAAK,gBAAgB,CAAC,CAAC;oBAC1B,qBAAM,UAAU,CAAC,YAAY,EAAE,OAAO,EAAE,QAAQ,CAAC,EAAA;;oBAApF,KAAmC,SAAiD,EAA3E,YAAY,WAAA,EAAE,QAAQ,cAAA;oBAE/B,cAAc,GAAG,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,KAAI,EAAE,CAAC,CAAC,MAAM,CAAC,UAAC,GAA4B,EAAE,IAAS;wBAC/F,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;wBAC9B,OAAO,GAAG,CAAC;oBACb,CAAC,EAAE,EAA6B,CAAC,CAAC;oBAE5B,UAAU,GAAG,UAAC,EAAmC;4BAAlC,QAAQ,cAAA;wBACrB,IAAA,KAAoB,QAAQ,CAAC,cAAM,OAAA,YACvC,cAAc,EAAE,YAAY,IACzB,aAAa,CAAC,QAAQ,EAAE,cAAc,EAAE,YAAY,EAAE,YAAY,CAAC,EACtE,EAHuC,CAGvC,CAAC,EAHI,KAAK,QAAA,EAAE,QAAQ,QAGnB,CAAC;wBAEJ,SAAS,CAAC;4BACR,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,UAAC,WAAqB;gCAC1C,IAAM,OAAO,GAAa,WAAW,CAAC,MAAM,CAAC,UAAO,GAAG,EAAE,GAAG;;;;;gDAC1D,KAAA,GAAG,CAAA;gDAAC,KAAA,GAAG,CAAA;gDAAI,qBAAM,QAAQ,CAAC,SAAS,CAAC,GAAG,EAAE,EAAE,CAAC,EAAA;;gDAA5C,MAAQ,GAAG,SAAiC,CAAC;gDAC7C,sBAAO,GAAG,EAAC;;;qCACZ,EAAE,EAAc,CAAC,CAAC;gCAEnB,IAAI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;oCACnC,QAAQ,CAAC,UAAC,EAAkB;4CAAhB,cAAc,oBAAA;wCACxB,IAAM,qBAAqB,yBAAQ,cAAc,GAAK,OAAO,CAAE,CAAC;wCAEhE,kBACE,cAAc,EAAE,qBAAqB,IAClC,aAAa,CAAC,QAAQ,EAAE,cAAc,EAAE,qBAAqB,EAAE,YAAY,CAAC,EAC/E;oCACJ,CAAC,CAAC,CAAC;iCACJ;4BACH,CAAC,CAAC,CAAC;wBACL,CAAC,EAAE,EAAE,CAAC,CAAC;wBAEC,IAAA,KAAK,GAAiB,KAAK,MAAtB,EAAE,UAAU,GAAK,KAAK,WAAV,CAAW;wBACpC,OAAO,oBAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,KAAK,OAAA,EAAE,UAAU,YAAA,EAAE,QAAQ,UAAA,EAAE,IAAI,QAAQ,CAAa,CAAC;oBACnF,CAAC,CAAC;oBAEF,sBAAO,UAAU,EAAC;;;;CACnB"}
+{"version":3,"file":"asyncWithFbProvider.js","sourceRoot":"../src/","sources":["asyncWithFbProvider.tsx"],"names":[],"mappings":"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"}

package/dist/context.d.ts

@@ -8,6 +8,10 @@ interface FbContext {
      */
     flagKeyMap: FlagKeyMap;
     fbClient?: IFbClient;
+    /**
+     * FeatBit client initialization error, if there was one.
+     */
+    error?: Error;
 }
 declare const context: import("react").Context<FbContext>;
 declare const Provider: import("react").Provider<FbContext>, Consumer: import("react").Consumer<FbContext>;

package/dist/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","sourceRoot":"../src/","sources":["context.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AActC,IAAM,OAAO,GAAG,aAAa,CAAY,EAAC,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAC,CAAC,CAAC;AAGzF,IAAA,QAAQ,GAEN,OAAO,SAFD,EACR,QAAQ,GACN,OAAO,SADD,CACE;AAEZ,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAa,CAAC;AACzC,eAAe,OAAO,CAAC"}
+{"version":3,"file":"context.js","sourceRoot":"../src/","sources":["context.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAmBtC,IAAM,OAAO,GAAG,aAAa,CAAY,EAAC,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAC,CAAC,CAAC;AAGzF,IAAA,QAAQ,GAEN,OAAO,SAFD,EACR,QAAQ,GACN,OAAO,SADD,CACE;AAEZ,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAa,CAAC;AACzC,eAAe,OAAO,CAAC"}

package/dist/provider.d.ts

@@ -1,10 +1,7 @@
-import React from "react";
+import React, { Component, PropsWithChildren } from "react";
 import { EnhancedComponent, ProviderConfig, IFlagSet } from './types';
-import { FbContext } from './context';
 import { IFbClient } from '@featbit/js-client-sdk';
-interface FbHocState extends FbContext {
-    unproxiedFlags: IFlagSet;
-}
+import { ProviderState } from "./providerState";
 /**
  * The `FbProvider` is a component which accepts a config object which is used to
  * initialize `@featbit/js-client-sdk`.
@@ -22,8 +19,8 @@ interface FbHocState extends FbContext {
  * within your application. This provider is used inside the `withFbProviderHOC` and can be used instead to initialize
  * the `@featbit/js-client-sdk`. For async initialization, check out the `asyncWithFbProvider` function
  */
-declare class FbProvider extends React.Component<ProviderConfig, FbHocState> implements EnhancedComponent {
-    readonly state: Readonly<FbHocState>;
+declare class FbProvider extends Component<PropsWithChildren<ProviderConfig>, ProviderState> implements EnhancedComponent {
+    readonly state: Readonly<ProviderState>;
     bootstrapFlags: IFlagSet;
     constructor(props: ProviderConfig);
     getReactOptions: () => {
@@ -31,9 +28,11 @@ declare class FbProvider extends React.Component<ProviderConfig, FbHocState> imp
         sendEventsOnFlagRead: boolean;
     };
     subscribeToChanges: (fbClient: IFbClient) => void;
-    init: () => Promise<void>;
+    onFailed: (fbClient: IFbClient, e: Error) => void;
+    onReady: (fbClient: IFbClient, reactOptions: any) => Promise<void>;
+    prepareFbClient: () => Promise<void>;
     componentDidMount(): Promise<void>;
     componentDidUpdate(prevProps: ProviderConfig): Promise<void>;
-    render(): React.JSX.Element | null;
+    render(): React.JSX.Element;
 }
 export default FbProvider;

package/dist/provider.js

@@ -60,11 +60,11 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
-import React from "react";
+import React, { Component } from "react";
 import { defaultReactOptions } from './types';
 import { Provider } from './context';
 import { camelCaseKeys, fetchFlags } from "./utils";
-import { initClient } from './initClient';
+import { FbClientBuilder } from '@featbit/js-client-sdk';
 import getFlagsProxy from "./getFlagsProxy";
 /**
  * The `FbProvider` is a component which accepts a config object which is used to
@@ -96,31 +96,67 @@ var FbProvider = /** @class */ (function (_super) {
                 }, {});
                 var unproxiedFlags = __assign(__assign({}, _this.state.unproxiedFlags), updates);
                 if (Object.keys(updates).length > 0) {
-                    _this.setState(__assign({ unproxiedFlags: unproxiedFlags }, getFlagsProxy(fbClient, _this.bootstrapFlags, unproxiedFlags, _this.getReactOptions())));
+                    _this.setState(function (prevState) { return (__assign(__assign(__assign({}, prevState), { unproxiedFlags: unproxiedFlags }), getFlagsProxy(fbClient, _this.bootstrapFlags, unproxiedFlags, _this.getReactOptions()))); });
                 }
             });
         };
-        _this.init = function () { return __awaiter(_this, void 0, void 0, function () {
-            var _a, options, platform, client, reactOptions, unproxiedFlags, initialisedOutput;
+        _this.onFailed = function (fbClient, e) {
+            _this.setState(function (prevState) { return (__assign(__assign({}, prevState), { error: e })); });
+        };
+        _this.onReady = function (fbClient, reactOptions) { return __awaiter(_this, void 0, void 0, function () {
+            var unproxiedFlags;
+            var _this = this;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, fetchFlags(fbClient)];
+                    case 1:
+                        unproxiedFlags = _a.sent();
+                        this.setState(function (prevState) { return (__assign(__assign(__assign({}, prevState), { unproxiedFlags: unproxiedFlags }), getFlagsProxy(fbClient, _this.bootstrapFlags, unproxiedFlags, reactOptions))); });
+                        return [2 /*return*/];
+                }
+            });
+        }); };
+        _this.prepareFbClient = function () { return __awaiter(_this, void 0, void 0, function () {
+            var _a, options, platform, client, reactOptions, unproxiedFlags, error, e_1;
+            var _this = this;
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
                         _a = this.props, options = _a.options, platform = _a.platform;
                         client = this.props.fbClient;
                         reactOptions = this.getReactOptions();
+                        unproxiedFlags = this.state.unproxiedFlags;
                         if (!client) return [3 /*break*/, 2];
                         return [4 /*yield*/, fetchFlags(client)];
                     case 1:
                         unproxiedFlags = _b.sent();
-                        return [3 /*break*/, 4];
-                    case 2: return [4 /*yield*/, initClient(reactOptions, options, platform)];
+                        return [3 /*break*/, 7];
+                    case 2:
+                        client = new FbClientBuilder(__assign({}, options))
+                            .platform(platform)
+                            .build();
+                        _b.label = 3;
                     case 3:
-                        initialisedOutput = _b.sent();
-                        unproxiedFlags = initialisedOutput.flags;
-                        client = initialisedOutput.fbClient;
-                        _b.label = 4;
+                        _b.trys.push([3, 6, , 7]);
+                        return [4 /*yield*/, client.waitForInitialization()];
                     case 4:
-                        this.setState(__assign(__assign({ unproxiedFlags: unproxiedFlags }, getFlagsProxy(client, this.bootstrapFlags, unproxiedFlags, reactOptions)), { fbClient: client }));
+                        _b.sent();
+                        return [4 /*yield*/, fetchFlags(client)];
+                    case 5:
+                        unproxiedFlags = _b.sent();
+                        return [3 /*break*/, 7];
+                    case 6:
+                        e_1 = _b.sent();
+                        error = e_1;
+                        if (error === null || error === void 0 ? void 0 : error.name.toLowerCase().includes('timeout')) {
+                            client.on('failed', this.onFailed);
+                            client.on('ready', function () {
+                                _this.onReady(client, reactOptions);
+                            });
+                        }
+                        return [3 /*break*/, 7];
+                    case 7:
+                        this.setState(function (previousState) { return (__assign(__assign(__assign(__assign({}, previousState), { unproxiedFlags: unproxiedFlags }), getFlagsProxy(client, _this.bootstrapFlags, unproxiedFlags, reactOptions)), { fbClient: client, error: error })); });
                         this.subscribeToChanges(client);
                         return [2 /*return*/];
                 }
@@ -131,7 +167,6 @@ var FbProvider = /** @class */ (function (_super) {
             acc[flag.id] = flag.variation;
             return acc;
         }, {});
-        ;
         _this.state = {
             flags: {},
             unproxiedFlags: {},
@@ -160,7 +195,7 @@ var FbProvider = /** @class */ (function (_super) {
                         if (deferInitialization && !options) {
                             return [2 /*return*/];
                         }
-                        return [4 /*yield*/, this.init()];
+                        return [4 /*yield*/, this.prepareFbClient()];
                     case 1:
                         _b.sent();
                         return [2 /*return*/];
@@ -178,7 +213,7 @@ var FbProvider = /** @class */ (function (_super) {
                         _b = this.props, options = _b.options, deferInitialization = _b.deferInitialization;
                         userJustLoaded = !((_a = prevProps.options) === null || _a === void 0 ? void 0 : _a.user) && (options === null || options === void 0 ? void 0 : options.user);
                         if (!(deferInitialization && userJustLoaded)) return [3 /*break*/, 2];
-                        return [4 /*yield*/, this.init()];
+                        return [4 /*yield*/, this.prepareFbClient()];
                     case 1:
                         _c.sent();
                         _c.label = 2;
@@ -188,14 +223,10 @@ var FbProvider = /** @class */ (function (_super) {
         });
     };
     FbProvider.prototype.render = function () {
-        var _a = this.state, flags = _a.flags, flagKeyMap = _a.flagKeyMap, fbClient = _a.fbClient;
-        // Conditional rendering when fbClient is null
-        if (fbClient === undefined) {
-            return null; // or Loading Indicator or any other placeholder
-        }
-        return React.createElement(Provider, { value: { flags: flags, flagKeyMap: flagKeyMap, fbClient: fbClient } }, this.props.children);
+        var _a = this.state, flags = _a.flags, flagKeyMap = _a.flagKeyMap, fbClient = _a.fbClient, error = _a.error;
+        return React.createElement(Provider, { value: { flags: flags, flagKeyMap: flagKeyMap, fbClient: fbClient, error: error } }, this.props.children);
     };
     return FbProvider;
-}(React.Component));
+}(Component));
 export default FbProvider;
 //# sourceMappingURL=provider.js.map

package/dist/provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"provider.js","sourceRoot":"../src/","sources":["provider.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"provider.js","sourceRoot":"../src/","sources":["provider.tsx"],"names":[],"mappings":"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"}

package/dist/providerState.d.ts

@@ -0,0 +1,9 @@
+import { FlagKeyMap, IFlagSet } from "./types";
+import { IFbClient } from "@featbit/js-client-sdk";
+export interface ProviderState {
+    error?: Error;
+    flagKeyMap: FlagKeyMap;
+    flags: IFlagSet;
+    fbClient?: IFbClient;
+    unproxiedFlags: IFlagSet;
+}

package/dist/providerState.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=providerState.js.map

package/dist/providerState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"providerState.js","sourceRoot":"../src/","sources":["providerState.ts"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@featbit/react-client-sdk",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "FeatBit client SDK for React",
   "keywords": [
     "FeatBit",
@@ -47,7 +47,7 @@
     "typescript": "^4.5.3"
   },
   "dependencies": {
-    "@featbit/js-client-sdk": "^3.0.4",
+    "@featbit/js-client-sdk": "^3.0.6",
     "hoist-non-react-statics": "^3.3.2",
     "lodash.camelcase": "^4.3.0"
   },

package/src/asyncWithFbProvider.tsx

@@ -3,6 +3,8 @@ import { ProviderConfig, defaultReactOptions, IFlagSet } from './types';
 import { Provider } from './context';
 import { initClient } from './initClient';
 import getFlagsProxy from "./getFlagsProxy";
+import { FbClientBuilder } from "@featbit/js-client-sdk";
+import { fetchFlags } from "./utils";
 
 /**
  * This is an async function which initializes feature-flags.co's JS SDK (`@featbit/js-client-sdk`)
@@ -31,7 +33,19 @@ import getFlagsProxy from "./getFlagsProxy";
 export default async function asyncWithFbProvider(config: ProviderConfig) {
   const {options, reactOptions: userReactOptions, platform} = config;
   const reactOptions = {...defaultReactOptions, ...userReactOptions};
-  const { flags: fetchedFlags, fbClient} = await initClient(reactOptions, options, platform);
+  let error: Error;
+  let fetchedFlags: IFlagSet = {};
+
+  const fbClient = new FbClientBuilder({...options})
+    .platform(platform)
+    .build();
+
+  try {
+    await fbClient.waitForInitialization();
+    fetchedFlags = await fetchFlags(fbClient);
+  } catch (e) {
+    error = e as Error;
+  }
 
   const bootstrapFlags = (options?.bootstrap || []).reduce((acc: {[key: string]: string}, flag: any) => {
     acc[flag.id] = flag.variation;
@@ -41,31 +55,63 @@ export default async function asyncWithFbProvider(config: ProviderConfig) {
   const FbProvider = ({children}: { children: ReactNode }) => {
     const [state, setState] = useState(() => ({
       unproxiedFlags: fetchedFlags,
-      ...getFlagsProxy(fbClient, bootstrapFlags, fetchedFlags, reactOptions)
+      ...getFlagsProxy(fbClient, bootstrapFlags, fetchedFlags, reactOptions),
+      fbClient,
+      error,
     }));
 
     useEffect(() => {
-      fbClient.on('update', (changedKeys: string[]) => {
+      async function onReady() {
+        const unproxiedFlags = await fetchFlags(fbClient);
+        setState((prevState) => ({
+          ...prevState,
+          unproxiedFlags,
+          ...getFlagsProxy(fbClient, bootstrapFlags, unproxiedFlags, reactOptions)}));
+      }
+
+      function onFailed(e: Error) {
+        setState((prevState) => ({ ...prevState, error: e }));
+      }
+
+      function onUpdate(changedKeys: string[]) {
         const updates: IFlagSet = changedKeys.reduce(async (acc, key) => {
           acc[key] = await fbClient.variation(key, '');
           return acc;
         }, {} as IFlagSet);
 
         if (Object.keys(updates).length > 0) {
-          setState(({ unproxiedFlags }) => {
-            const updatedUnproxiedFlags = { ...unproxiedFlags, ...updates };
+          setState((prevState) => {
+            const updatedUnproxiedFlags = { ...prevState.unproxiedFlags, ...updates };
 
             return {
+              ...prevState,
               unproxiedFlags: updatedUnproxiedFlags,
               ...getFlagsProxy(fbClient, bootstrapFlags, updatedUnproxiedFlags, reactOptions),
             };
           });
         }
-      });
+      }
+
+      fbClient.on('update', onUpdate);
+
+      // Only subscribe to ready and failed if waitForInitialization timed out
+      // because we want the introduction of init timeout to be as minimal and backwards
+      // compatible as possible.
+      if (error?.name.toLowerCase().includes('timeout')) {
+        fbClient.on('failed', onFailed);
+        fbClient.on('ready', onReady);
+      }
+
+      return function cleanup() {
+        fbClient.off('update', onUpdate);
+        fbClient.off('failed', onFailed);
+        fbClient.off('ready', onReady);
+      };
+
     }, []);
 
-    const { flags, flagKeyMap } = state;
-    return <Provider value={{ flags, flagKeyMap, fbClient }}>{ children }</Provider>;
+    const { unproxiedFlags: _, ...rest }  = state;
+    return <Provider value={rest}>{ children }</Provider>;
   };
 
   return FbProvider;

package/src/context.ts

@@ -10,7 +10,12 @@ interface FbContext {
    */
   flagKeyMap: FlagKeyMap;
 
-  fbClient?: IFbClient
+  fbClient?: IFbClient,
+
+  /**
+   * FeatBit client initialization error, if there was one.
+   */
+  error?: Error,
 }
 
 const context = createContext<FbContext>({flags: {}, flagKeyMap: {}, fbClient: undefined});

package/src/provider.tsx

@@ -1,14 +1,11 @@
-import React from "react";
+import React, { Component, PropsWithChildren }  from "react";
 import { EnhancedComponent, ProviderConfig, defaultReactOptions, IFlagSet } from './types';
-import { Provider, FbContext } from './context';
+import { Provider } from './context';
 import { camelCaseKeys, fetchFlags } from "./utils";
-import { initClient } from './initClient';
-import { IFbClient } from '@featbit/js-client-sdk';
+import { FbClientBuilder, IFbClient } from '@featbit/js-client-sdk';
 import getFlagsProxy from "./getFlagsProxy";
+import { ProviderState } from "./providerState";
 
-interface FbHocState extends FbContext {
-  unproxiedFlags: IFlagSet;
-}
 
 /**
  * The `FbProvider` is a component which accepts a config object which is used to
@@ -27,8 +24,8 @@ interface FbHocState extends FbContext {
  * within your application. This provider is used inside the `withFbProviderHOC` and can be used instead to initialize
  * the `@featbit/js-client-sdk`. For async initialization, check out the `asyncWithFbProvider` function
  */
-class FbProvider extends React.Component<ProviderConfig, FbHocState> implements EnhancedComponent {
-  readonly state: Readonly<FbHocState>;
+class FbProvider extends Component<PropsWithChildren<ProviderConfig>, ProviderState> implements EnhancedComponent {
+  readonly state: Readonly<ProviderState>;
   bootstrapFlags: IFlagSet;
 
   constructor(props: ProviderConfig) {
@@ -38,7 +35,7 @@ class FbProvider extends React.Component<ProviderConfig, FbHocState> implements
     this.bootstrapFlags = (options?.bootstrap || []).reduce((acc: {[key: string]: string}, flag: any) => {
       acc[flag.id] = flag.variation;
       return acc;
-    }, {} as {[key: string]: string});;
+    }, {} as {[key: string]: string});
 
     this.state = {
       flags: {},
@@ -74,32 +71,63 @@ class FbProvider extends React.Component<ProviderConfig, FbHocState> implements
       };
 
       if (Object.keys(updates).length > 0) {
-        this.setState({
+        this.setState((prevState) =>({
+          ...prevState,
           unproxiedFlags,
           ...getFlagsProxy(fbClient, this.bootstrapFlags, unproxiedFlags, this.getReactOptions())
-        })
+        }))
       }
     });
   };
 
-  init = async () => {
+  onFailed = (fbClient: IFbClient, e: Error) => {
+    this.setState((prevState) => ({ ...prevState, error: e }));
+  };
+
+  onReady = async (fbClient: IFbClient, reactOptions: any) => {
+    const unproxiedFlags = await fetchFlags(fbClient);
+    this.setState((prevState) => ({
+      ...prevState,
+      unproxiedFlags,
+      ...getFlagsProxy(fbClient, this.bootstrapFlags, unproxiedFlags, reactOptions)}));
+  };
+
+  prepareFbClient = async () => {
     const {options, platform} = this.props;
     let client: IFbClient = this.props.fbClient!;
     const reactOptions = this.getReactOptions();
-    let unproxiedFlags;
+    let unproxiedFlags = this.state.unproxiedFlags;
+    let error: Error;
+
     if (client) {
       unproxiedFlags = await fetchFlags(client);
     } else {
-      const initialisedOutput = await initClient(reactOptions, options, platform);
-      unproxiedFlags = initialisedOutput.flags;
-      client = initialisedOutput.fbClient!;
+      client = new FbClientBuilder({...options})
+        .platform(platform)
+        .build();
+
+      try {
+        await client.waitForInitialization();
+        unproxiedFlags = await fetchFlags(client);
+      } catch (e) {
+        error = e as Error;
+
+        if (error?.name.toLowerCase().includes('timeout')) {
+          client.on('failed', this.onFailed);
+          client.on('ready', () => {
+            this.onReady(client, reactOptions);
+          });
+        }
+      }
     }
 
-    this.setState({
+    this.setState((previousState) => ({
+      ...previousState,
       unproxiedFlags,
       ...getFlagsProxy(client, this.bootstrapFlags, unproxiedFlags, reactOptions),
-      fbClient: client
-    });
+      fbClient: client,
+      error,
+    }));
 
     this.subscribeToChanges(client);
   };
@@ -110,26 +138,21 @@ class FbProvider extends React.Component<ProviderConfig, FbHocState> implements
       return;
     }
 
-    await this.init();
+    await this.prepareFbClient();
   }
 
   async componentDidUpdate(prevProps: ProviderConfig) {
     const {options, deferInitialization} = this.props;
     const userJustLoaded = !prevProps.options?.user && options?.user;
     if (deferInitialization && userJustLoaded) {
-      await this.init();
+      await this.prepareFbClient();
     }
   }
 
   render() {
-    const {flags, flagKeyMap, fbClient} = this.state;
-
-    // Conditional rendering when fbClient is null
-    if (fbClient === undefined) {
-      return null; // or Loading Indicator or any other placeholder
-    }
+    const {flags, flagKeyMap, fbClient, error} = this.state;
 
-    return <Provider value={{ flags, flagKeyMap, fbClient }}>{ this.props.children }</Provider>;
+    return <Provider value={{ flags, flagKeyMap, fbClient, error }}>{ this.props.children }</Provider>;
   }
 }
 

package/src/providerState.ts

@@ -0,0 +1,10 @@
+import { FlagKeyMap, IFlagSet } from "./types";
+import { IFbClient } from "@featbit/js-client-sdk";
+
+export interface ProviderState {
+  error?: Error;
+  flagKeyMap: FlagKeyMap;
+  flags: IFlagSet;
+  fbClient?: IFbClient;
+  unproxiedFlags: IFlagSet;
+}