ref(perf): Use span IDs instead of event IDs in samples table (#68295)

Updates the samples table in the slideout panel to list span IDs instead
of event IDs, since we are now focusing on a span-centric flow. The
querying and linking works the same as before, we just opt to display
the span ID in the table instead now.

### Before

![image](https://github.com/getsentry/sentry/assets/16740047/b8b3dc16-d752-4a4b-84ab-638d043810c8)

### After

![image](https://github.com/getsentry/sentry/assets/16740047/26b750e1-d833-4164-89ed-558018829b04)

static/app/views/starfish/components/samplesTable/spanSamplesTable.tsx

@@ -30,6 +30,7 @@ const {HTTP_RESPONSE_CONTENT_LENGTH} = SpanMetricsField;
 
 type Keys =
   | 'transaction_id'
+  | 'span_id'
   | 'profile_id'
   | 'timestamp'
   | 'duration'
@@ -40,8 +41,8 @@ export type SamplesTableColumnHeader = GridColumnHeader<Keys>;
 
 export const DEFAULT_COLUMN_ORDER: SamplesTableColumnHeader[] = [
   {
-    key: 'transaction_id',
-    name: 'Event ID',
+    key: 'span_id',
+    name: 'Span ID',
     width: COL_WIDTH_UNDEFINED,
   },
   {
@@ -125,7 +126,7 @@ export function SpanSamplesTable({
       onMouseEnter: () => handleMouseOverBodyCell(row),
     };
 
-    if (column.key === 'transaction_id') {
+    if (column.key === 'span_id') {
       return (
         <Link
           to={generateLinkToEventInTraceView({
@@ -145,7 +146,7 @@ export function SpanSamplesTable({
           })}
           {...commonProps}
         >
-          {row['transaction.id'].slice(0, 8)}
+          {row.span_id}
         </Link>
       );
     }