feat(new-trace): Updating discover event links and trace id links. (#68735)

- Trace id links should take you to the trace view without focussing on
an event
- Event id link from discover, when not representing a transaction, can
have no associated trace. These point to error issues, and we take the
user to the issue details page for this case.

---------

Co-authored-by: Abdullah Khan <abdullahkhan@PG9Y57YDXQ.local>

static/app/views/discover/table/index.tsx

@@ -138,6 +138,8 @@ class Table extends PureComponent<TableProps, TableState> {
     // Note: Event ID or 'id' is added to the fields in the API payload response by default for all non-aggregate queries.
     if (!eventView.hasAggregateField()) {
       apiPayload.field.push('trace');
+      apiPayload.field.push('issue');
+      apiPayload.field.push('event.type');
     }
 
     apiPayload.referrer = 'api.discover.query-table';

static/app/views/discover/table/tableView.tsx

@@ -189,15 +189,29 @@ function TableView(props: TableViewProps) {
         value = fieldRenderer(dataRow, {organization, location});
       }
 
-      const target = generateLinkToEventInTraceView({
-        eventSlug: generateEventSlug(dataRow),
-        dataRow,
-        organization,
-        eventView,
-        isHomepage,
-        location,
-        type: 'discover',
-      });
+      let target;
+      if (dataRow.trace !== null) {
+        target = generateLinkToEventInTraceView({
+          eventSlug: generateEventSlug(dataRow),
+          dataRow,
+          organization,
+          eventView,
+          isHomepage,
+          location,
+          type: 'discover',
+        });
+      } else {
+        if (dataRow['event.type'] === 'transaction') {
+          throw new Error(
+            'Transaction event should always have a trace associated with it.'
+          );
+        }
+
+        target = {
+          pathname: `/organizations/${organization.slug}/issues/${dataRow['issue.id']}/events/${dataRow.id}/?referrer=discover-events-table`,
+          query: location.query,
+        };
+      }
 
       const eventIdLink = (
         <StyledLink data-test-id="view-event" to={target}>
@@ -297,15 +311,30 @@ function TableView(props: TableViewProps) {
     let cell = fieldRenderer(dataRow, {organization, location, unit});
 
     if (columnKey === 'id') {
-      const target = generateLinkToEventInTraceView({
-        eventSlug: generateEventSlug(dataRow),
-        dataRow,
-        organization,
-        eventView,
-        isHomepage,
-        location,
-        type: 'discover',
-      });
+      let target;
+
+      if (dataRow.trace !== null) {
+        target = generateLinkToEventInTraceView({
+          eventSlug: generateEventSlug(dataRow),
+          dataRow,
+          organization,
+          eventView,
+          isHomepage,
+          location,
+          type: 'discover',
+        });
+      } else {
+        if (dataRow['event.type'] === 'transaction') {
+          throw new Error(
+            'Transaction event should always have a trace associated with it.'
+          );
+        }
+
+        target = {
+          pathname: `/organizations/${organization.slug}/issues/${dataRow['issue.id']}/events/${dataRow.id}/?referrer=discover-events-table`,
+          query: location.query,
+        };
+      }
 
       const idLink = (
         <StyledLink data-test-id="view-event" to={target}>
@@ -350,8 +379,7 @@ function TableView(props: TableViewProps) {
           String(dataRow.trace),
           dateSelection,
           {},
-          timestamp,
-          dataRow.id
+          timestamp
         );
 
         cell = (

static/app/views/performance/newTraceDetails/trace.tsx

@@ -2042,6 +2042,8 @@ const TraceStylingWrapper = styled('div')`
       color: ${p => p.theme.blue300};
 
       &.Errored {
+        color: ${p => p.theme.error};
+
         .TraceChildrenCount {
           background-color: ${p => p.theme.error} !important;
         }

static/app/views/performance/transactionSummary/utils.tsx

@@ -137,8 +137,7 @@ export function generateTraceLink(dateSelection) {
       traceId,
       dateSelection,
       {},
-      tableRow.timestamp,
-      tableRow.id
+      tableRow.timestamp
     );
   };
 }