feat: add no-effect-chain rule

[aidenybai]

New rule (severity: warn) flagging the §7 anti-pattern from React's You Might Not Need an Effect guide.

What it catches

useEffect(() => { if (card?.gold) setGoldCount(c => c + 1); }, [card]);
useEffect(() => { if (goldCount > 3) setRound(r => r + 1); }, [goldCount]);
useEffect(() => { if (round > 5) setIsGameOver(true); }, [round]);

Each link adds an extra render to the tree below the component. The chain is also rigid — setting card to a value from the past re-fires every downstream effect. The fix is to compute as much as possible during render (const isGameOver = round > 5) and write all related state inside the event handler that originally fires the chain.

Detector

For every component body:

1. Collect every top-level useEffect call and extract:
   • depNames: identifier names in the dep array
   • writtenStateNames: state names whose setter is called inside
   • isExternalSync: the effect returns a cleanup function or contains a recognized external-system call (subscribe, addEventListener, fetch, setInterval, new MutationObserver, etc.) or mutates a ref (ref.current = …)
2. For every ordered pair (A, B) of distinct effects, draw an edge iff writes(A) ∩ deps(B) ≠ ∅ and neither A nor B is isExternalSync.
3. Report on every reader effect that is the target of any edge, naming the chained state.

Complements existing no-cascading-set-state

no-cascading-set-state catches multi-setter calls inside one effect. no-effect-chain catches chains across effects. They detect orthogonal shapes and can fire independently.

Article's GOOD exception is honored

The article explicitly notes that a chain of effects is appropriate when each effect synchronizes with the network (e.g. cascading dropdowns where each fetches options for the next). Each fetch-bearing effect has isExternalSync = true and is exempt.

Tests — 5 regression cases

• ✅ flags article §7 Game-style three-effect chain (≥2 hits, naming both goldCount and round as the chained values)
• ❌ does NOT flag a single effect with multiple setters (covered by no-cascading-set-state)
• ❌ does NOT flag the article's GOOD network-cascade ShippingForm (each effect calls fetch)
• ❌ does NOT flag a chat-connection effect that shares deps with a state-reset effect (createConnection().connect() is external sync)
• ❌ does NOT flag two effects whose written/read state sets are disjoint

Plus a smoke test in run-oxlint.test.ts against an EffectChainComponent fixture.

Constants added

• EXTERNAL_SYNC_MEMBER_METHOD_NAMES — subscribe, addEventListener, connect, fetch, post, put, patch, delete, on, watch, listen, sub, addListener, disconnect, open, close
• EXTERNAL_SYNC_DIRECT_CALLEE_NAMES — fetch, ky, got, wretch, ofetch, setInterval, setTimeout, requestAnimationFrame, requestIdleCallback, queueMicrotask
• EXTERNAL_SYNC_OBSERVER_CONSTRUCTORS — IntersectionObserver, MutationObserver, ResizeObserver, PerformanceObserver

Checks

486/486 tests passing locally. Lint, typecheck, format clean. Changeset included (minor bump).

  

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
react-doctor-website	Ready	Preview, Comment	May 8, 2026 9:01am

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 161946b. Configure here.}