diff --git a/src/SplitFactoryProvider.tsx b/src/SplitFactoryProvider.tsx index 0ed3112..cd9420f 100644 --- a/src/SplitFactoryProvider.tsx +++ b/src/SplitFactoryProvider.tsx @@ -21,7 +21,6 @@ export function SplitFactoryProvider(props: ISplitFactoryProviderProps) { const factory = React.useMemo(() => { return propFactory || (config ? getSplitFactory(config) : undefined); }, [config, propFactory]); - const client = factory ? getSplitClient(factory) : undefined; // Effect to initialize and destroy the factory React.useEffect(() => { @@ -41,9 +40,7 @@ export function SplitFactoryProvider(props: ISplitFactoryProviderProps) { }, [config, propFactory]); return ( - + {props.children} ); diff --git a/src/__tests__/SplitContext.test.tsx b/src/__tests__/SplitContext.test.tsx index 5388adb..73fce28 100644 --- a/src/__tests__/SplitContext.test.tsx +++ b/src/__tests__/SplitContext.test.tsx @@ -2,7 +2,6 @@ import React from 'react'; import { render } from '@testing-library/react'; import { SplitContext } from '../SplitContext'; import { SplitFactoryProvider } from '../SplitFactoryProvider'; -import { INITIAL_STATUS } from './testUtils/utils'; /** * Test default SplitContext value @@ -23,11 +22,7 @@ test('SplitContext.Consumer shows value when wrapped in a SplitFactoryProvider', {(value) => { - expect(value).toEqual({ - ...INITIAL_STATUS, - factory: undefined, - client: undefined - }); + expect(value).toEqual({ factory: undefined }); return null; }} diff --git a/src/__tests__/SplitFactoryProvider.test.tsx b/src/__tests__/SplitFactoryProvider.test.tsx index 16564a9..9dbcd63 100644 --- a/src/__tests__/SplitFactoryProvider.test.tsx +++ b/src/__tests__/SplitFactoryProvider.test.tsx @@ -26,11 +26,7 @@ describe('SplitFactoryProvider', () => { {React.createElement(() => { const context = useSplitContext(); - expect(context).toEqual({ - ...INITIAL_STATUS, - factory: getLastInstance(SplitFactory), - client: getLastInstance(SplitFactory).client(), - }); + expect(context).toEqual({ factory: getLastInstance(SplitFactory) }); return null; })} diff --git a/src/types.ts b/src/types.ts index 726e895..9b6e02b 100644 --- a/src/types.ts +++ b/src/types.ts @@ -43,7 +43,7 @@ export interface ISplitStatus { /** * Split Context Value interface. It is used to define the value types of Split Context */ -export interface ISplitContextValues extends ISplitStatus { +export interface ISplitContextValues { /** * Split factory instance. @@ -51,15 +51,6 @@ export interface ISplitContextValues extends ISplitStatus { * NOTE: This property is not recommended for direct use, as better alternatives are available. */ factory?: SplitIO.IBrowserSDK; - - /** - * Split client instance. - * - * NOTE: This property is not recommended for direct use, as better alternatives are available. - * - * @see {@link https://help.split.io/hc/en-us/articles/360020448791-JavaScript-SDK#2-instantiate-the-sdk-and-create-a-new-split-client} - */ - client?: SplitIO.IBrowserClient; } /** @@ -151,6 +142,18 @@ export interface IUseSplitClientOptions extends IUpdateProps { attributes?: SplitIO.Attributes; } +export interface IUseSplitClientResult extends ISplitContextValues, ISplitStatus { + + /** + * Split client instance. + * + * NOTE: This property is not recommended for direct use, as better alternatives are available. + * + * @see {@link https://help.split.io/hc/en-us/articles/360020448791-JavaScript-SDK#2-instantiate-the-sdk-and-create-a-new-split-client} + */ + client?: SplitIO.IBrowserClient; +} + export type GetTreatmentsOptions = ({ /** @@ -182,7 +185,7 @@ export type IUseSplitTreatmentsOptions = GetTreatmentsOptions & IUseSplitClientO /** * useSplitTreatments hook result. */ -export interface IUseSplitTreatmentsResult extends ISplitContextValues { +export interface IUseSplitTreatmentsResult extends IUseSplitClientResult { /** * An object with the treatments with configs for a bulk of feature flags, returned by client.getTreatmentsWithConfig(). diff --git a/src/useSplitClient.ts b/src/useSplitClient.ts index 2f75aef..a08706b 100644 --- a/src/useSplitClient.ts +++ b/src/useSplitClient.ts @@ -1,7 +1,7 @@ import React from 'react'; import { useSplitContext } from './SplitContext'; import { getSplitClient, initAttributes, IClientWithContext, getStatus } from './utils'; -import { ISplitContextValues, IUseSplitClientOptions } from './types'; +import { IUseSplitClientResult, IUseSplitClientOptions } from './types'; export const DEFAULT_UPDATE_OPTIONS = { updateOnSdkUpdate: false, @@ -23,19 +23,16 @@ export const DEFAULT_UPDATE_OPTIONS = { * * @see {@link https://help.split.io/hc/en-us/articles/360020448791-JavaScript-SDK#advanced-instantiate-multiple-sdk-clients} */ -export function useSplitClient(options?: IUseSplitClientOptions): ISplitContextValues { +export function useSplitClient(options?: IUseSplitClientOptions): IUseSplitClientResult { const { updateOnSdkReady, updateOnSdkReadyFromCache, updateOnSdkTimedout, updateOnSdkUpdate, splitKey, attributes } = { ...DEFAULT_UPDATE_OPTIONS, ...options }; - const context = useSplitContext(); - const { client: contextClient, factory } = context; + const { factory } = useSplitContext(); + + // @TODO `getSplitClient` starts client sync. Move side effects to useEffect + const client = factory ? getSplitClient(factory, splitKey) : undefined; - let client = contextClient as IClientWithContext; - if (splitKey && factory) { - // @TODO `getSplitClient` starts client sync. Move side effects to useEffect - client = getSplitClient(factory, splitKey); - } initAttributes(client, attributes); const status = getStatus(client); diff --git a/src/useSplitTreatments.ts b/src/useSplitTreatments.ts index a7cafd7..df9eb41 100644 --- a/src/useSplitTreatments.ts +++ b/src/useSplitTreatments.ts @@ -1,6 +1,6 @@ import React from 'react'; import { memoizeGetTreatmentsWithConfig } from './utils'; -import { IUseSplitTreatmentsResult, IUseSplitTreatmentsOptions } from './types'; +import { IUseSplitClientResult, IUseSplitTreatmentsOptions } from './types'; import { useSplitClient } from './useSplitClient'; /** @@ -17,7 +17,21 @@ import { useSplitClient } from './useSplitClient'; * * @see {@link https://help.split.io/hc/en-us/articles/360020448791-JavaScript-SDK#get-treatments-with-configurations} */ -export function useSplitTreatments(options: IUseSplitTreatmentsOptions): IUseSplitTreatmentsResult { +export function useSplitTreatments(options: IUseSplitTreatmentsOptions): IUseSplitClientResult & { + + /** + * An object with the treatments with configs for a bulk of feature flags, returned by client.getTreatmentsWithConfig(). + * Each existing configuration is a stringified version of the JSON you defined on the Split user interface. For example: + * + * ```js + * { + * feature1: { treatment: 'on', config: null }, + * feature2: { treatment: 'off', config: '{"bannerText":"Click here."}' } + * } + * ``` + */ + treatments: SplitIO.TreatmentsWithConfig; +} { const context = useSplitClient({ ...options, attributes: undefined }); const { client, lastUpdate } = context; const { names, flagSets, attributes } = options;