Skip to content

Commit 7002ae7

Browse files
authored
feat(insights): update useIndexedResourcesQuery to use useIndexedSpans (#89087)
1 parent f791585 commit 7002ae7

File tree

3 files changed

+23
-59
lines changed

3 files changed

+23
-59
lines changed

static/app/views/insights/browser/resources/components/sampleImages.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ function SampleImages({groupId, projectId}: Props) {
5353

5454
const filteredResources = imageResources
5555
.filter(resource => {
56-
const fileName = getFileNameFromDescription(resource[SPAN_DESCRIPTION]!);
56+
const fileName = getFileNameFromDescription(resource[SPAN_DESCRIPTION]);
5757
if (uniqueResources.has(fileName)) {
5858
return false;
5959
}
@@ -126,11 +126,11 @@ function SampleImagesChartPanelBody(props: {
126126
<ImageWrapper>
127127
{images.map(resource => {
128128
const hasRawDomain = Boolean(resource[RAW_DOMAIN]);
129-
const isRelativeUrl = resource[SPAN_DESCRIPTION]!.startsWith('/');
130-
let src = resource[SPAN_DESCRIPTION]!;
129+
const isRelativeUrl = resource[SPAN_DESCRIPTION].startsWith('/');
130+
let src = resource[SPAN_DESCRIPTION];
131131
if (isRelativeUrl && hasRawDomain) {
132132
try {
133-
const url = new URL(resource[SPAN_DESCRIPTION]!, resource[RAW_DOMAIN]);
133+
const url = new URL(resource[SPAN_DESCRIPTION], resource[RAW_DOMAIN]);
134134
src = url.href;
135135
} catch {
136136
Sentry.setContext('resource', {
@@ -146,7 +146,7 @@ function SampleImagesChartPanelBody(props: {
146146
<ImageContainer
147147
src={src}
148148
showImage={isImagesEnabled}
149-
fileName={getFileNameFromDescription(resource[SPAN_DESCRIPTION]!)}
149+
fileName={getFileNameFromDescription(resource[SPAN_DESCRIPTION])}
150150
size={resource[`measurements.${HTTP_RESPONSE_CONTENT_LENGTH}`]}
151151
key={resource[SPAN_DESCRIPTION]}
152152
/>
Lines changed: 13 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,12 @@
1-
import {useDiscoverQuery} from 'sentry/utils/discover/discoverQuery';
2-
import EventView from 'sentry/utils/discover/eventView';
31
import type {Sort} from 'sentry/utils/discover/fields';
4-
import {DiscoverDatasets} from 'sentry/utils/discover/types';
5-
import {useLocation} from 'sentry/utils/useLocation';
6-
import useOrganization from 'sentry/utils/useOrganization';
7-
import usePageFilters from 'sentry/utils/usePageFilters';
2+
import {useSpansIndexed} from 'sentry/views/insights/common/queries/useDiscover';
83
import {SpanIndexedField} from 'sentry/views/insights/types';
94

10-
const {SPAN_DESCRIPTION, HTTP_RESPONSE_CONTENT_LENGTH, RAW_DOMAIN} = SpanIndexedField;
11-
125
type Options = {
6+
referrer: string;
137
enabled?: boolean;
148
limit?: number;
159
queryConditions?: string[];
16-
referrer?: string;
1710
sorts?: Sort[];
1811
};
1912

@@ -24,55 +17,21 @@ export const useIndexedResourcesQuery = ({
2417
referrer,
2518
enabled = true,
2619
}: Options) => {
27-
const pageFilters = usePageFilters();
28-
const location = useLocation();
29-
const {slug: orgSlug} = useOrganization();
30-
31-
// TODO - we should be using metrics data here
32-
const eventView = EventView.fromNewQueryWithPageFilters(
20+
return useSpansIndexed(
3321
{
3422
fields: [
3523
`any(id)`,
36-
'project',
37-
'span.group',
38-
RAW_DOMAIN,
39-
SPAN_DESCRIPTION,
40-
`measurements.${HTTP_RESPONSE_CONTENT_LENGTH}`,
24+
SpanIndexedField.PROJECT,
25+
SpanIndexedField.SPAN_GROUP,
26+
SpanIndexedField.RAW_DOMAIN,
27+
SpanIndexedField.SPAN_DESCRIPTION,
28+
SpanIndexedField.MEASUREMENT_HTTP_RESPONSE_CONTENT_LENGTH,
4129
],
42-
name: 'Indexed Resource Query',
43-
query: queryConditions.join(' '),
44-
version: 2,
45-
dataset: DiscoverDatasets.SPANS_INDEXED,
46-
},
47-
pageFilters.selection
48-
);
49-
50-
if (sorts) {
51-
eventView.sorts = sorts;
52-
}
53-
54-
const result = useDiscoverQuery({
55-
eventView,
56-
limit,
57-
location,
58-
orgSlug,
59-
referrer,
60-
options: {
30+
limit,
31+
sorts,
32+
search: queryConditions.join(' '),
6133
enabled,
62-
refetchOnWindowFocus: false,
6334
},
64-
});
65-
66-
const data =
67-
result?.data?.data.map(row => ({
68-
project: row.project as string,
69-
'transaction.id': row['transaction.id'] as string,
70-
[SPAN_DESCRIPTION]: row[SPAN_DESCRIPTION]?.toString(),
71-
[RAW_DOMAIN]: row[RAW_DOMAIN]?.toString(),
72-
'measurements.http.response_content_length': row[
73-
`measurements.${HTTP_RESPONSE_CONTENT_LENGTH}`
74-
] as number,
75-
})) ?? [];
76-
77-
return {...result, data};
35+
referrer
36+
);
7837
};

static/app/views/insights/types.tsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -302,6 +302,7 @@ export enum SpanIndexedField {
302302
LCP_ELEMENT = 'lcp.element',
303303
CLS_SOURCE = 'cls.source.1',
304304
NORMALIZED_DESCRIPTION = 'sentry.normalized_description',
305+
MEASUREMENT_HTTP_RESPONSE_CONTENT_LENGTH = 'measurements.http.response_content_length',
305306
}
306307

307308
export type SpanIndexedResponse = {
@@ -391,6 +392,10 @@ export type SpanIndexedResponse = {
391392
[SpanIndexedField.USER_GEO_SUBREGION]: string;
392393
[SpanIndexedField.LCP_ELEMENT]: string;
393394
[SpanIndexedField.CLS_SOURCE]: string;
395+
[SpanIndexedField.MEASUREMENT_HTTP_RESPONSE_CONTENT_LENGTH]: number;
396+
[SpanIndexedField.PROJECT]: string;
397+
[SpanIndexedField.SPAN_GROUP]: string;
398+
'any(id)': string;
394399
};
395400

396401
export type SpanIndexedProperty = keyof SpanIndexedResponse;

0 commit comments

Comments
 (0)