IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Alerting: Hide query name when using simplified mode in the alert rule (#93779)

Browse Source 
* Hide query name when using simplified mode in the alert rule

* rename hideName to hideRefId
This commit is contained in:
Sonia Aguilar 2024-10-02 13:55:48 +02:00 committed by GitHub
parent dae492f6c8
commit e80ef522bb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx
View File

@ -180,6 +180,7 @@ export const QueryWrapper = ({
<div className={styles.wrapper}>
<QueryEditorRow<AlertDataQuery>
alerting
hideRefId={!isAdvancedMode}
hideActionButtons={!isAdvancedMode}
collapsable={false}
dataSource={dsSettings}

5
public/app/features/query/components/QueryEditorRow.tsx
View File

@ -69,6 +69,7 @@ export interface Props<TQuery extends DataQuery> {
onQueryRemoved?: () => void;
onQueryToggled?: (queryStatus?: boolean | undefined) => void;
collapsable?: boolean;
hideRefId?: boolean;
}
interface State<TQuery extends DataQuery> {
@ -509,7 +510,8 @@ export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Prop
};
renderHeader = (props: QueryOperationRowRenderProps) => {
const { alerting, query, dataSource, onChangeDataSource, onChange, queries, renderHeaderExtras } = this.props;
const { alerting, query, dataSource, onChangeDataSource, onChange, queries, renderHeaderExtras, hideRefId } =
this.props;
return (
<QueryEditorRowHeader
@ -523,6 +525,7 @@ export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Prop
collapsedText={!props.isOpen ? this.renderCollapsedText() : null}
renderExtras={renderHeaderExtras}
alerting={alerting}
hideRefId={hideRefId}
/>
);
};

11
public/app/features/query/components/QueryEditorRowHeader.tsx
View File

@ -1,10 +1,10 @@
import { css, cx } from '@emotion/css';
import { ReactNode, useState } from 'react';
import * as React from 'react';
import { ReactNode, useState } from 'react';
import { DataQuery, DataSourceInstanceSettings, GrafanaTheme2 } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { Icon, Input, FieldValidationMessage, useStyles2 } from '@grafana/ui';
import { FieldValidationMessage, Icon, Input, useStyles2 } from '@grafana/ui';
import { DataSourcePicker } from 'app/features/datasources/components/picker/DataSourcePicker';
export interface Props<TQuery extends DataQuery = DataQuery> {
@ -18,10 +18,11 @@ export interface Props<TQuery extends DataQuery = DataQuery> {
onClick: (e: React.MouseEvent) => void;
collapsedText: string | null;
alerting?: boolean;
hideRefId?: boolean;
}
export const QueryEditorRowHeader = <TQuery extends DataQuery>(props: Props<TQuery>) => {
const { query, queries, onChange, collapsedText, renderExtras, hidden } = props;
const { query, queries, onChange, collapsedText, renderExtras, hidden, hideRefId = false } = props;
const styles = useStyles2(getStyles);
const [isEditing, setIsEditing] = useState<boolean>(false);
@ -85,7 +86,7 @@ export const QueryEditorRowHeader = <TQuery extends DataQuery>(props: Props<TQue
return (
<>
<div className={styles.wrapper}>
{!isEditing && (
{!hideRefId && !isEditing && (
<button
className={styles.queryNameWrapper}
aria-label={selectors.components.QueryEditorRow.title(query.refId)}
@ -99,7 +100,7 @@ export const QueryEditorRowHeader = <TQuery extends DataQuery>(props: Props<TQue
</button>
)}
{isEditing && (
{!hideRefId && isEditing && (
<>
<Input
type="text"