Reduce SplitContext only to the factory

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 (
-    <SplitContext.Provider value={{
-      factory, client, ...getStatus(client)
-    }} >
+    <SplitContext.Provider value={{ factory }} >
       {props.children}
     </SplitContext.Provider>
   );

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',
     <SplitFactoryProvider >
       <SplitContext.Consumer>
         {(value) => {
-          expect(value).toEqual({
-            ...INITIAL_STATUS,
-            factory: undefined,
-            client: undefined
-          });
+          expect(value).toEqual({ factory: undefined });
           return null;
         }}
       </SplitContext.Consumer>

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;
         })}
       </SplitFactoryProvider>

src/types.ts

@@ -43,23 +43,14 @@ 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.
    *
    * 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().

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);

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;