From 9e4c3049c76c8e34c4449087bd053e6722f9f6ad Mon Sep 17 00:00:00 2001
From: Andrew Clark <git@andrewclark.io>
Date: Wed, 23 Feb 2022 18:40:04 -0500
Subject: [PATCH] Update subscription-in-startTransition warning

The message now explicitly mentions the useSyncExternalStore API.
---
 .../react-reconciler/src/ReactFiberHooks.new.js  |  8 +++++---
 .../react-reconciler/src/ReactFiberHooks.old.js  |  8 +++++---
 packages/react/src/ReactStartTransition.js       |  8 +++++---
 .../src/__tests__/ReactStartTransition-test.js   | 16 ++++++++++------
 4 files changed, 25 insertions(+), 15 deletions(-)

diff --git a/packages/react-reconciler/src/ReactFiberHooks.new.js b/packages/react-reconciler/src/ReactFiberHooks.new.js
index 31e716935bc34..b0966137ca8f7 100644
--- a/packages/react-reconciler/src/ReactFiberHooks.new.js
+++ b/packages/react-reconciler/src/ReactFiberHooks.new.js
@@ -1995,9 +1995,11 @@ function startTransition(setPending, callback) {
         const updatedFibersCount = currentTransition._updatedFibers.size;
         if (updatedFibersCount > 10) {
           console.warn(
-            'Detected a large number of updates inside startTransition. ' +
-              'If this is due to a subscription please re-write it to use React provided hooks. ' +
-              'Otherwise concurrent mode guarantees are off the table.',
+            'Detected a large number of updates within a startTransition ' +
+              'scope. This likely means you have subscribed to an external ' +
+              'store. To ensure compatibility with concurrent features ' +
+              'like startTransition, subscriptions should be managed by the ' +
+              'useSyncExternalStore API.',
           );
         }
         currentTransition._updatedFibers.clear();
diff --git a/packages/react-reconciler/src/ReactFiberHooks.old.js b/packages/react-reconciler/src/ReactFiberHooks.old.js
index bd9e2488a8841..38f5be13b1bc6 100644
--- a/packages/react-reconciler/src/ReactFiberHooks.old.js
+++ b/packages/react-reconciler/src/ReactFiberHooks.old.js
@@ -1995,9 +1995,11 @@ function startTransition(setPending, callback) {
         const updatedFibersCount = currentTransition._updatedFibers.size;
         if (updatedFibersCount > 10) {
           console.warn(
-            'Detected a large number of updates inside startTransition. ' +
-              'If this is due to a subscription please re-write it to use React provided hooks. ' +
-              'Otherwise concurrent mode guarantees are off the table.',
+            'Detected a large number of updates within a startTransition ' +
+              'scope. This likely means you have subscribed to an external ' +
+              'store. To ensure compatibility with concurrent features ' +
+              'like startTransition, subscriptions should be managed by the ' +
+              'useSyncExternalStore API.',
           );
         }
         currentTransition._updatedFibers.clear();
diff --git a/packages/react/src/ReactStartTransition.js b/packages/react/src/ReactStartTransition.js
index a7097f5b1c52b..e2d963bac34da 100644
--- a/packages/react/src/ReactStartTransition.js
+++ b/packages/react/src/ReactStartTransition.js
@@ -27,9 +27,11 @@ export function startTransition(scope: () => void) {
         const updatedFibersCount = currentTransition._updatedFibers.size;
         if (updatedFibersCount > 10) {
           console.warn(
-            'Detected a large number of updates inside startTransition. ' +
-              'If this is due to a subscription please re-write it to use React provided hooks. ' +
-              'Otherwise concurrent mode guarantees are off the table.',
+            'Detected a large number of updates within a startTransition ' +
+              'scope. This likely means you have subscribed to an external ' +
+              'store. To ensure compatibility with concurrent features ' +
+              'like startTransition, subscriptions should be managed by the ' +
+              'useSyncExternalStore API.',
           );
         }
         currentTransition._updatedFibers.clear();
diff --git a/packages/react/src/__tests__/ReactStartTransition-test.js b/packages/react/src/__tests__/ReactStartTransition-test.js
index 2408e7ace1d49..2147ad9ed0fdd 100644
--- a/packages/react/src/__tests__/ReactStartTransition-test.js
+++ b/packages/react/src/__tests__/ReactStartTransition-test.js
@@ -63,9 +63,11 @@ describe('ReactStartTransition', () => {
       });
     }).toWarnDev(
       [
-        'Detected a large number of updates inside startTransition. ' +
-          'If this is due to a subscription please re-write it to use React provided hooks. ' +
-          'Otherwise concurrent mode guarantees are off the table.',
+        'Detected a large number of updates within a startTransition ' +
+          'scope. This likely means you have subscribed to an external ' +
+          'store. To ensure compatibility with concurrent features ' +
+          'like startTransition, subscriptions should be managed by the ' +
+          'useSyncExternalStore API.',
       ],
       {withoutStack: true},
     );
@@ -80,9 +82,11 @@ describe('ReactStartTransition', () => {
       });
     }).toWarnDev(
       [
-        'Detected a large number of updates inside startTransition. ' +
-          'If this is due to a subscription please re-write it to use React provided hooks. ' +
-          'Otherwise concurrent mode guarantees are off the table.',
+        'Detected a large number of updates within a startTransition ' +
+          'scope. This likely means you have subscribed to an external ' +
+          'store. To ensure compatibility with concurrent features ' +
+          'like startTransition, subscriptions should be managed by the ' +
+          'useSyncExternalStore API.',
       ],
       {withoutStack: true},
     );