fix(issues) preserve previous and next issue in view (#81980)

Preserve previous and next issue in trace view previews as opposed to only the issue we are linking to. Before ![CleanShot 2024-12-11 at 15 21 21@2x](https://github.com/user-attachments/assets/fcfff148-6eef-487d-86bb-3c6ba771c419) After ![CleanShot 2024-12-11 at 15 20 45@2x](https://github.com/user-attachments/assets/a742fe79-79c3-4afe-a40d-3aaecee3596b)
getsentry · Dec 19, 2024 · 128ea48 · 128ea48
1 parent 70fe5ee
commit 128ea48
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 7 deletions.
diff --git a/static/app/views/performance/newTraceDetails/issuesTraceWaterfall.tsx b/static/app/views/performance/newTraceDetails/issuesTraceWaterfall.tsx
@@ -190,11 +190,38 @@ export function IssuesTraceWaterfall(props: IssuesTraceWaterfallProps) {
       nodes?.find(n => isSpanNode(n)) ||
       nodes?.find(n => isTransactionNode(n));
 
+    const index = node ? props.tree.list.indexOf(node) : -1;
+
     if (node) {
-      props.tree.collapseList([node]);
+      const preserveNodes: TraceTreeNode<TraceTree.NodeValue>[] = [node];
+
+      let start = index;
+      while (--start > 0) {
+        if (
+          isTraceErrorNode(props.tree.list[start]) ||
+          node.errors.size > 0 ||
+          node.performance_issues.size > 0
+        ) {
+          preserveNodes.push(props.tree.list[start]!);
+          break;
+        }
+      }
+
+      start = index;
+      while (++start < props.tree.list.length) {
+        if (
+          isTraceErrorNode(props.tree.list[start]) ||
+          node.errors.size > 0 ||
+          node.performance_issues.size > 0
+        ) {
+          preserveNodes.push(props.tree.list[start]!);
+          break;
+        }
+      }
+
+      props.tree.collapseList(preserveNodes);
     }
 
-    const index = node ? props.tree.list.indexOf(node) : -1;
     if (index === -1 || !node) {
       const hasScrollComponent = !!props.event.eventID;
       if (hasScrollComponent) {

diff --git a/...views/performance/newTraceDetails/traceModels/__snapshots__/issuesTraceTree.spec.tsx.snap b/...views/performance/newTraceDetails/traceModels/__snapshots__/issuesTraceTree.spec.tsx.snap
@@ -3,7 +3,8 @@
 exports[`IssuesTraceTree FromSpans collapses spans 1`] = `
 "
 collapsed
-      http - GET /
+    transaction 2 - transaction.op
+      collapsed
       db - SELECT
       cache - GET
       http - GET /
@@ -13,7 +14,7 @@ collapsed
 
 exports[`IssuesTraceTree collapsed nodes without errors 1`] = `
 "
-trace root
+collapsed
   transaction 1 - transaction.op
   transaction 2 - transaction.op
   transaction 3 - transaction.op

diff --git a/static/app/views/performance/newTraceDetails/traceModels/issuesTraceTree.tsx b/static/app/views/performance/newTraceDetails/traceModels/issuesTraceTree.tsx
@@ -95,15 +95,22 @@ export class IssuesTraceTree extends TraceTree {
   collapseList(preserveLeafNodes: TraceTreeNode[]) {
     const preserveNodes = new Set(preserveLeafNodes);
 
+    for (const node of preserveLeafNodes) {
+      const parentTransaction = TraceTree.ParentTransaction(node);
+      if (parentTransaction) {
+        preserveNodes.add(parentTransaction);
+      }
+    }
+
     for (const node of preserveLeafNodes) {
       const index = this.list.indexOf(node);
       if (index === -1) {
         continue;
       }
 
-      // Preserve the previous 3 nodes
+      // Preserve the previous 2 nodes
       let i = Math.max(index - 1, 0);
-      while (i > index - 4) {
+      while (i > index - 3) {
         if (this.list[i]) {
           preserveNodes.add(this.list[i]);
         }

diff --git a/static/app/views/performance/newTraceDetails/traceRow/traceCollapsedRow.tsx b/static/app/views/performance/newTraceDetails/traceRow/traceCollapsedRow.tsx
@@ -53,7 +53,7 @@ export function TraceCollapsedRow(props: TraceRowProps<CollapsedNode>) {
               ? t('hidden span')
               : t('hidden spans')
             : null}
-          {stats.events > 0 && ', '}
+          {stats.issues > 0 && stats.events > 0 && ', '}
           {stats.issues > 0 ? stats.issues : null}{' '}
           {stats.issues > 0
             ? stats.issues === 1