Polishing

Author: EmilianoSanchez

CHANGES.txt

@@ -7,7 +7,7 @@
  - BREAKING CHANGES:
       - Updated the default value of the `updateOnSdkUpdate` and `updateOnSdkTimedout` parameters of the `useSplitClient` and `useSplitTreatments` hooks options object to `true`, to re-render on all SDK events by default. The same applies for the equivalent props in the `[with]SplitClient` and `[with]SplitTreatments` components.
       - Updated error handling: using the library modules without wrapping them in a `SplitFactoryProvider` component will now throw an error instead of logging it, as the modules requires the `SplitContext` to work properly.
-      - Updated the `SplitFactoryProvider` component to not accept a child as a function (render prop), to avoid unnecessary re-renders when using the library hooks. Refer to ./MIGRATION-GUIDE.md for instructions on how to migrate the child as a function to a regular React element.
+      - Updated the `SplitFactoryProvider` component to not accept a child as a function (render prop), to avoid unnecessary re-renders when using the library hooks. Refer to ./MIGRATION-GUIDE.md for instructions on how to migrate your component to be passed as a regular React JSX element if you were using this pattern.
       - Removed the `core.trafficType` option from the SDK configuration object, and the `trafficType` parameter from the SDK `client()` method, `useSplitClient`, `useTrack`, `withSplitClient` and `SplitClient` component. This is because traffic types can no longer be bound to SDK clients in JavaScript SDK v11.0.0, and so the traffic type must be provided as first argument in the `track` method calls.
       - Removed deprecated modules: `SplitFactory` component, `useClient`, `useTreatments` and `useManager` hooks. Refer to ./MIGRATION-GUIDE.md for instructions on how to migrate to the new alternatives.
       - Renamed `SplitSdk` to `SplitFactory` function, which is the underlying Split SDK factory, i.e., `import { SplitFactory } from '@splitsoftware/splitio'`.

MIGRATION-GUIDE.md

@@ -3,11 +3,11 @@
 
 React SDK v2.0.0 has a few breaking changes that you should consider when migrating from a previous version. The main changes are:
 
-- Deprecated `useClient`, `useTreatments`, and `useManager` hooks have been removed.
+- **Deprecated `useClient`, `useTreatments`, and `useManager` hooks have been removed.**
 
 Follow [this section](#migrating-to-get-react-sdk-v1100-improvements-replacing-the-deprecated-useclient-usetreatments-and-usemanager-hooks) to migrate to the new hooks `useSplitClient`, `useSplitTreatments`, and `useSplitManager` respectively.
 
-- Deprecated `SplitFactory` provider has been removed, `withSplitFactory` is deprecated, and `SplitFactoryProvider` doesn't accept `updateOn` props and a render function as children anymore.
+- **Deprecated `SplitFactory` provider has been removed, `withSplitFactory` is deprecated, and `SplitFactoryProvider` doesn't accept `updateOn` props and a render function as children anymore.**
 
 To migrate your existing code to the new version of `SplitFactoryProvider`, consider the following refactor example. Replace:
 
@@ -37,22 +37,22 @@ const App = () => {
 
 // or withSplitFactory
 const App = withSplitFactory(mySplitConfig, undefined, DEFAULT_CLIENT_ATTRIBUTES)(
-  MyComponent, false /* updateOnSdkUpdate */
+  MyComponent, false /* updateOnSdkUpdate = false */
 );
 ```
 
 with:
 
 ```tsx
 const MyComponent = () => {
-  const props: ISplitContextValues = useSplitClient({ updateOnSdkUpdate: false,  attributes: DEFAULT_CLIENT_ATTRIBUTES });
+  const props: ISplitContextValues = useSplitClient({ updateOnSdkUpdate: false });
   const { factory, client, isReady, isReadyFromCache, ... } = props;
   ...
 };
 
 const App = () => {
   return (
-    <SplitFactoryProvider config={mySplitConfig} >
+    <SplitFactoryProvider config={mySplitConfig} attributes={DEFAULT_CLIENT_ATTRIBUTES} >
       <MyComponent />
     </SplitFactoryProvider>
   );
@@ -62,9 +62,9 @@ const App = () => {
 Notice that `MyComponent` was refactored to use the `useSplitClient` hook and is passed as a React element rather than a render function as children.
 The `useSplitClient` hook is called without providing an `splitKey` param, meaning that the client at the context will be used, i.e., the default client which key is set in the `core.key` property of the `mySplitConfig` object, and the `updateOn` and `attributes` props are passed as options to the hook.
 
-- High-Order-Components (`withSplitClient`, `withSplitTreatments`) and components that accept a render function as child component (`SplitTreatments`, and `SplitClient`) have been deprecated and might be removed in future major releases. The deprecation is intended to simplify the API and discourage the use of old patterns (HOCs and render props) in favor of hook alternatives to take advantage of React optimizations.
+- **High-Order-Components (`withSplitClient`, `withSplitTreatments`) and components that accept a render function as child component (`SplitTreatments`, and `SplitClient`) have been deprecated and might be removed in a future major release.**
 
-To migrate your existing code based on `withSplitClient` or `SplitClient`, consider the following refactor using the `useSplitClient` hook. Replace:
+The deprecation is intended to simplify the API and discourage the use of old patterns (HOCs and render props) in favor of hook alternatives to take advantage of React optimizations. To migrate your existing code based on `withSplitClient` or `SplitClient`, consider the following refactor using the `useSplitClient` hook. Replace:
 
 ```tsx
 const MyComponent = (props: ISplitContextValues) => {
@@ -73,16 +73,16 @@ const MyComponent = (props: ISplitContextValues) => {
 };
 
 const App = withSplitFactory(mySplitConfig)(
-  withSplitClient(KEY)(
-    MyComponent, undefined, undefined, undefined, false /* updateOnSdkReadyFromCache */
+  withSplitClient(OTHER_KEY, OTHER_KEY_ATTRIBUTES)(
+    MyComponent, undefined, undefined, undefined, false /* updateOnSdkReadyFromCache = false */
   )
 );
 
 // or
 const App = () => {
   return (
     <SplitFactory config={mySplitConfig} >
-      <SplitClient splitKey={KEY} updateOnSdkReadyFromCache={false} >
+      <SplitClient splitKey={OTHER_KEY} attributes={OTHER_KEY_ATTRIBUTES} updateOnSdkReadyFromCache={false} >
         {MyComponent}
       </SplitClient>
     </SplitFactory>
@@ -94,7 +94,7 @@ with:
 
 ```tsx
 const MyComponent = () => {
-  const props: ISplitContextValues = useSplitClient({ splitKey: KEY, updateOnSdkReadyFromCache: false });
+  const props: ISplitContextValues = useSplitClient({ splitKey: OTHER_KEY, attributes: OTHER_KEY_ATTRIBUTES, updateOnSdkReadyFromCache: false });
   const { client, isReady, ... } = props;
   ...
 };
@@ -117,9 +117,9 @@ const MyComponent = (props: ISplitTreatmentsChildProps) => {
 };
 
 const App = withSplitFactory(mySplitConfig)(
-  withSplitClient(KEY)(
+  withSplitClient(OTHER_KEY)(
     withSplitTreatments(FEATURE_FLAG_NAMES, ATTRIBUTES)(
-      MyComponent, undefined, undefined, undefined, false /* updateOnSdkReadyFromCache */
+      MyComponent
     )
   )
 );
@@ -128,7 +128,7 @@ const App = withSplitFactory(mySplitConfig)(
 const App = () => {
   return (
     <SplitFactory config={mySplitConfig} >
-      <SplitClient splitKey={KEY} updateOnSdkReadyFromCache={false} >
+      <SplitClient splitKey={OTHER_KEY} >
         <SplitTreatments names={FEATURE_FLAG_NAMES} attributes={ATTRIBUTES} >
           {MyComponent}
         </SplitTreatments>
@@ -142,7 +142,7 @@ with:
 
 ```tsx
 const MyComponent = () => {
-  const props: ISplitTreatmentsChildProps = useSplitTreatments({ splitKey: KEY, names: FEATURE_FLAG_NAMES, attributes: ATTRIBUTES, updateOnSdkReadyFromCache: false });
+  const props: ISplitTreatmentsChildProps = useSplitTreatments({ splitKey: OTHER_KEY, names: FEATURE_FLAG_NAMES, attributes: ATTRIBUTES });
   const { treatments, isReady, ... } = props;
   ...
 };
@@ -156,7 +156,7 @@ const App = () => {
 };
 ```
 
-- Renamed `SplitSdk` function to `SplitFactory`.
+- **Renamed `SplitSdk` function to `SplitFactory`.**
 
 If you are using the `SplitSdk` function to create a factory and pass it to the `SplitFactoryProvider` component, you should rename it to `SplitFactory`. For example:
 
@@ -190,7 +190,7 @@ const App = () => {
 };
 ```
 
-- Traffic type cannot be bound to SDK clients anymore.
+- **Traffic type cannot be bound to SDK clients anymore.**
 
 If you were passing the `trafficType` to the SDK config or the `useSplitClient` or `useTrack` hooks, you should remove it. The `trafficType` is now required to be passed as initial argument of the `track` method. For example: