Summary
The example action code in startTransition needs another startTransition in order to handle the await per this limitation.
Page
https://react.dev/reference/rsc/server-functions#server-functions-with-actions
Details
set functions following await inside startTransition need to be wrapped in another startTransition to be handled correctly.
Current
startTransition(async () => {
const {error} = await updateName(name);
// TODO: wrap `set` functions in another `startTransition`
if (!error) {
setError(error);
} else {
setName('');
}
})Fixed
startTransition(async () => {
const {error} = await updateName(name);
startTransition(() => {
if (!error) {
setError(error);
} else {
setName('');
}
})
})Admittedly, this may make the example less clear. As an alternative, maybe include a mention of the correct way to use await and marking subsequent state updates as Transitions.
Summary
The example action code in
startTransitionneeds anotherstartTransitionin order to handle theawaitper this limitation.Page
https://react.dev/reference/rsc/server-functions#server-functions-with-actions
Details
setfunctions followingawaitinsidestartTransitionneed to be wrapped in anotherstartTransitionto be handled correctly.Current
Fixed
Admittedly, this may make the example less clear. As an alternative, maybe include a mention of the correct way to use
awaitand marking subsequent state updates as Transitions.