From 218d2f6fdc76ce6c4bf9c8efcff0e610b5d49b48 Mon Sep 17 00:00:00 2001
From: Devan Buggay <devanb@meta.com>
Date: Fri, 26 Sep 2025 12:28:25 -0700
Subject: [PATCH] PerfMonitor - Add show/hide to dev menu (#53958)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/53958

Adds a dev menu option to enable/disable the overlay, in case devs want to screenshot/record without disabling it at buildtime.

Changelog: [Internal]

Reviewed By: huntie

Differential Revision: D83293591

fbshipit-source-id: 3564b83a279db296d1cd22a8e8a83876cc705dbd
---
 .../react/devsupport/DevSupportManagerBase.kt  | 18 ++++++++++++++++++
 .../perfmonitor/PerfMonitorOverlayManager.kt   |  5 +++++
 .../src/main/res/devsupport/values/strings.xml |  2 ++
 3 files changed, 25 insertions(+)

diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevSupportManagerBase.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevSupportManagerBase.kt
index f6f4faa3bf6..c29044beef6 100644
--- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevSupportManagerBase.kt
+++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevSupportManagerBase.kt
@@ -398,6 +398,24 @@ public abstract class DevSupportManagerBase(
           }
     }
 
+    if (ReactNativeFeatureFlags.perfMonitorV2Enabled()) {
+      val isConnected = isPackagerConnected
+
+      val togglePerfMonitorItemString =
+          if (perfMonitorOverlayManager?.isEnabled == true)
+              applicationContext.getString(R.string.catalyst_performance_disable)
+          else applicationContext.getString(R.string.catalyst_performance_enable)
+
+      if (!isConnected) {
+        disabledItemKeys.add(togglePerfMonitorItemString)
+      }
+
+      options[togglePerfMonitorItemString] =
+          if (perfMonitorOverlayManager?.isEnabled == true)
+              DevOptionHandler { perfMonitorOverlayManager?.disable() }
+          else DevOptionHandler { perfMonitorOverlayManager?.enable() }
+    }
+
     options[applicationContext.getString(R.string.catalyst_change_bundle_location)] =
         DevOptionHandler {
           val context = reactInstanceDevHelper.currentActivity
diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/perfmonitor/PerfMonitorOverlayManager.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/perfmonitor/PerfMonitorOverlayManager.kt
index 795fd1e2f13..f093c0b92df 100644
--- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/perfmonitor/PerfMonitorOverlayManager.kt
+++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/devsupport/perfmonitor/PerfMonitorOverlayManager.kt
@@ -15,6 +15,11 @@ internal class PerfMonitorOverlayManager(
     private val onRequestOpenDevTools: () -> Unit,
 ) : PerfMonitorUpdateListener {
   private var enabled: Boolean = false
+
+  /** Whether the Perf Monitor overlay is currently enabled. */
+  val isEnabled: Boolean
+    get() = enabled
+
   private var view: PerfMonitorOverlayView? = null
   private var tracingState: TracingState = TracingState.ENABLEDINCDPMODE
 
diff --git a/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml b/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml
index 19e9c21abc7..29a8b8d1dea 100644
--- a/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml
+++ b/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml
@@ -13,6 +13,8 @@
   <string name="catalyst_performance_background" project="catalyst" translatable="false">Finish performance trace</string>
   <string name="catalyst_performance_disabled" project="catalyst" translatable="false">Start performance trace</string>
   <string name="catalyst_performance_cdp" project="catalyst" translatable="false">Performance tracing disabled</string>
+  <string name="catalyst_performance_enable" project="catalyst" translatable="false">Show performance overlay</string>
+  <string name="catalyst_performance_disable" project="catalyst" translatable="false">Hide performance overlay</string>
   <string name="catalyst_debug_open_disabled" project="catalyst" translatable="false">Connect to the bundler to debug JavaScript</string>
   <string name="catalyst_debug_connecting" project="catalyst" translatable="false">Connecting to debugger...</string>
   <string name="catalyst_debug_error" project="catalyst" translatable="false">Failed to connect to debugger!</string>