useActionState: On error, cancel remaining actions (#29695)

Based on

- #29694

---

If an action in the useActionState queue errors, we shouldn't run any
subsequent actions. The contract of useActionState is that the actions
run in sequence, and that one action can assume that all previous
actions have completed successfully.

For example, in a shopping cart UI, you might dispatch an "Add to cart"
action followed by a "Checkout" action. If the "Add to cart" action
errors, the "Checkout" action should not run.

An implication of this change is that once useActionState falls into an
error state, the only way to recover is to reset the component tree,
i.e. by unmounting and remounting. The way to customize the error
handling behavior is to wrap the action body in a try/catch.

DiffTrain build for [9598c41](9598c41)

Author: acdlite

compiled/facebook-www/REVISION

@@ -1 +1 @@
-67b05be0d216c4efebc4bb5acb12c861a18bd87c
+9598c41a20162c8a9d57ccf6a356aa183b00b61a

compiled/facebook-www/REVISION_TRANSFORMS

@@ -1 +1 @@
-67b05be0d216c4efebc4bb5acb12c861a18bd87c
+9598c41a20162c8a9d57ccf6a356aa183b00b61a

compiled/facebook-www/React-dev.classic.js

@@ -22,7 +22,7 @@ if (
 ) {
   __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
 }
-var ReactVersion = '19.0.0-www-classic-67b05be0d2-20240603';
+var ReactVersion = '19.0.0-www-classic-9598c41a20-20240603';
 
 // Re-export dynamic flags from the www version.
 var dynamicFeatureFlags = require('ReactFeatureFlags');

compiled/facebook-www/React-dev.modern.js

@@ -22,7 +22,7 @@ if (
 ) {
   __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
 }
-var ReactVersion = '19.0.0-www-modern-67b05be0d2-20240603';
+var ReactVersion = '19.0.0-www-modern-9598c41a20-20240603';
 
 // Re-export dynamic flags from the www version.
 var dynamicFeatureFlags = require('ReactFeatureFlags');

compiled/facebook-www/React-prod.classic.js

@@ -684,4 +684,4 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.0.0-www-classic-67b05be0d2-20240603";
+exports.version = "19.0.0-www-classic-9598c41a20-20240603";

compiled/facebook-www/React-prod.modern.js

@@ -684,4 +684,4 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.0.0-www-modern-67b05be0d2-20240603";
+exports.version = "19.0.0-www-modern-9598c41a20-20240603";

compiled/facebook-www/React-profiling.classic.js

@@ -688,7 +688,7 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.0.0-www-classic-67b05be0d2-20240603";
+exports.version = "19.0.0-www-classic-9598c41a20-20240603";
 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
   "function" ===
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-profiling.modern.js

@@ -688,7 +688,7 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.0.0-www-modern-67b05be0d2-20240603";
+exports.version = "19.0.0-www-modern-9598c41a20-20240603";
 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
   "function" ===
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/ReactART-dev.classic.js

@@ -60,7 +60,7 @@ function _assertThisInitialized(self) {
   return self;
 }
 
-var ReactVersion = '19.0.0-www-classic-67b05be0d2-20240603';
+var ReactVersion = '19.0.0-www-classic-9598c41a20-20240603';
 
 var LegacyRoot = 0;
 var ConcurrentRoot = 1;
@@ -9272,9 +9272,16 @@ function dispatchActionState(fiber, actionQueue, setPendingState, setState, payl
     throw new Error('Cannot update form state while rendering.');
   }
 
+  var currentAction = actionQueue.action;
+
+  if (currentAction === null) {
+    // An earlier action errored. Subsequent actions should not run.
+    return;
+  }
+
   var actionNode = {
     payload: payload,
-    action: actionQueue.action,
+    action: currentAction,
     next: null,
     // circular
     isTransition: true,
@@ -9433,28 +9440,23 @@ function onActionSuccess(actionQueue, actionNode, nextState) {
 }
 
 function onActionError(actionQueue, actionNode, error) {
-  actionNode.status = 'rejected';
-  actionNode.reason = error;
-  notifyActionListeners(actionNode); // Pop the action from the queue and run the next pending action, if there
-  // are any.
-  // TODO: We should instead abort all the remaining actions in the queue.
-
+  // Mark all the following actions as rejected.
   var last = actionQueue.pending;
+  actionQueue.pending = null;
 
   if (last !== null) {
     var first = last.next;
 
-    if (first === last) {
-      // This was the last action in the queue.
-      actionQueue.pending = null;
-    } else {
-      // Remove the first node from the circular queue.
-      var next = first.next;
-      last.next = next; // Run the next action.
+    do {
+      actionNode.status = 'rejected';
+      actionNode.reason = error;
+      notifyActionListeners(actionNode);
+      actionNode = actionNode.next;
+    } while (actionNode !== first);
+  } // Prevent subsequent actions from being dispatched.
 
-      runActionStateAction(actionQueue, next);
-    }
-  }
+
+  actionQueue.action = null;
 }
 
 function notifyActionListeners(actionNode) {

compiled/facebook-www/ReactART-dev.modern.js

@@ -60,7 +60,7 @@ function _assertThisInitialized(self) {
   return self;
 }
 
-var ReactVersion = '19.0.0-www-modern-67b05be0d2-20240603';
+var ReactVersion = '19.0.0-www-modern-9598c41a20-20240603';
 
 var LegacyRoot = 0;
 var ConcurrentRoot = 1;
@@ -9061,9 +9061,16 @@ function dispatchActionState(fiber, actionQueue, setPendingState, setState, payl
     throw new Error('Cannot update form state while rendering.');
   }
 
+  var currentAction = actionQueue.action;
+
+  if (currentAction === null) {
+    // An earlier action errored. Subsequent actions should not run.
+    return;
+  }
+
   var actionNode = {
     payload: payload,
-    action: actionQueue.action,
+    action: currentAction,
     next: null,
     // circular
     isTransition: true,
@@ -9222,28 +9229,23 @@ function onActionSuccess(actionQueue, actionNode, nextState) {
 }
 
 function onActionError(actionQueue, actionNode, error) {
-  actionNode.status = 'rejected';
-  actionNode.reason = error;
-  notifyActionListeners(actionNode); // Pop the action from the queue and run the next pending action, if there
-  // are any.
-  // TODO: We should instead abort all the remaining actions in the queue.
-
+  // Mark all the following actions as rejected.
   var last = actionQueue.pending;
+  actionQueue.pending = null;
 
   if (last !== null) {
     var first = last.next;
 
-    if (first === last) {
-      // This was the last action in the queue.
-      actionQueue.pending = null;
-    } else {
-      // Remove the first node from the circular queue.
-      var next = first.next;
-      last.next = next; // Run the next action.
+    do {
+      actionNode.status = 'rejected';
+      actionNode.reason = error;
+      notifyActionListeners(actionNode);
+      actionNode = actionNode.next;
+    } while (actionNode !== first);
+  } // Prevent subsequent actions from being dispatched.
 
-      runActionStateAction(actionQueue, next);
-    }
-  }
+
+  actionQueue.action = null;
 }
 
 function notifyActionListeners(actionNode) {