[Compiler] Don't throw calculate in render if the blamed setter is used outside of the effect

[everettbu]

Mirror of facebook/react#34579
Original author: jorge-cab

---

Summary:
If the setter is used both inside and outside the effect then usually the solution is more complex and requires hoisting state up to a parent component since we can't just remove the local state.

To do this, we now have 2 caches that track setState usages (not just calls) since if the effect is passed as an argument or called outside the effect the solution gets more complex which we are trying to avoid for now

---

Stack created with Sapling. Best reviewed with ReviewStack.

• #34580
• -> #34579
• #34578
• #34577
• #34575
• #34574

[greptile-apps]

Greptile Overview

Greptile Summary

This PR enhances the experimental validation for derived computations in effects by adding smarter detection of when setState functions are used outside the effect scope. The validation now tracks setState usages across the entire component and within effects separately, only throwing errors when the refactoring would be straightforward (i.e., when the setter isn't needed outside the effect for user interactions or passed as props).

Key changes:

• Added setStateCache to track all setState usages across the component during the first pass
• Added effectSetStateCache to track setState usages specifically within effect functions
• Modified error condition to skip validation when setter has external usages, avoiding false positives for legitimate patterns like controlled inputs
• Comprehensive test coverage for the new no-error cases (setter in onChange, setter passed as prop, global function calls)

Confidence Score: 4/5

• This PR is safe to merge with minor considerations about the validation logic complexity
• The implementation correctly adds tracking for setState usages and has comprehensive test coverage. The logic appears sound based on test cases, though the condition effectSetStateCache.length === setStateCache.length - 1 is somewhat opaque and would benefit from a comment explaining when this evaluates to true
• ValidateNoDerivedComputationsInEffects_exp.ts could use additional inline documentation explaining the setState tracking logic and the specific condition being checked

Important Files Changed

File Analysis

Filename	Score	Overview
compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateNoDerivedComputationsInEffects_exp.ts	4/5	New experimental validation adds setState tracking logic to avoid false positives when setters are used outside effects
compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Pipeline.ts	5/5	Added experimental validation hook with config flag
compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts	5/5	Added config flag for experimental validation

[greptile-apps]

_{35 files reviewed, no comments}

_{Edit Code Review Agent Settings | Greptile}

[everettbu]

Upstream PR was closed or merged. Code is synced via branch mirror.