From 0ad061025073b092edfcc85bdcf6919152c6196b Mon Sep 17 00:00:00 2001
From: Marco Salazar <salazarm@fb.com>
Date: Mon, 14 Feb 2022 10:32:06 -0500
Subject: [PATCH] gate behind feature flag

---
 .../src/__tests__/ReactFlight-test.js         | 359 +++++++++---------
 packages/react-is/src/ReactIs.js              |   2 +
 .../src/ReactFiberHooks.new.js                | 153 +++++---
 .../src/ReactFiberNewContext.new.js           |   8 +-
 .../src/ReactInternalTypes.js                 |   4 +-
 .../react-server/src/ReactFlightServer.js     |   1 -
 packages/react/src/ReactServerContext.js      |  15 +-
 packages/shared/ReactFeatureFlags.js          |   2 +
 .../forks/ReactFeatureFlags.native-fb.js      |   2 +
 .../forks/ReactFeatureFlags.native-oss.js     |   1 +
 .../forks/ReactFeatureFlags.test-renderer.js  |   1 +
 .../ReactFeatureFlags.test-renderer.www.js    |   1 +
 .../shared/forks/ReactFeatureFlags.testing.js |   1 +
 .../forks/ReactFeatureFlags.testing.www.js    |   2 +-
 .../shared/forks/ReactFeatureFlags.www.js     |   1 +
 scripts/error-codes/codes.json                |   3 +-
 16 files changed, 313 insertions(+), 243 deletions(-)

diff --git a/packages/react-client/src/__tests__/ReactFlight-test.js b/packages/react-client/src/__tests__/ReactFlight-test.js
index 54ab8aa87bfcb..d86e9cad522d4 100644
--- a/packages/react-client/src/__tests__/ReactFlight-test.js
+++ b/packages/react-client/src/__tests__/ReactFlight-test.js
@@ -305,219 +305,232 @@ describe('ReactFlight', () => {
     );
   });
 
-  it('supports basic createServerContext usage', () => {
-    const ServerContext = React.createServerContext(
-      'ServerContext',
-      'hello from server',
-    );
-    function Foo() {
-      const context = React.useServerContext(ServerContext);
-      return <div>{context}</div>;
-    }
+  describe('ServerContext', () => {
+    // @gate enableServerContext
+    it('supports basic createServerContext usage', () => {
+      const ServerContext = React.createServerContext(
+        'ServerContext',
+        'hello from server',
+      );
+      function Foo() {
+        const context = React.useServerContext(ServerContext);
+        return <div>{context}</div>;
+      }
 
-    const transport = ReactNoopFlightServer.render(<Foo />);
-    act(() => {
-      ServerContext._currentRenderer = null;
-      ServerContext._currentRenderer2 = null;
-      ReactNoop.render(ReactNoopFlightClient.read(transport));
+      const transport = ReactNoopFlightServer.render(<Foo />);
+      act(() => {
+        ServerContext._currentRenderer = null;
+        ServerContext._currentRenderer2 = null;
+        ReactNoop.render(ReactNoopFlightClient.read(transport));
+      });
+
+      expect(ReactNoop).toMatchRenderedOutput(<div>hello from server</div>);
     });
 
-    expect(ReactNoop).toMatchRenderedOutput(<div>hello from server</div>);
-  });
+    // @gate enableServerContext
+    it('propagates ServerContext providers in flight', () => {
+      const ServerContext = React.createServerContext(
+        'ServerContext',
+        'default hello from server',
+      );
 
-  it('propagates ServerContext providers in flight', () => {
-    const ServerContext = React.createServerContext(
-      'ServerContext',
-      'default hello from server',
-    );
+      function Foo() {
+        return (
+          <div>
+            <ServerContext.Provider value="hi this is server">
+              <Bar />
+            </ServerContext.Provider>
+          </div>
+        );
+      }
+      function Bar() {
+        const context = React.useServerContext(ServerContext);
+        return context;
+      }
 
-    function Foo() {
-      return (
-        <div>
-          <ServerContext.Provider value="hi this is server">
-            <Bar />
-          </ServerContext.Provider>
-        </div>
-      );
-    }
-    function Bar() {
-      const context = React.useServerContext(ServerContext);
-      return context;
-    }
+      const transport = ReactNoopFlightServer.render(<Foo />);
+      act(() => {
+        ServerContext._currentRenderer = null;
+        ServerContext._currentRenderer2 = null;
+        ReactNoop.render(ReactNoopFlightClient.read(transport));
+      });
 
-    const transport = ReactNoopFlightServer.render(<Foo />);
-    act(() => {
-      ServerContext._currentRenderer = null;
-      ServerContext._currentRenderer2 = null;
-      ReactNoop.render(ReactNoopFlightClient.read(transport));
+      expect(ReactNoop).toMatchRenderedOutput(<div>hi this is server</div>);
     });
 
-    expect(ReactNoop).toMatchRenderedOutput(<div>hi this is server</div>);
-  });
-
-  it('propagates ServerContext and cleansup providers in flight', () => {
-    const ServerContext = React.createServerContext(
-      'ServerContext',
-      'default hello from server',
-    );
+    // @gate enableServerContext
+    it('propagates ServerContext and cleansup providers in flight', () => {
+      const ServerContext = React.createServerContext(
+        'ServerContext',
+        'default hello from server',
+      );
 
-    function Foo() {
-      return (
-        <>
-          <ServerContext.Provider value="hi this is server outer">
-            <ServerContext.Provider value="hi this is server">
+      function Foo() {
+        return (
+          <>
+            <ServerContext.Provider value="hi this is server outer">
+              <ServerContext.Provider value="hi this is server">
+                <Bar />
+              </ServerContext.Provider>
+              <ServerContext.Provider value="hi this is server2">
+                <Bar />
+              </ServerContext.Provider>
               <Bar />
             </ServerContext.Provider>
-            <ServerContext.Provider value="hi this is server2">
+            <ServerContext.Provider value="hi this is server outer2">
               <Bar />
             </ServerContext.Provider>
             <Bar />
-          </ServerContext.Provider>
-          <ServerContext.Provider value="hi this is server outer2">
-            <Bar />
-          </ServerContext.Provider>
-          <Bar />
-        </>
-      );
-    }
-    function Bar() {
-      const context = React.useServerContext(ServerContext);
-      return <span>{context}</span>;
-    }
-
-    const transport = ReactNoopFlightServer.render(<Foo />);
-    act(() => {
-      ServerContext._currentRenderer = null;
-      ServerContext._currentRenderer2 = null;
-      ReactNoop.render(ReactNoopFlightClient.read(transport));
-    });
+          </>
+        );
+      }
+      function Bar() {
+        const context = React.useServerContext(ServerContext);
+        return <span>{context}</span>;
+      }
 
-    expect(ReactNoop).toMatchRenderedOutput(
-      <>
-        <span>hi this is server</span>
-        <span>hi this is server2</span>
-        <span>hi this is server outer</span>
-        <span>hi this is server outer2</span>
-        <span>default hello from server</span>
-      </>,
-    );
-  });
+      const transport = ReactNoopFlightServer.render(<Foo />);
+      act(() => {
+        ServerContext._currentRenderer = null;
+        ServerContext._currentRenderer2 = null;
+        ReactNoop.render(ReactNoopFlightClient.read(transport));
+      });
 
-  it('propagates ServerContext providers in flight after suspending', async () => {
-    const ServerContext = React.createServerContext(
-      'ServerContext',
-      'default hello from server',
-    );
+      expect(ReactNoop).toMatchRenderedOutput(
+        <>
+          <span>hi this is server</span>
+          <span>hi this is server2</span>
+          <span>hi this is server outer</span>
+          <span>hi this is server outer2</span>
+          <span>default hello from server</span>
+        </>,
+      );
+    });
 
-    function Foo() {
-      return (
-        <div>
-          <ServerContext.Provider value="hi this is server">
-            <React.Suspense fallback={'Loading'}>
-              <Bar />
-            </React.Suspense>
-          </ServerContext.Provider>
-        </div>
+    // @gate enableServerContext
+    it('propagates ServerContext providers in flight after suspending', async () => {
+      const ServerContext = React.createServerContext(
+        'ServerContext',
+        'default hello from server',
       );
-    }
 
-    let resolve;
-    const promise = new Promise(res => {
-      resolve = () => {
-        promise.unsuspend = true;
-        res();
-      };
-    });
+      function Foo() {
+        return (
+          <div>
+            <ServerContext.Provider value="hi this is server">
+              <React.Suspense fallback={'Loading'}>
+                <Bar />
+              </React.Suspense>
+            </ServerContext.Provider>
+          </div>
+        );
+      }
+
+      let resolve;
+      const promise = new Promise(res => {
+        resolve = () => {
+          promise.unsuspend = true;
+          res();
+        };
+      });
 
-    function Bar() {
-      if (!promise.unsuspend) {
-        Scheduler.unstable_yieldValue('suspended');
-        throw promise;
+      function Bar() {
+        if (!promise.unsuspend) {
+          Scheduler.unstable_yieldValue('suspended');
+          throw promise;
+        }
+        Scheduler.unstable_yieldValue('rendered');
+        const context = React.useServerContext(ServerContext);
+        return context;
       }
-      Scheduler.unstable_yieldValue('rendered');
-      const context = React.useServerContext(ServerContext);
-      return context;
-    }
 
-    const transport = ReactNoopFlightServer.render(<Foo />);
+      const transport = ReactNoopFlightServer.render(<Foo />);
 
-    expect(Scheduler).toHaveYielded(['suspended']);
+      expect(Scheduler).toHaveYielded(['suspended']);
 
-    await act(async () => {
-      resolve();
-      await promise;
-      jest.runAllImmediates();
-    });
+      await act(async () => {
+        resolve();
+        await promise;
+        jest.runAllImmediates();
+      });
 
-    expect(Scheduler).toHaveYielded(['rendered']);
+      expect(Scheduler).toHaveYielded(['rendered']);
 
-    act(() => {
-      ServerContext._currentRenderer = null;
-      ServerContext._currentRenderer2 = null;
-      ReactNoop.render(ReactNoopFlightClient.read(transport));
+      act(() => {
+        ServerContext._currentRenderer = null;
+        ServerContext._currentRenderer2 = null;
+        ReactNoop.render(ReactNoopFlightClient.read(transport));
+      });
+
+      expect(ReactNoop).toMatchRenderedOutput(<div>hi this is server</div>);
     });
 
-    expect(ReactNoop).toMatchRenderedOutput(<div>hi this is server</div>);
-  });
+    // @gate enableServerContext
+    it('serializes ServerContext to client', async () => {
+      const ServerContext = React.createServerContext(
+        'ServerContext',
+        'default hello from server',
+      );
 
-  it('serializes ServerContext to client', async () => {
-    const ServerContext = React.createServerContext(
-      'ServerContext',
-      'default hello from server',
-    );
+      function ClientBar() {
+        Scheduler.unstable_yieldValue('ClientBar');
+        const context = React.useServerContext(ServerContext);
+        return <span>{context}</span>;
+      }
 
-    function ClientBar() {
-      Scheduler.unstable_yieldValue('ClientBar');
-      const context = React.useServerContext(ServerContext);
-      return <span>{context}</span>;
-    }
+      const Bar = moduleReference(ClientBar);
 
-    const Bar = moduleReference(ClientBar);
+      function Foo() {
+        return (
+          <ServerContext.Provider value="hi this is server">
+            <Bar />
+          </ServerContext.Provider>
+        );
+      }
 
-    function Foo() {
-      return (
-        <ServerContext.Provider value="hi this is server">
-          <Bar />
-        </ServerContext.Provider>
-      );
-    }
+      const model = {
+        foo: <Foo />,
+      };
 
-    const model = {
-      foo: <Foo />,
-    };
+      const transport = ReactNoopFlightServer.render(model);
 
-    const transport = ReactNoopFlightServer.render(model);
+      expect(Scheduler).toHaveYielded([]);
 
-    expect(Scheduler).toHaveYielded([]);
+      act(() => {
+        ServerContext._currentRenderer = null;
+        ServerContext._currentRenderer2 = null;
+        const flightModel = ReactNoopFlightClient.read(transport);
+        ReactNoop.render(flightModel.foo);
+      });
 
-    act(() => {
-      ServerContext._currentRenderer = null;
-      ServerContext._currentRenderer2 = null;
-      const flightModel = ReactNoopFlightClient.read(transport);
-      ReactNoop.render(flightModel.foo);
+      expect(Scheduler).toHaveYielded(['ClientBar']);
+      expect(ReactNoop).toMatchRenderedOutput(<span>hi this is server</span>);
     });
 
-    expect(Scheduler).toHaveYielded(['ClientBar']);
-    expect(ReactNoop).toMatchRenderedOutput(<span>hi this is server</span>);
-  });
+    // @gate enableServerContext
+    it('takes ServerContext from client for refetching usecases', async () => {
+      const ServerContext = React.createServerContext(
+        'ServerContext',
+        'default hello from server',
+      );
+      function Bar() {
+        return <span>{React.useServerContext(ServerContext)}</span>;
+      }
+      const transport = ReactNoopFlightServer.render(<Bar />, {
+        context: [
+          {
+            name: 'ServerContext',
+            value: 'Override',
+          },
+        ],
+      });
 
-  it('takes ServerContext from client for refetching usecases', async () => {
-    const ServerContext = React.createServerContext(
-      'ServerContext',
-      'default hello from server',
-    );
-    function Bar() {
-      return <span>{React.useServerContext(ServerContext)}</span>;
-    }
-    const transport = ReactNoopFlightServer.render(<Bar />, {
-      context: [{name: 'ServerContext', value: 'Override'}],
-    });
+      act(() => {
+        const flightModel = ReactNoopFlightClient.read(transport);
+        ReactNoop.render(flightModel);
+      });
 
-    act(() => {
-      const flightModel = ReactNoopFlightClient.read(transport);
-      ReactNoop.render(flightModel);
+      expect(ReactNoop).toMatchRenderedOutput(<span>Override</span>);
     });
-
-    expect(ReactNoop).toMatchRenderedOutput(<span>Override</span>);
   });
 });
diff --git a/packages/react-is/src/ReactIs.js b/packages/react-is/src/ReactIs.js
index dd81ec036158d..8c5d26a08c2ae 100644
--- a/packages/react-is/src/ReactIs.js
+++ b/packages/react-is/src/ReactIs.js
@@ -11,6 +11,7 @@
 
 import {
   REACT_CONTEXT_TYPE,
+  REACT_SERVER_CONTEXT_TYPE,
   REACT_ELEMENT_TYPE,
   REACT_FORWARD_REF_TYPE,
   REACT_FRAGMENT_TYPE,
@@ -43,6 +44,7 @@ export function typeOf(object: any) {
             const $$typeofType = type && type.$$typeof;
 
             switch ($$typeofType) {
+              case REACT_SERVER_CONTEXT_TYPE:
               case REACT_CONTEXT_TYPE:
               case REACT_FORWARD_REF_TYPE:
               case REACT_LAZY_TYPE:
diff --git a/packages/react-reconciler/src/ReactFiberHooks.new.js b/packages/react-reconciler/src/ReactFiberHooks.new.js
index 58d5fb1e95103..62f30d775c77c 100644
--- a/packages/react-reconciler/src/ReactFiberHooks.new.js
+++ b/packages/react-reconciler/src/ReactFiberHooks.new.js
@@ -33,6 +33,7 @@ import {
   enableLazyContextPropagation,
   enableSuspenseLayoutEffectSemantics,
   enableUseMutableSource,
+  enableServerContext,
 } from 'shared/ReactFeatureFlags';
 
 import {
@@ -2372,12 +2373,33 @@ function getCacheForType<T>(resourceType: () => T): T {
   return cacheForType;
 }
 
+function mountServerContext<T: ServerContextJSONValue>(
+  context: ReactServerContext<T>,
+): T {
+  if (!enableServerContext) {
+    throw new Error('Not implemented.');
+  }
+  currentHookNameInDev = 'useServerContext';
+  mountHookTypesDev();
+  return readContext(context);
+}
+
+function updateServerContext<T: ServerContextJSONValue>(
+  context: ReactServerContext<T>,
+): T {
+  if (!enableServerContext) {
+    throw new Error('Not implemented.');
+  }
+  currentHookNameInDev = 'useServerContext';
+  updateHookTypesDev();
+  return readContext(context);
+}
+
 export const ContextOnlyDispatcher: Dispatcher = {
   readContext,
 
   useCallback: throwInvalidHookError,
   useContext: throwInvalidHookError,
-  useServerContext: throwInvalidHookError,
   useEffect: throwInvalidHookError,
   useImperativeHandle: throwInvalidHookError,
   useInsertionEffect: throwInvalidHookError,
@@ -2401,12 +2423,15 @@ if (enableCache) {
   (ContextOnlyDispatcher: Dispatcher).useCacheRefresh = throwInvalidHookError;
 }
 
+if (enableServerContext) {
+  ContextOnlyDispatcher.useServerContext = throwInvalidHookError;
+}
+
 const HooksDispatcherOnMount: Dispatcher = {
   readContext,
 
   useCallback: mountCallback,
   useContext: readContext,
-  useServerContext: readContext,
   useEffect: mountEffect,
   useImperativeHandle: mountImperativeHandle,
   useLayoutEffect: mountLayoutEffect,
@@ -2429,13 +2454,15 @@ if (enableCache) {
   (HooksDispatcherOnMount: Dispatcher).getCacheForType = getCacheForType;
   (HooksDispatcherOnMount: Dispatcher).useCacheRefresh = mountRefresh;
 }
+if (enableServerContext) {
+  HooksDispatcherOnMount.useServerContext = readContext;
+}
 
 const HooksDispatcherOnUpdate: Dispatcher = {
   readContext,
 
   useCallback: updateCallback,
   useContext: readContext,
-  useServerContext: readContext,
   useEffect: updateEffect,
   useImperativeHandle: updateImperativeHandle,
   useInsertionEffect: updateInsertionEffect,
@@ -2458,13 +2485,15 @@ if (enableCache) {
   (HooksDispatcherOnUpdate: Dispatcher).getCacheForType = getCacheForType;
   (HooksDispatcherOnUpdate: Dispatcher).useCacheRefresh = updateRefresh;
 }
+if (enableServerContext) {
+  HooksDispatcherOnUpdate.useServerContext = readContext;
+}
 
 const HooksDispatcherOnRerender: Dispatcher = {
   readContext,
 
   useCallback: updateCallback,
   useContext: readContext,
-  useServerContext: readContext,
   useEffect: updateEffect,
   useImperativeHandle: updateImperativeHandle,
   useInsertionEffect: updateInsertionEffect,
@@ -2487,6 +2516,9 @@ if (enableCache) {
   (HooksDispatcherOnRerender: Dispatcher).getCacheForType = getCacheForType;
   (HooksDispatcherOnRerender: Dispatcher).useCacheRefresh = updateRefresh;
 }
+if (enableServerContext) {
+  HooksDispatcherOnRerender.useServerContext = readContext;
+}
 
 let HooksDispatcherOnMountInDEV: Dispatcher | null = null;
 let HooksDispatcherOnMountWithHookTypesInDEV: Dispatcher | null = null;
@@ -2530,13 +2562,6 @@ if (__DEV__) {
       mountHookTypesDev();
       return readContext(context);
     },
-    useServerContext<T: ServerContextJSONValue>(
-      context: ReactServerContext<T>,
-    ): T {
-      currentHookNameInDev = 'useServerContext';
-      mountHookTypesDev();
-      return readContext(context);
-    },
     useEffect(
       create: () => (() => void) | void,
       deps: Array<mixed> | void | null,
@@ -2669,6 +2694,9 @@ if (__DEV__) {
       return mountRefresh();
     };
   }
+  if (enableServerContext) {
+    HooksDispatcherOnMountInDEV.useServerContext = mountServerContext;
+  }
 
   HooksDispatcherOnMountWithHookTypesInDEV = {
     readContext<T: any>(context: ReactContext<T> | ReactServerContext<T>): T {
@@ -2684,13 +2712,6 @@ if (__DEV__) {
       updateHookTypesDev();
       return readContext(context);
     },
-    useServerContext<T: ServerContextJSONValue>(
-      context: ReactServerContext<T>,
-    ): T {
-      currentHookNameInDev = 'useServerContext';
-      updateHookTypesDev();
-      return readContext(context);
-    },
     useEffect(
       create: () => (() => void) | void,
       deps: Array<mixed> | void | null,
@@ -2818,6 +2839,9 @@ if (__DEV__) {
       return mountRefresh();
     };
   }
+  if (enableServerContext) {
+    HooksDispatcherOnMountWithHookTypesInDEV.useServerContext = updateServerContext;
+  }
 
   HooksDispatcherOnUpdateInDEV = {
     readContext<T: any>(context: ReactContext<T> | ReactServerContext<T>): T {
@@ -2833,13 +2857,6 @@ if (__DEV__) {
       updateHookTypesDev();
       return readContext(context);
     },
-    useServerContext<T: ServerContextJSONValue>(
-      context: ReactServerContext<T>,
-    ): T {
-      currentHookNameInDev = 'useServerContext';
-      updateHookTypesDev();
-      return readContext(context);
-    },
     useEffect(
       create: () => (() => void) | void,
       deps: Array<mixed> | void | null,
@@ -2967,6 +2984,12 @@ if (__DEV__) {
       return updateRefresh();
     };
   }
+  if (enableServerContext) {
+    HooksDispatcherOnUpdateInDEV.useServerContext = updateServerContext;
+  }
+
+  if (!enableServerContext) {
+  }
 
   HooksDispatcherOnRerenderInDEV = {
     readContext<T: any>(context: ReactContext<T> | ReactServerContext<T>): T {
@@ -2983,13 +3006,6 @@ if (__DEV__) {
       updateHookTypesDev();
       return readContext(context);
     },
-    useServerContext<T: ServerContextJSONValue>(
-      context: ReactServerContext<T>,
-    ): T {
-      currentHookNameInDev = 'useServerContext';
-      updateHookTypesDev();
-      return readContext(context);
-    },
     useEffect(
       create: () => (() => void) | void,
       deps: Array<mixed> | void | null,
@@ -3117,6 +3133,9 @@ if (__DEV__) {
       return updateRefresh();
     };
   }
+  if (enableServerContext) {
+    HooksDispatcherOnRerenderInDEV.useServerContext = updateServerContext;
+  }
 
   InvalidNestedHooksDispatcherOnMountInDEV = {
     readContext<T: any>(context: ReactContext<T> | ReactServerContext<T>): T {
@@ -3135,14 +3154,6 @@ if (__DEV__) {
       mountHookTypesDev();
       return readContext(context);
     },
-    useServerContext<T: ServerContextJSONValue>(
-      context: ReactServerContext<T>,
-    ): T {
-      currentHookNameInDev = 'useServerContext';
-      warnInvalidHookAccess();
-      mountHookTypesDev();
-      return readContext(context);
-    },
     useEffect(
       create: () => (() => void) | void,
       deps: Array<mixed> | void | null,
@@ -3285,6 +3296,22 @@ if (__DEV__) {
     };
   }
 
+  if (enableServerContext) {
+    InvalidNestedHooksDispatcherOnMountInDEV.useServerContext = <
+      T: ServerContextJSONValue,
+    >(
+      context: ReactServerContext<T>,
+    ): T => {
+      if (!enableServerContext) {
+        throw new Error('Not implemented.');
+      }
+      currentHookNameInDev = 'useServerContext';
+      warnInvalidHookAccess();
+      mountHookTypesDev();
+      return readContext(context);
+    };
+  }
+
   InvalidNestedHooksDispatcherOnUpdateInDEV = {
     readContext<T: any>(context: ReactContext<T> | ReactServerContext<T>): T {
       warnInvalidContextAccess();
@@ -3302,14 +3329,6 @@ if (__DEV__) {
       updateHookTypesDev();
       return readContext(context);
     },
-    useServerContext<T: ServerContextJSONValue>(
-      context: ReactServerContext<T>,
-    ): T {
-      currentHookNameInDev = 'useServerContext';
-      warnInvalidHookAccess();
-      updateHookTypesDev();
-      return readContext(context);
-    },
     useEffect(
       create: () => (() => void) | void,
       deps: Array<mixed> | void | null,
@@ -3451,6 +3470,21 @@ if (__DEV__) {
       return updateRefresh();
     };
   }
+  if (enableServerContext) {
+    InvalidNestedHooksDispatcherOnUpdateInDEV.useServerContext = <
+      T: ServerContextJSONValue,
+    >(
+      context: ReactServerContext<T>,
+    ): T => {
+      if (!enableServerContext) {
+        throw new Error('Not implemented.');
+      }
+      currentHookNameInDev = 'useServerContext';
+      warnInvalidHookAccess();
+      updateHookTypesDev();
+      return readContext(context);
+    };
+  }
 
   InvalidNestedHooksDispatcherOnRerenderInDEV = {
     readContext<T: any>(context: ReactContext<T> | ReactServerContext<T>): T {
@@ -3470,14 +3504,6 @@ if (__DEV__) {
       updateHookTypesDev();
       return readContext(context);
     },
-    useServerContext<T: ServerContextJSONValue>(
-      context: ReactServerContext<T>,
-    ): T {
-      currentHookNameInDev = 'useServerContext';
-      warnInvalidHookAccess();
-      updateHookTypesDev();
-      return readContext(context);
-    },
     useEffect(
       create: () => (() => void) | void,
       deps: Array<mixed> | void | null,
@@ -3619,4 +3645,19 @@ if (__DEV__) {
       return updateRefresh();
     };
   }
+  if (enableServerContext) {
+    InvalidNestedHooksDispatcherOnRerenderInDEV.useServerContext = <
+      T: ServerContextJSONValue,
+    >(
+      context: ReactServerContext<T>,
+    ): T => {
+      if (!enableServerContext) {
+        throw new Error('Not implemented.');
+      }
+      currentHookNameInDev = 'useServerContext';
+      warnInvalidHookAccess();
+      updateHookTypesDev();
+      return readContext(context);
+    };
+  }
 }
diff --git a/packages/react-reconciler/src/ReactFiberNewContext.new.js b/packages/react-reconciler/src/ReactFiberNewContext.new.js
index a871401d9a1c0..480e86dbfd6f4 100644
--- a/packages/react-reconciler/src/ReactFiberNewContext.new.js
+++ b/packages/react-reconciler/src/ReactFiberNewContext.new.js
@@ -129,16 +129,16 @@ export function pushProvider<T: any>(
   }
 }
 
-export function popProvider<T: any>(
-  context: ReactContext<T> | ReactServerContext<T>,
+export function popProvider(
+  context: ReactContext<any> | ReactServerContext<any>,
   providerFiber: Fiber,
 ): void {
   const currentValue = valueCursor.current;
   pop(valueCursor, providerFiber);
   if (isPrimaryRenderer) {
-    context._currentValue = (currentValue: any);
+    context._currentValue = currentValue;
   } else {
-    context._currentValue2 = (currentValue: any);
+    context._currentValue2 = currentValue;
   }
 }
 
diff --git a/packages/react-reconciler/src/ReactInternalTypes.js b/packages/react-reconciler/src/ReactInternalTypes.js
index e6f731b6c2b7e..c38afe3b71418 100644
--- a/packages/react-reconciler/src/ReactInternalTypes.js
+++ b/packages/react-reconciler/src/ReactInternalTypes.js
@@ -323,9 +323,9 @@ export type Dispatcher = {|
     getSnapshot: MutableSourceGetSnapshotFn<Source, Snapshot>,
     subscribe: MutableSourceSubscribeFn<Source, Snapshot>,
   ): Snapshot,
-  useServerContext<T: ServerContextJSONValue>(
+  useServerContext?: <T: ServerContextJSONValue>(
     context: ReactServerContext<T>,
-  ): T,
+  ) => T,
   useSyncExternalStore<T>(
     subscribe: (() => void) => () => void,
     getSnapshot: () => T,
diff --git a/packages/react-server/src/ReactFlightServer.js b/packages/react-server/src/ReactFlightServer.js
index b4af31a59c63e..ee092d508f015 100644
--- a/packages/react-server/src/ReactFlightServer.js
+++ b/packages/react-server/src/ReactFlightServer.js
@@ -59,7 +59,6 @@ import {
   REACT_LAZY_TYPE,
   REACT_MEMO_TYPE,
   REACT_PROVIDER_TYPE,
-  REACT_CONTEXT_TYPE,
   REACT_SERVER_CONTEXT_TYPE,
 } from 'shared/ReactSymbols';
 
diff --git a/packages/react/src/ReactServerContext.js b/packages/react/src/ReactServerContext.js
index 1c40569aef26e..1d15a9b31612f 100644
--- a/packages/react/src/ReactServerContext.js
+++ b/packages/react/src/ReactServerContext.js
@@ -10,7 +10,6 @@
 import {
   REACT_PROVIDER_TYPE,
   REACT_SERVER_CONTEXT_TYPE,
-  REACT_CONTEXT_TYPE,
 } from 'shared/ReactSymbols';
 
 import type {
@@ -18,6 +17,8 @@ import type {
   ServerContextJSONValue,
 } from 'shared/ReactTypes';
 
+import {enableServerContext} from 'shared/ReactFeatureFlags';
+
 const globalRegistry: {
   [globalName: string]: ReactServerContext<any>,
 } = {};
@@ -26,6 +27,9 @@ export function createServerContext<T: ServerContextJSONValue>(
   globalName: string,
   defaultValue: T,
 ): ReactServerContext<T> {
+  if (!enableServerContext) {
+    throw new Error('Not implemented.');
+  }
   if (!globalRegistry[globalName]) {
     globalRegistry[globalName] = _createServerContext(globalName, defaultValue);
   }
@@ -34,6 +38,8 @@ export function createServerContext<T: ServerContextJSONValue>(
     context._currentValue = defaultValue;
     context._currentValue2 = defaultValue;
     context._definitionLoaded = true;
+  } else {
+    throw new Error(`ServerContext: ${globalName} already defined`);
   }
   return context;
 }
@@ -50,7 +56,7 @@ function _createServerContext<T: ServerContextJSONValue>(
     // Fabric (secondary); React DOM (primary) and React ART (secondary).
     // Secondary renderers store their context values on separate fields.
     _currentValue: (defaultValue: any),
-    _currentValue2:  (defaultValue: any),
+    _currentValue2: (defaultValue: any),
     // Used to track how many concurrent renderers this context currently
     // supports within in a single renderer. Such as parallel server rendering.
     _threadCount: 0,
@@ -73,11 +79,10 @@ function _createServerContext<T: ServerContextJSONValue>(
   return context;
 }
 
-
 // This function is called by FlightClient to create a server context sent from
-// the server. Its possible that FlightClient is creating it before the 
+// the server. Its possible that FlightClient is creating it before the
 // definition is loaded on the server. We'll create it with a null default value
-// if thats the case and when the definition loads it will  set the correct 
+// if thats the case and when the definition loads it will  set the correct
 // default value.
 export function getOrCreateServerContext(globalName: string) {
   if (!globalRegistry[globalName]) {
diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js
index fe9d77766cdb7..361d1012d80e4 100644
--- a/packages/shared/ReactFeatureFlags.js
+++ b/packages/shared/ReactFeatureFlags.js
@@ -191,6 +191,8 @@ export const enablePersistentOffscreenHostContainer = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = true;
 
+export const enableServerContext = false;
+
 // Only enabled in www builds
 export const enableUseMutableSource = false;
 
diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js
index 699d9a571ff6d..a19447b82a105 100644
--- a/packages/shared/forks/ReactFeatureFlags.native-fb.js
+++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js
@@ -75,6 +75,8 @@ export const allowConcurrentByDefault = true;
 export const enableCustomElementPropertySupport = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
+export const enableServerContext = false;
+
 export const enableUseMutableSource = true;
 
 export const enableTransitionTracing = false;
diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js
index 0328a98aef589..2a7f42150d72a 100644
--- a/packages/shared/forks/ReactFeatureFlags.native-oss.js
+++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js
@@ -67,6 +67,7 @@ export const enablePersistentOffscreenHostContainer = false;
 export const enableCustomElementPropertySupport = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
+export const enableServerContext = false;
 export const enableUseMutableSource = false;
 
 export const enableTransitionTracing = false;
diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js
index b1afbda8ec594..26d690d69d3fc 100644
--- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js
+++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js
@@ -67,6 +67,7 @@ export const enablePersistentOffscreenHostContainer = false;
 export const enableCustomElementPropertySupport = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
+export const enableServerContext = true;
 export const enableUseMutableSource = false;
 
 export const enableTransitionTracing = false;
diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
index e64d09d5d6697..7e83cbd8f648f 100644
--- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
+++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
@@ -67,6 +67,7 @@ export const enablePersistentOffscreenHostContainer = false;
 export const enableCustomElementPropertySupport = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
+export const enableServerContext = true;
 
 // Some www surfaces are still using this. Remove once they have been migrated.
 export const enableUseMutableSource = true;
diff --git a/packages/shared/forks/ReactFeatureFlags.testing.js b/packages/shared/forks/ReactFeatureFlags.testing.js
index f0d4a9acc5605..844aa0a92fae4 100644
--- a/packages/shared/forks/ReactFeatureFlags.testing.js
+++ b/packages/shared/forks/ReactFeatureFlags.testing.js
@@ -67,6 +67,7 @@ export const enablePersistentOffscreenHostContainer = false;
 export const enableCustomElementPropertySupport = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
+export const enableServerContext = true;
 export const enableUseMutableSource = false;
 
 export const enableTransitionTracing = false;
diff --git a/packages/shared/forks/ReactFeatureFlags.testing.www.js b/packages/shared/forks/ReactFeatureFlags.testing.www.js
index 43ce351301ce5..aa0d23707897d 100644
--- a/packages/shared/forks/ReactFeatureFlags.testing.www.js
+++ b/packages/shared/forks/ReactFeatureFlags.testing.www.js
@@ -67,7 +67,7 @@ export const enablePersistentOffscreenHostContainer = false;
 export const enableCustomElementPropertySupport = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
-
+export const enableServerContext = true;
 // Some www surfaces are still using this. Remove once they have been migrated.
 export const enableUseMutableSource = true;
 
diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js
index c0545d2aacf3b..44e3d1887f2ef 100644
--- a/packages/shared/forks/ReactFeatureFlags.www.js
+++ b/packages/shared/forks/ReactFeatureFlags.www.js
@@ -100,6 +100,7 @@ export const deletedTreeCleanUpLevel = 3;
 export const enablePersistentOffscreenHostContainer = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = true;
+export const enableServerContext = false;
 
 // Some www surfaces are still using this. Remove once they have been migrated.
 export const enableUseMutableSource = true;
diff --git a/scripts/error-codes/codes.json b/scripts/error-codes/codes.json
index 2c293a02bed94..b46f6ce6df454 100644
--- a/scripts/error-codes/codes.json
+++ b/scripts/error-codes/codes.json
@@ -404,5 +404,6 @@
   "416": "This environment don't support binary chunks.",
   "417": "React currently only supports piping to one writable stream.",
   "418": "An error occurred during hydration. The server HTML was replaced with client content",
-  "419": "useServerContext is only supported while rendering."
+  "419": "useServerContext is only supported while rendering.",
+  "420": "ServerContext: %s already defined"
 }