fix(performance-quick-trace-query): Using Sentry.captureException to inspect trace endpoint response. (#58167)

Addresses issues:
[issue1](https://sentry.sentry.io/issues/4403078222/?alert_rule_id=13882978&alert_type=issue&notification_uuid=4c5c72e6-a878-43c8-81f2-c8da43c62532&project=11276&referrer=slack)
and
[issue2](https://sentry.sentry.io/issues/4402281669/?alert_rule_id=13882978&alert_type=issue&notification_uuid=ab62210c-9f5c-409f-86e2-6c4c2b27a920&project=11276&referrer=slack).

Prevents issue details page from failing. When error is triggered, we
just display a link to the trace view without the navigator nodes.

---------

Co-authored-by: Abdullah Khan <[email protected]>

Author: Abdkhan14

static/app/utils/performance/quickTrace/quickTraceQuery.tsx

@@ -1,4 +1,5 @@
 import {Fragment} from 'react';
+import * as Sentry from '@sentry/react';
 
 import {Event} from 'sentry/types/event';
 import {DiscoverQueryProps} from 'sentry/utils/discover/genericDiscoverQuery';
@@ -73,6 +74,10 @@ export default function QuickTraceQuery({children, event, ...props}: QueryProps)
               organization
             );
 
+            const scope = new Sentry.Scope();
+            const traceErrorMsg = 'Trace endpoints returning non-array in response';
+            scope.setFingerprint([traceErrorMsg]);
+
             if (
               !traceFullResults.isLoading &&
               traceFullResults.error === null &&
@@ -88,19 +93,31 @@ export default function QuickTraceQuery({children, event, ...props}: QueryProps)
                 });
               }
 
-              for (const subtrace of transactions ??
-                (traceFullResults.traces as TraceFull[])) {
-                try {
-                  const trace = flattenRelevantPaths(event, subtrace);
-                  return children({
-                    ...traceFullResults,
-                    trace,
-                    currentEvent: trace.find(e => isCurrentEvent(e, event)) ?? null,
-                  });
-                } catch {
-                  // let this fall through and check the next subtrace
-                  // or use the trace lite results
+              const traceTransactions =
+                transactions ?? (traceFullResults.traces as TraceFull[]);
+
+              try {
+                for (const subtrace of traceTransactions) {
+                  try {
+                    const trace = flattenRelevantPaths(event, subtrace);
+                    return children({
+                      ...traceFullResults,
+                      trace,
+                      currentEvent: trace.find(e => isCurrentEvent(e, event)) ?? null,
+                    });
+                  } catch {
+                    // let this fall through and check the next subtrace
+                    // or use the trace lite results
+                  }
                 }
+              } catch {
+                // capture exception and let this fall through to
+                // use the /events-trace-lite/ response below
+                scope.setExtras({
+                  traceTransactions,
+                  traceFullResults,
+                });
+                Sentry.captureException(new Error(traceErrorMsg), scope);
               }
             }
 
@@ -118,14 +135,25 @@ export default function QuickTraceQuery({children, event, ...props}: QueryProps)
                   ? orphanErrorsLite[0]
                   : undefined;
               const traceTransactions = transactionLite ?? (trace as TraceLite);
+
+              let traceTransaction: EventLite | undefined;
+              try {
+                traceTransaction = traceTransactions.find(e => isCurrentEvent(e, event));
+              } catch {
+                scope.setExtras({
+                  traceTransaction,
+                  orphanError,
+                  traceTransactions,
+                  trace,
+                });
+                Sentry.captureException(new Error(traceErrorMsg), scope);
+              }
+
               return children({
                 ...traceLiteResults,
-                trace: traceTransactions,
+                trace: Array.isArray(traceTransactions) ? traceTransactions : [],
                 orphanErrors: orphanErrorsLite,
-                currentEvent:
-                  orphanError ??
-                  traceTransactions.find(e => isCurrentEvent(e, event)) ??
-                  null,
+                currentEvent: orphanError ?? traceTransaction ?? null,
               });
             }