Browse Source

ref(replays): show console tab only for internal video replays (#69420)

Show the console tab for video replays only if the org is under the
feature flag `organizations:session-replay-mobile-network-tab` (the name
isn't very good anymore sadly -- we thought it would only be used to
hide/show the network tab). We want to be able to experiment with
showing certain info in the console tab before we release to customers.

Everyone else with a mobile replay will see:


https://github.com/getsentry/sentry/assets/56095982/871b438b-7386-4999-9dbd-307645d43601



Internal will see:


https://github.com/getsentry/sentry/assets/56095982/84056426-80cb-4cc5-82d8-5a964aab51c2
Michelle Zhang 10 months ago
parent
commit
a365dd807b

+ 1 - 0
static/app/utils/replays/hooks/useActiveReplayTab.tsx

@@ -19,6 +19,7 @@ function isReplayTab({tab, isVideoReplay}: {isVideoReplay: boolean; tab: string}
     TabKey.ERRORS,
     TabKey.BREADCRUMBS,
     TabKey.NETWORK,
+    TabKey.CONSOLE,
   ];
 
   if (isVideoReplay) {

+ 10 - 3
static/app/views/replays/detail/layout/focusTabs.tsx

@@ -17,18 +17,25 @@ import useOrganization from 'sentry/utils/useOrganization';
 
 function getReplayTabs({
   isVideoReplay,
+  organization,
 }: {
   isVideoReplay: boolean;
   organization: Organization;
 }): Record<TabKey, ReactNode> {
   // For video replays, we hide the console, a11y, trace, and memory tabs
-  // The console tab isn't useful for video replays; most of the useful logging
-  // context will come from breadcrumbs
+  // The console tab isn't useful for video replays (for now); most of the
+  // useful logging context will come from breadcrumbs
   // A11y, trace, and memory aren't applicable for mobile
 
+  // Show the console tab if 1) it's a video replay and we have the FF enabled
+  // or 2) it's not a video replay
+  const showConsoleTab = isVideoReplay
+    ? organization.features.includes('session-replay-mobile-network-tab')
+    : true;
+
   return {
     [TabKey.BREADCRUMBS]: t('Breadcrumbs'),
-    [TabKey.CONSOLE]: isVideoReplay ? null : t('Console'),
+    [TabKey.CONSOLE]: showConsoleTab ? t('Console') : null,
     [TabKey.NETWORK]: t('Network'),
     [TabKey.ERRORS]: t('Errors'),
     [TabKey.TRACE]: isVideoReplay ? null : t('Trace'),