diff --git a/static/app/components/events/eventCustomPerformanceMetrics.spec.tsx b/static/app/components/events/eventCustomPerformanceMetrics.spec.tsx index b8c70d1097f75e..28addab5fe4025 100644 --- a/static/app/components/events/eventCustomPerformanceMetrics.spec.tsx +++ b/static/app/components/events/eventCustomPerformanceMetrics.spec.tsx @@ -91,4 +91,21 @@ describe('EventCustomPerformanceMetrics', function () { expect(screen.getByText('Show events with values greater than')).toBeInTheDocument(); expect(screen.getByText('Show events with values less than')).toBeInTheDocument(); }); + + it('should render custom performance metrics custom unit', function () { + const {router, organization} = initializeOrg(); + const event = TestStubs.Event({ + measurements: { + 'custom.unit': {unit: 'customunit', value: 456}, + }, + }); + render( + + ); + expect(screen.getByText('456 customunit')).toBeInTheDocument(); + }); }); diff --git a/static/app/components/events/eventCustomPerformanceMetrics.tsx b/static/app/components/events/eventCustomPerformanceMetrics.tsx index 3903dc01fca63d..045159cf661144 100644 --- a/static/app/components/events/eventCustomPerformanceMetrics.tsx +++ b/static/app/components/events/eventCustomPerformanceMetrics.tsx @@ -91,6 +91,7 @@ export function getFieldTypeFromUnit(unit) { if (unit === 'none') { return 'integer'; } + return 'string'; } return 'number'; } @@ -108,13 +109,14 @@ function EventCustomPerformanceMetric({ } const fieldType = getFieldTypeFromUnit(unit); + const renderValue = fieldType === 'string' ? `${value} ${unit}` : value; const rendered = fieldType ? FIELD_FORMATTERS[fieldType].renderFunc( name, - {[name]: value}, + {[name]: renderValue}, {location, organization, unit} ) - : value; + : renderValue; function generateLinkWithQuery(query: string) { const eventView = EventView.fromLocation(location);