diff --git a/static/app/views/performance/newTraceDetails/traceRow/traceIcons.tsx b/static/app/views/performance/newTraceDetails/traceRow/traceIcons.tsx
index b6f5c06827a2e5..63945b3e23d382 100644
--- a/static/app/views/performance/newTraceDetails/traceRow/traceIcons.tsx
+++ b/static/app/views/performance/newTraceDetails/traceRow/traceIcons.tsx
@@ -1,5 +1,9 @@
import {Fragment, useMemo} from 'react';
+import styled from '@emotion/styled';
import clamp from 'lodash/clamp';
+import {PlatformIcon} from 'platformicons';
+
+import {useHasTraceNewUi} from 'sentry/views/performance/newTraceDetails/useHasTraceNewUi';
import {TraceIcons} from '../traceIcons';
import type {TraceTree} from '../traceModels/traceTree';
@@ -95,3 +99,18 @@ export function TracePerformanceIssueIcons(props: TracePerformanceIssueIconsProp
);
}
+
+export function SpanProjectIcon({platform}: {platform: string}) {
+ const hasTraceNewUi = useHasTraceNewUi();
+
+ if (!hasTraceNewUi) {
+ return null;
+ }
+
+ return ;
+}
+
+const FaintProjectIcon = styled(PlatformIcon)`
+ opacity: 0.2;
+ filter: grayscale(1);
+`;
diff --git a/static/app/views/performance/newTraceDetails/traceRow/traceSpanRow.tsx b/static/app/views/performance/newTraceDetails/traceRow/traceSpanRow.tsx
index ffbd5f1ad7e9b2..d64d4d8372e413 100644
--- a/static/app/views/performance/newTraceDetails/traceRow/traceSpanRow.tsx
+++ b/static/app/views/performance/newTraceDetails/traceRow/traceSpanRow.tsx
@@ -1,3 +1,5 @@
+import {SpanProjectIcon} from 'sentry/views/performance/newTraceDetails/traceRow/traceIcons';
+
import {TraceIcons} from '../traceIcons';
import type {TraceTree} from '../traceModels/traceTree';
import type {TraceTreeNode} from '../traceModels/traceTreeNode';
@@ -57,6 +59,9 @@ export function TraceSpanRow(props: TraceRowProps>
) : null}
+
{props.node.value.op ?? ''}
—