[DevTools] Wrap each tab in <Activity> if available

[everettbu]

Mirror of facebook/react#34426
Original author: eps1lon

---

The divs are already hidden={true} so we can tell React to deprioritize the hidden tabs. That way Suspense related effects like auto-scroll and suspense auto-selection don't apply while using the Components tab.

I also introduced StrictMode into the DevTools tree to find potential issues.

[greptile-apps]

Greptile Overview

Greptile Summary

This PR enhances React DevTools by wrapping each tab in <Activity> to deprioritize hidden tabs and introducing <StrictMode> for better error detection.

• Wrapped Components, Profiler, and Suspense tabs in <MaybeActivity> with mode="hidden" or mode="visible" based on active tab
• Added graceful fallback for environments where React.Activity or React.unstable_Activity is not available
• Wrapped entire DevTools tree in <StrictMode> to surface potential issues during development
• Fixed bug in UseEffectEvent.js where destructuring incorrectly extracted onClick from custom hook

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• All changes are well-structured performance optimizations and bug fixes. The Activity wrapper correctly implements the mode prop (hidden/visible), includes proper fallback for older React versions, and the StrictMode addition helps catch potential issues. The UseEffectEvent bug fix is straightforward and correct.
• No files require special attention

Important Files Changed

File Analysis

Filename	Score	Overview
packages/react-devtools-shared/src/devtools/views/DevTools.js	5/5	Wrapped tabs in <Activity> to deprioritize hidden tabs and added <StrictMode> wrapper to DevTools tree
packages/react-devtools-shell/src/app/InspectableElements/UseEffectEvent.js	5/5	Fixed destructuring to properly extract onClick from custom hook's return array

[greptile-apps]

_{2 files reviewed, no comments}

_{Edit Code Review Agent Settings | Greptile}