Alerting: Fix explore link in alert detail view (#66106)

This commit is contained in:
Gilles De Mey 2023-04-07 13:48:46 +02:00 committed by GitHub
parent 3e12b72f58
commit cb8a5b2c96
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 47 additions and 33 deletions

View File

@ -44,47 +44,51 @@ export function GrafanaRuleQueryViewer({
const dsByUid = keyBy(Object.values(config.datasources), (ds) => ds.uid);
const dataQueries = queries.filter((q) => !isExpressionQuery(q.model));
const expressions = queries.filter((q) => isExpressionQuery(q.model));
const styles = useStyles2(getExpressionViewerStyles);
return (
<Stack gap={2} direction="column">
<Stack gap={2}>
{dataQueries.map(({ model, relativeTimeRange, refId, datasourceUid }, index) => {
const dataSource = dsByUid[datasourceUid];
<div className={styles.maxWidthContainer}>
<Stack gap={2}>
{dataQueries.map(({ model, relativeTimeRange, refId, datasourceUid }, index) => {
const dataSource = dsByUid[datasourceUid];
return (
<QueryPreview
key={index}
refId={refId}
isAlertCondition={condition === refId}
model={model}
relativeTimeRange={relativeTimeRange}
evalTimeRange={evalTimeRanges[refId]}
dataSource={dataSource}
queryData={evalDataByQuery[refId]}
onEvalTimeRangeChange={(timeRange) => onTimeRangeChange(refId, timeRange)}
/>
);
})}
</Stack>
<Stack gap={1}>
{expressions.map(({ model, relativeTimeRange, refId, datasourceUid }, index) => {
const dataSource = dsByUid[datasourceUid];
return (
isExpressionQuery(model) && (
<ExpressionPreview
return (
<QueryPreview
key={index}
refId={refId}
isAlertCondition={condition === refId}
model={model}
relativeTimeRange={relativeTimeRange}
evalTimeRange={evalTimeRanges[refId]}
dataSource={dataSource}
evalData={evalDataByQuery[refId]}
queryData={evalDataByQuery[refId]}
onEvalTimeRangeChange={(timeRange) => onTimeRangeChange(refId, timeRange)}
/>
)
);
})}
</Stack>
);
})}
</Stack>
</div>
<div className={styles.maxWidthContainer}>
<Stack gap={1}>
{expressions.map(({ model, refId, datasourceUid }, index) => {
const dataSource = dsByUid[datasourceUid];
return (
isExpressionQuery(model) && (
<ExpressionPreview
key={index}
refId={refId}
isAlertCondition={condition === refId}
model={model}
dataSource={dataSource}
evalData={evalDataByQuery[refId]}
/>
)
);
})}
</Stack>
</div>
</Stack>
);
}
@ -389,6 +393,9 @@ const getExpressionViewerStyles = (theme: GrafanaTheme2) => {
return {
...common,
maxWidthContainer: css`
max-width: 100%;
`,
container: css`
padding: ${theme.spacing(1)};
display: flex;

View File

@ -141,12 +141,19 @@ export function RuleViewerVisualization({
function createExploreLink(settings: DataSourceInstanceSettings, model: AlertDataQuery): string {
const { name } = settings;
const { refId, ...rest } = model;
const queryParams = { ...rest, datasource: name };
/**
In my testing I've found some alerts that don't have a data source embedded inside the model.
At this moment in time it is unclear to me why some alert definitions not have a data source embedded in the model.
Ideally we'd resolve the datasource name to the proper datasource Ref "{ type: string, uid: string }" and pass that in to the model.
I don't think that should happen here, the fact that the datasource ref is sometimes missing here is a symptom of another cause. (Gilles)
*/
return urlUtil.renderUrl(`${config.appSubUrl}/explore`, {
left: JSON.stringify({
datasource: name,
queries: [{ refId: 'A', ...queryParams }],
queries: [{ refId: 'A', ...rest }],
range: { from: 'now-1h', to: 'now' },
}),
});