From 9f7641e0fe71ea990f699b9ef01e64d1c5f4c9cd Mon Sep 17 00:00:00 2001
From: Catherine Lee <55311782+c298lee@users.noreply.github.com>
Date: Thu, 14 Nov 2024 15:36:04 -0500
Subject: [PATCH 1/3] consider Logcat and Timber as console frames

---
 static/app/utils/replays/hydrateBreadcrumbs.tsx           | 4 ++++
 static/app/utils/replays/replayReader.tsx                 | 3 ++-
 .../views/replays/detail/console/useConsoleFilters.tsx    | 8 ++++++--
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/static/app/utils/replays/hydrateBreadcrumbs.tsx b/static/app/utils/replays/hydrateBreadcrumbs.tsx
index 88399d7a16059f..cdfbfb581319a2 100644
--- a/static/app/utils/replays/hydrateBreadcrumbs.tsx
+++ b/static/app/utils/replays/hydrateBreadcrumbs.tsx
@@ -25,6 +25,10 @@ export default function hydrateBreadcrumbs(
             description: t('Encountered an error while hydrating'),
           };
         }
+        // Logcat and Timber are considered a console frame instead of a custom breadcrumb frame
+        if (frame.category === 'Logcat' || frame.category === 'Timber') {
+          frame.category = 'console';
+        }
         return {
           ...frame,
           // custom frames might not have a defined category, so we need to set one
diff --git a/static/app/utils/replays/replayReader.tsx b/static/app/utils/replays/replayReader.tsx
index 796500c52f8b2b..fa08f69d7a14bd 100644
--- a/static/app/utils/replays/replayReader.tsx
+++ b/static/app/utils/replays/replayReader.tsx
@@ -41,6 +41,7 @@ import {
   getNodeIds,
   IncrementalSource,
   isCLSFrame,
+  isConsoleFrame,
   isDeadClick,
   isDeadRageClick,
   isPaintFrame,
@@ -507,7 +508,7 @@ export default class ReplayReader {
   getErrorFrames = () => this._errors;
 
   getConsoleFrames = memoize(() =>
-    this._sortedBreadcrumbFrames.filter(frame => frame.category === 'console')
+    this._sortedBreadcrumbFrames.filter(frame => isConsoleFrame(frame))
   );
 
   getNavigationFrames = memoize(() =>
diff --git a/static/app/views/replays/detail/console/useConsoleFilters.tsx b/static/app/views/replays/detail/console/useConsoleFilters.tsx
index fffde1d8a3992d..99d580650900c0 100644
--- a/static/app/views/replays/detail/console/useConsoleFilters.tsx
+++ b/static/app/views/replays/detail/console/useConsoleFilters.tsx
@@ -5,7 +5,11 @@ import type {SelectOption} from 'sentry/components/compactSelect';
 import {defined} from 'sentry/utils';
 import {decodeList, decodeScalar} from 'sentry/utils/queryString';
 import useFiltersInLocationQuery from 'sentry/utils/replays/hooks/useFiltersInLocationQuery';
-import type {BreadcrumbFrame, ConsoleFrame} from 'sentry/utils/replays/types';
+import {
+  type BreadcrumbFrame,
+  type ConsoleFrame,
+  isConsoleFrame,
+} from 'sentry/utils/replays/types';
 import {filterItems} from 'sentry/views/replays/detail/utils';
 
 export interface ConsoleSelectOption extends SelectOption<string> {
@@ -32,7 +36,7 @@ type Return = {
 };
 
 function getFilterableField(frame: BreadcrumbFrame) {
-  if (frame.category === 'console') {
+  if (isConsoleFrame(frame)) {
     const consoleFrame = frame as ConsoleFrame;
     return consoleFrame.level;
   }

From 33930ab791336b645ead036ad97bf0e04374c4fe Mon Sep 17 00:00:00 2001
From: Catherine Lee <55311782+c298lee@users.noreply.github.com>
Date: Thu, 14 Nov 2024 16:34:32 -0500
Subject: [PATCH 2/3] don't mutate original frame

---
 static/app/utils/replays/hydrateBreadcrumbs.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/static/app/utils/replays/hydrateBreadcrumbs.tsx b/static/app/utils/replays/hydrateBreadcrumbs.tsx
index cdfbfb581319a2..c0af033456bf73 100644
--- a/static/app/utils/replays/hydrateBreadcrumbs.tsx
+++ b/static/app/utils/replays/hydrateBreadcrumbs.tsx
@@ -25,14 +25,14 @@ export default function hydrateBreadcrumbs(
             description: t('Encountered an error while hydrating'),
           };
         }
-        // Logcat and Timber are considered a console frame instead of a custom breadcrumb frame
-        if (frame.category === 'Logcat' || frame.category === 'Timber') {
-          frame.category = 'console';
-        }
         return {
           ...frame,
+          // Logcat and Timber are considered a console frame instead of a custom breadcrumb frame
           // custom frames might not have a defined category, so we need to set one
-          category: frame.category || defaultTitle(frame) || 'custom',
+          category:
+            frame.category === 'Logcat' || frame.category === 'Timber'
+              ? 'console'
+              : frame.category || defaultTitle(frame) || 'custom',
           offsetMs: Math.abs(time.getTime() - startTimestampMs),
           timestamp: time,
           timestampMs: time.getTime(),

From 9c5ea14e59a966e209890d1742daa307a3e85b8e Mon Sep 17 00:00:00 2001
From: Catherine Lee <55311782+c298lee@users.noreply.github.com>
Date: Thu, 14 Nov 2024 17:09:10 -0500
Subject: [PATCH 3/3] Update static/app/utils/replays/hydrateBreadcrumbs.tsx

---
 static/app/utils/replays/hydrateBreadcrumbs.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/static/app/utils/replays/hydrateBreadcrumbs.tsx b/static/app/utils/replays/hydrateBreadcrumbs.tsx
index c0af033456bf73..00612137650dff 100644
--- a/static/app/utils/replays/hydrateBreadcrumbs.tsx
+++ b/static/app/utils/replays/hydrateBreadcrumbs.tsx
@@ -27,7 +27,7 @@ export default function hydrateBreadcrumbs(
         }
         return {
           ...frame,
-          // Logcat and Timber are considered a console frame instead of a custom breadcrumb frame
+          // Logcat and Timber are used for mobile replays and are considered a console frame instead of a custom breadcrumb frame
           // custom frames might not have a defined category, so we need to set one
           category:
             frame.category === 'Logcat' || frame.category === 'Timber'