@harnessio/ff-react-client-sdk - npm Package Compare versions

Comparing version 1.0.0-alpha.5 to 1.0.0-alpha.6

dist/cjs/context/FFContext.d.ts

@@ -8,3 +8,3 @@ import { FC, PropsWithChildren, ReactNode } from 'react';
 export declare const FFContext: import("react").Context<FFContextValue>;
-export interface FFContextProviderProps extends PropsWithChildren {
+interface FFContextProviderProps extends PropsWithChildren {
     apiKey: string;
@@ -14,3 +14,5 @@ target: Target;
     fallback?: ReactNode;
+    async?: boolean;
 }
 export declare const FFContextProvider: FC<FFContextProviderProps>;
+export {};

dist/cjs/context/FFContext.js

@@ -12,5 +12,6 @@ "use strict";
 exports.FFContext = (0, react_1.createContext)({});
-const FFContextProvider = ({ children, apiKey, target, options = {}, fallback = (0, jsx_runtime_1.jsx)("p", { children: "Loading..." }) }) => {
+const FFContextProvider = ({ children, apiKey, target, options = {}, fallback = (0, jsx_runtime_1.jsx)("p", { children: "Loading..." }), async = false }) => {
     const [loading, setLoading] = (0, react_1.useState)(true);
     const [flags, setFlags] = (0, react_1.useState)({});
+    console.log('ASYNC', async);
     (0, react_1.useEffect)(() => {
@@ -37,2 +38,6 @@ if (apiKey && target) {
             client.on(ff_javascript_client_sdk_1.Event.CHANGED, onFlagChange);
+            client.on(ff_javascript_client_sdk_1.Event.ERROR, (e) => {
+                console.error(e);
+                throw new Error('BALLS!');
+            });
             return () => {
@@ -46,4 +51,4 @@ client.off(ff_javascript_client_sdk_1.Event.READY, onInitialLoad);
     }, [apiKey, JSON.stringify(target)]);
-    return ((0, jsx_runtime_1.jsx)(exports.FFContext.Provider, { value: { loading, flags }, children: loading ? fallback : children }));
+    return ((0, jsx_runtime_1.jsx)(exports.FFContext.Provider, { value: { loading, flags }, children: !async && loading ? fallback : children }));
 };
 exports.FFContextProvider = FFContextProvider;

dist/cjs/hoc/ifFeatureFlag.d.ts

@@ -1,2 +0,6 @@
-import { ComponentType } from 'react';
-export declare function ifFeatureFlag<C>(flagName: string, value?: any): (WrappedComponent: ComponentType<C>) => (props: C) => JSX.Element;
+import { ComponentType, ReactNode } from 'react';
+export interface IfFeatureFlagOptions {
+    matchValue?: unknown;
+    loadingFallback?: ReactNode;
+}
+export declare function ifFeatureFlag<C>(flagName: string, { matchValue, loadingFallback }?: IfFeatureFlagOptions): (WrappedComponent: ComponentType<C>) => (props: C) => JSX.Element;

dist/cjs/hoc/ifFeatureFlag.js

@@ -6,8 +6,11 @@ "use strict";
 const FFContext_1 = require("../context/FFContext");
-function ifFeatureFlag(flagName, value) {
+function ifFeatureFlag(flagName, { matchValue = undefined, loadingFallback = null } = {}) {
     return function ifFeatureFlagHoc(WrappedComponent) {
-        return (props) => ((0, jsx_runtime_1.jsx)(FFContext_1.FFContext.Consumer, { children: ({ flags }) => {
+        return (props) => ((0, jsx_runtime_1.jsx)(FFContext_1.FFContext.Consumer, { children: ({ flags, loading }) => {
+                if (loading) {
+                    return loadingFallback;
+                }
                 const flagValue = flags?.[flagName];
-                if ((value === flagValue && flagName in flags) ||
-                    (value === undefined && !!flagValue)) {
+                if ((matchValue === flagValue && flagName in flags) ||
+                    (matchValue === undefined && !!flagValue)) {
                     return (0, jsx_runtime_1.jsx)(WrappedComponent, { ...props });
@@ -14,0 +17,0 @@ }

dist/cjs/hoc/withFeatureFlags.d.ts

 import { ComponentType } from 'react';
 import { FFContextValue } from '../context/FFContext';
-interface WrappedComponentType {
-    flags: FFContextValue['flags'];
-}
-export declare function withFeatureFlags<C>(WrappedComponent: ComponentType<C & WrappedComponentType>): (props: C) => JSX.Element;
-export {};
+export declare function withFeatureFlags<C>(WrappedComponent: ComponentType<C & FFContextValue>): (props: C) => JSX.Element;

dist/cjs/hoc/withFeatureFlags.js

@@ -7,4 +7,4 @@ "use strict";
 function withFeatureFlags(WrappedComponent) {
-    return (props) => ((0, jsx_runtime_1.jsx)(FFContext_1.FFContext.Consumer, { children: ({ flags }) => (0, jsx_runtime_1.jsx)(WrappedComponent, { flags: flags, ...props }) }));
+    return (props) => ((0, jsx_runtime_1.jsx)(FFContext_1.FFContext.Consumer, { children: ({ flags, loading }) => ((0, jsx_runtime_1.jsx)(WrappedComponent, { flags: flags, loading: loading, ...props })) }));
 }
 exports.withFeatureFlags = withFeatureFlags;

dist/esm/context/FFContext.d.ts

@@ -8,3 +8,3 @@ import { FC, PropsWithChildren, ReactNode } from 'react';
 export declare const FFContext: import("react").Context<FFContextValue>;
-export interface FFContextProviderProps extends PropsWithChildren {
+interface FFContextProviderProps extends PropsWithChildren {
     apiKey: string;
@@ -14,3 +14,5 @@ target: Target;
     fallback?: ReactNode;
+    async?: boolean;
 }
 export declare const FFContextProvider: FC<FFContextProviderProps>;
+export {};

dist/esm/context/FFContext.js

@@ -6,5 +6,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 export const FFContext = createContext({});
-export const FFContextProvider = ({ children, apiKey, target, options = {}, fallback = _jsx("p", { children: "Loading..." }) }) => {
+export const FFContextProvider = ({ children, apiKey, target, options = {}, fallback = _jsx("p", { children: "Loading..." }), async = false }) => {
     const [loading, setLoading] = useState(true);
     const [flags, setFlags] = useState({});
+    console.log('ASYNC', async);
     useEffect(() => {
@@ -31,2 +32,6 @@ if (apiKey && target) {
             client.on(FFEvent.CHANGED, onFlagChange);
+            client.on(FFEvent.ERROR, (e) => {
+                console.error(e);
+                throw new Error('BALLS!');
+            });
             return () => {
@@ -40,3 +45,3 @@ client.off(FFEvent.READY, onInitialLoad);
     }, [apiKey, JSON.stringify(target)]);
-    return (_jsx(FFContext.Provider, { value: { loading, flags }, children: loading ? fallback : children }));
+    return (_jsx(FFContext.Provider, { value: { loading, flags }, children: !async && loading ? fallback : children }));
 };

dist/esm/hoc/ifFeatureFlag.d.ts

@@ -1,2 +0,6 @@
-import { ComponentType } from 'react';
-export declare function ifFeatureFlag<C>(flagName: string, value?: any): (WrappedComponent: ComponentType<C>) => (props: C) => JSX.Element;
+import { ComponentType, ReactNode } from 'react';
+export interface IfFeatureFlagOptions {
+    matchValue?: unknown;
+    loadingFallback?: ReactNode;
+}
+export declare function ifFeatureFlag<C>(flagName: string, { matchValue, loadingFallback }?: IfFeatureFlagOptions): (WrappedComponent: ComponentType<C>) => (props: C) => JSX.Element;

dist/esm/hoc/ifFeatureFlag.js

 import { jsx as _jsx } from "react/jsx-runtime";
 import { FFContext } from '../context/FFContext';
-export function ifFeatureFlag(flagName, value) {
+export function ifFeatureFlag(flagName, { matchValue = undefined, loadingFallback = null } = {}) {
     return function ifFeatureFlagHoc(WrappedComponent) {
-        return (props) => (_jsx(FFContext.Consumer, { children: ({ flags }) => {
+        return (props) => (_jsx(FFContext.Consumer, { children: ({ flags, loading }) => {
+                if (loading) {
+                    return loadingFallback;
+                }
                 const flagValue = flags?.[flagName];
-                if ((value === flagValue && flagName in flags) ||
-                    (value === undefined && !!flagValue)) {
+                if ((matchValue === flagValue && flagName in flags) ||
+                    (matchValue === undefined && !!flagValue)) {
                     return _jsx(WrappedComponent, { ...props });
@@ -10,0 +13,0 @@ }

dist/esm/hoc/withFeatureFlags.d.ts

 import { ComponentType } from 'react';
 import { FFContextValue } from '../context/FFContext';
-interface WrappedComponentType {
-    flags: FFContextValue['flags'];
-}
-export declare function withFeatureFlags<C>(WrappedComponent: ComponentType<C & WrappedComponentType>): (props: C) => JSX.Element;
-export {};
+export declare function withFeatureFlags<C>(WrappedComponent: ComponentType<C & FFContextValue>): (props: C) => JSX.Element;

dist/esm/hoc/withFeatureFlags.js

 import { jsx as _jsx } from "react/jsx-runtime";
 import { FFContext } from '../context/FFContext';
 export function withFeatureFlags(WrappedComponent) {
-    return (props) => (_jsx(FFContext.Consumer, { children: ({ flags }) => _jsx(WrappedComponent, { flags: flags, ...props }) }));
+    return (props) => (_jsx(FFContext.Consumer, { children: ({ flags, loading }) => (_jsx(WrappedComponent, { flags: flags, loading: loading, ...props })) }));
 }

package.json

 {
   "name": "@harnessio/ff-react-client-sdk",
-  "version": "1.0.0-alpha.5",
+  "version": "1.0.0-alpha.6",
   "author": "Harness",
@@ -5,0 +5,0 @@ "license": "Apache-2.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Unpublished package

Supply chain risk

Package version was not found on the registry. It may exist on a different registry and need to be configured to pull from that registry.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

35830

increased by2.83%

Lines of code

317

increased by6.73%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes