Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(dashboards): Pass LineChart series meta alongside the data #82047

Merged
merged 1 commit into from
Dec 20, 2024
Merged

feat(dashboards): Pass LineChart series meta alongside the data #82047

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 0 additions & 16 deletions static/app/views/dashboards/contexts/widgetSyncContext.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,29 +35,13 @@ export default storyBook('WidgetSyncContext', story => {
<LineChartWidget
title="span.duration"
timeseries={[sampleDurationTimeSeries]}
meta={{
fields: {
'span.duration': 'duration',
},
units: {
'span.duration': 'millisecond',
},
}}
/>
</MediumWidget>
{visible && (
<MediumWidget>
<LineChartWidget
title="span.duration"
timeseries={[sampleThroughputTimeSeries]}
meta={{
fields: {
'spm()': 'rate',
},
units: {
'spm()': '1/minute',
},
}}
/>
</MediumWidget>
)}
Expand Down
1 change: 1 addition & 0 deletions static/app/views/dashboards/widgets/common/types.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ export type TimeseriesData = {
data: TimeSeriesItem[];
field: string;
color?: string;
meta?: Meta;
};

export type ErrorProp = Error | string;
Expand Down
8 changes: 0 additions & 8 deletions static/app/views/dashboards/widgets/lineChartWidget/lineChartWidget.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,6 @@ describe('LineChartWidget', () => {
title="eps()"
description="Number of events per second"
timeseries={[sampleDurationTimeSeries]}
meta={{
fields: {
'eps()': 'rate',
},
units: {
'eps()': '1/second',
},
}}
/>
);
});
Expand Down
58 changes: 24 additions & 34 deletions static/app/views/dashboards/widgets/lineChartWidget/lineChartWidget.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,14 @@ const sampleDurationTimeSeries2 = {
value: datum.value * 0.3 + 30 * Math.random(),
};
}),
meta: {
fields: {
'p50(span.duration)': 'duration',
},
units: {
'p50(span.duration)': 'millisecond',
},
},
};

export default storyBook(LineChartWidget, story => {
Expand Down Expand Up @@ -76,14 +84,6 @@ export default storyBook(LineChartWidget, story => {
title="eps()"
description="Number of events per second"
timeseries={[throughputTimeSeries]}
meta={{
fields: {
'eps()': 'rate',
},
units: {
'eps()': '1/second',
},
}}
/>
</SmallSizingWindow>

Expand All @@ -103,16 +103,6 @@ export default storyBook(LineChartWidget, story => {
shiftTimeserieToNow(durationTimeSeries1),
shiftTimeserieToNow(durationTimeSeries2),
]}
meta={{
fields: {
'p99(span.duration)': 'duration',
'p50(span.duration)': 'duration',
},
units: {
'p99(span.duration)': 'millisecond',
'p50(span.duration)': 'millisecond',
},
}}
/>
</MediumWidget>
</SideBySide>
Expand Down Expand Up @@ -172,17 +162,17 @@ export default storyBook(LineChartWidget, story => {
{
...sampleThroughputTimeSeries,
field: 'error_rate()',
meta: {
fields: {
'error_rate()': 'rate',
},
units: {
'error_rate()': '1/second',
},
},
color: theme.error,
} as unknown as TimeseriesData,
]}
meta={{
fields: {
'error_rate()': 'rate',
},
units: {
'error_rate()': '1/second',
},
}}
/>
</MediumWidget>
</Fragment>
Expand Down Expand Up @@ -216,17 +206,17 @@ export default storyBook(LineChartWidget, story => {
{
...sampleThroughputTimeSeries,
field: 'error_rate()',
meta: {
fields: {
'error_rate()': 'rate',
},
units: {
'error_rate()': '1/second',
},
},
} as unknown as TimeseriesData,
]}
releases={releases}
meta={{
fields: {
'error_rate()': 'rate',
},
units: {
'error_rate()': '1/second',
},
}}
/>
</MediumWidget>
</Fragment>
Expand Down
1 change: 0 additions & 1 deletion static/app/views/dashboards/widgets/lineChartWidget/lineChartWidget.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,6 @@ export function LineChartWidget(props: LineChartWidgetProps) {
<LineChartWidgetVisualization
timeseries={timeseries}
releases={props.releases}
meta={props.meta}
dataCompletenessDelay={props.dataCompletenessDelay}
/>
</LineChartWrapper>
Expand Down
8 changes: 3 additions & 5 deletions static/app/views/dashboards/widgets/lineChartWidget/lineChartWidgetVisualization.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import usePageFilters from 'sentry/utils/usePageFilters';

import {useWidgetSyncContext} from '../../contexts/widgetSyncContext';
import {ReleaseSeries} from '../common/releaseSeries';
import type {Meta, Release, TimeseriesData} from '../common/types';
import type {Release, TimeseriesData} from '../common/types';

import {formatTooltipValue} from './formatTooltipValue';
import {formatYAxisValue} from './formatYAxisValue';
Expand All @@ -29,7 +29,6 @@ import {splitSeriesIntoCompleteAndIncomplete} from './splitSeriesIntoCompleteAnd
export interface LineChartWidgetVisualizationProps {
timeseries: TimeseriesData[];
dataCompletenessDelay?: number;
meta?: Meta;
releases?: Release[];
}

Expand All @@ -39,7 +38,6 @@ export function LineChartWidgetVisualization(props: LineChartWidgetVisualization

const pageFilters = usePageFilters();
const {start, end, period, utc} = pageFilters.selection.datetime;
const {meta} = props;

const dataCompletenessDelay = props.dataCompletenessDelay ?? 0;

Expand Down Expand Up @@ -95,8 +93,8 @@ export function LineChartWidgetVisualization(props: LineChartWidgetVisualization

// TODO: Raise error if attempting to plot series of different types or units
const firstSeriesField = firstSeries?.field;
const type = meta?.fields?.[firstSeriesField] ?? 'number';
const unit = meta?.units?.[firstSeriesField] ?? undefined;
const type = firstSeries?.meta?.fields?.[firstSeriesField] ?? 'number';
const unit = firstSeries?.meta?.units?.[firstSeriesField] ?? undefined;

const formatter: TooltipFormatterCallback<TopLevelFormatterParams> = (
params,
Expand Down
8 changes: 8 additions & 0 deletions static/app/views/dashboards/widgets/lineChartWidget/sampleDurationTimeSeries.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,13 @@
{
"field": "p99(span.duration)",
"meta": {
"fields": {
"p99(span.duration)": "duration"
},
"units": {
"p99(span.duration)": "millisecond"
}
},
"data": [
{
"value": 163.26759544018776,
Expand Down
8 changes: 8 additions & 0 deletions static/app/views/dashboards/widgets/lineChartWidget/sampleThroughputTimeSeries.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,13 @@
{
"field": "eps()",
"meta": {
"fields": {
"eps()": "rate"
},
"units": {
"eps()": "1/second"
}
},
"data": [
{
"value": 7456.966666666666,
Expand Down
Loading