From cf158efdbd8136a33ca0b0c2209892587181f6b6 Mon Sep 17 00:00:00 2001
From: Emiliano Sanchez <emiliano.sanchez@split.io>
Date: Fri, 5 Jan 2024 16:31:19 -0300
Subject: [PATCH 1/2] Updated code to avoid errors when passing factory or
 config props on the server-side

---
 src/SplitFactory.tsx | 10 +++++++++-
 src/types.ts         | 11 +++++++++--
 src/utils.ts         | 11 +++++++++++
 3 files changed, 29 insertions(+), 3 deletions(-)

diff --git a/src/SplitFactory.tsx b/src/SplitFactory.tsx
index ef390c5..29b3756 100644
--- a/src/SplitFactory.tsx
+++ b/src/SplitFactory.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import { SplitComponent } from './SplitClient';
 import { ISplitFactoryProps } from './types';
 import { WARN_SF_CONFIG_AND_FACTORY, ERROR_SF_NO_CONFIG_AND_FACTORY } from './constants';
-import { getSplitFactory, destroySplitFactory, IFactoryWithClients, getSplitClient } from './utils';
+import { getSplitFactory, destroySplitFactory, IFactoryWithClients, getSplitClient, isServerEnvironment } from './utils';
 import { DEFAULT_UPDATE_OPTIONS } from './useSplitClient';
 
 /**
@@ -30,6 +30,14 @@ export class SplitFactory extends React.Component<ISplitFactoryProps, { factory:
 
     let { factory, config } = props;
 
+    // At the moment, SSR is supported only with the SDK running in the client. So, it cannot create or use factory in server-side.
+    if (isServerEnvironment) {
+      // @TODO Remove when SSR is supported with the SDK running in the server (initialState prop)
+      factory = undefined;
+      // @TODO Remove when SplitFactory component creates the factory in the commit phase (breaking change)
+      config = undefined;
+    }
+
     // Instantiate factory
     if (!factory && config) {
       // We use an idempotent variant of the Split factory builder (i.e., given the same config, it returns the same already
diff --git a/src/types.ts b/src/types.ts
index 83d4b26..c224474 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -45,12 +45,19 @@ export interface ISplitStatus {
 export interface ISplitContextValues extends ISplitStatus {
 
   /**
-   * Split factory instance
+   * Split factory instance.
+   *
+   * NOTE: This property is not recommended for direct use, as better alternatives are available.
+   * It should not be used for server-side rendering.
    */
   factory: SplitIO.IBrowserSDK | null;
 
   /**
-   * Split client instance
+   * Split client instance.
+   *
+   * NOTE: This property is not recommended for direct use, as better alternatives are available.
+   * It should not be used for server-side rendering.
+   *
    * @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 | null;
diff --git a/src/utils.ts b/src/utils.ts
index 760077a..41927e1 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -205,3 +205,14 @@ function evaluateFeatureFlags(client: SplitIO.IBrowserClient | null, _lastUpdate
       getControlTreatmentsWithConfig(names) :
       {} // empty object when evaluating with flag sets and client is not ready
 }
+
+// Utils based on https://github.com/alex-cory/use-ssr and https://github.com/facebook/react/blob/main/packages/shared/ExecutionEnvironment.js
+const canUseDOM: boolean = !!(
+  typeof window !== 'undefined' &&
+  window.document &&
+  window.document.createElement
+)
+
+const canUseNative: boolean = typeof navigator != 'undefined' && navigator.product == 'ReactNative'
+
+export const isServerEnvironment = !canUseDOM && !canUseNative

From 4234cb04ff1a0585d97b0d64f42490cdcb5350dc Mon Sep 17 00:00:00 2001
From: Emiliano Sanchez <emiliano.sanchez@split.io>
Date: Sat, 6 Jan 2024 13:28:06 -0300
Subject: [PATCH 2/2] Add changelog entry

---
 CHANGES.txt          | 4 ++++
 package-lock.json    | 4 ++--
 package.json         | 2 +-
 src/SplitFactory.tsx | 2 +-
 src/types.ts         | 6 +++---
 5 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/CHANGES.txt b/CHANGES.txt
index 7f32a73..b1681e0 100644
--- a/CHANGES.txt
+++ b/CHANGES.txt
@@ -1,3 +1,7 @@
+1.11.0 (January 11, 2023)
+ - Updated the `SplitFactory` component provider to support server-side rendering (Related to issue #11 and #109). See our documentation for more details: https://help.split.io/hc/en-us/articles/360038825091-React-SDK#server-side-rendering
+ - Updated internal code to remove a circular dependency and avoid warning messages with tools like PNPM (Related to issue #176).
+
 1.10.2 (December 12, 2023)
  - Updated @splitsoftware/splitio package to version 10.24.1 that updates localStorage usage to clear cached feature flag definitions before initiating the synchronization process, if the cache was previously synchronized with a different SDK key (i.e., a different environment) or different Split Filter criteria, to avoid using invalid cached data when the SDK is ready from cache.
 
diff --git a/package-lock.json b/package-lock.json
index cbf4ac1..102c89d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@splitsoftware/splitio-react",
-  "version": "1.10.3-rc.0",
+  "version": "1.10.3-rc.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@splitsoftware/splitio-react",
-      "version": "1.10.3-rc.0",
+      "version": "1.10.3-rc.1",
       "license": "Apache-2.0",
       "dependencies": {
         "@splitsoftware/splitio": "10.25.0",
diff --git a/package.json b/package.json
index 058de08..bfe607c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@splitsoftware/splitio-react",
-  "version": "1.10.3-rc.0",
+  "version": "1.10.3-rc.1",
   "description": "A React library to easily integrate and use Split JS SDK",
   "main": "lib/index.js",
   "module": "es/index.js",
diff --git a/src/SplitFactory.tsx b/src/SplitFactory.tsx
index 29b3756..d2c5c40 100644
--- a/src/SplitFactory.tsx
+++ b/src/SplitFactory.tsx
@@ -30,7 +30,7 @@ export class SplitFactory extends React.Component<ISplitFactoryProps, { factory:
 
     let { factory, config } = props;
 
-    // At the moment, SSR is supported only with the SDK running in the client. So, it cannot create or use factory in server-side.
+    // At the moment, SSR is supported only with the SDK running in the client. So, it cannot create or use a factory in server-side, to avoid instantiating a factory per request/session.
     if (isServerEnvironment) {
       // @TODO Remove when SSR is supported with the SDK running in the server (initialState prop)
       factory = undefined;
diff --git a/src/types.ts b/src/types.ts
index c224474..9f069bf 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -48,15 +48,15 @@ export interface ISplitContextValues extends ISplitStatus {
    * Split factory instance.
    *
    * NOTE: This property is not recommended for direct use, as better alternatives are available.
-   * It should not be used for server-side rendering.
+   * It should not be used for server-side rendering, since it is null on the server and might cause a hydration mismatch.
    */
   factory: SplitIO.IBrowserSDK | null;
 
   /**
    * Split client instance.
    *
-   * NOTE: This property is not recommended for direct use, as better alternatives are available.
-   * It should not be used for server-side rendering.
+   * Caveat: This property is not recommended for direct use, as better alternatives are available.
+   * It should not be used for server-side rendering, since it is null on the server and might cause a hydration mismatch.
    *
    * @see {@link https://help.split.io/hc/en-us/articles/360020448791-JavaScript-SDK#2-instantiate-the-sdk-and-create-a-new-split-client}
    */