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

Query Library: Use a tooltip to show full query (#90425)

Browse Source 
Use a tooltip to show full query
This commit is contained in:
Piotr Jamróz 2024-07-16 09:58:31 +02:00 committed by GitHub
parent 4c9cb63823
commit 6d9b8225aa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 5 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
public/app/features/explore/QueryLibrary/QueryTemplatesTable/QueryDescriptionCell.tsx
View File

@ -1,7 +1,7 @@
import { cx } from '@emotion/css';
import { CellProps } from 'react-table';
import { Spinner } from '@grafana/ui';
import { Spinner, Tooltip } from '@grafana/ui';
import { useDatasource } from '../utils/useDatasource';
@ -20,6 +20,7 @@ export function QueryDescriptionCell(props: CellProps<QueryTemplateRow>) {
return <div>No queries</div>;
}
const query = props.row.original.query;
const queryDisplayText = datasourceApi?.getQueryDisplayText?.(query) || '';
const description = props.row.original.description;
const dsName = datasourceApi?.name || '';
@ -33,7 +34,9 @@ export function QueryDescriptionCell(props: CellProps<QueryTemplateRow>) {
/>
{dsName}
</p>
<p className={cx(styles.mainText, styles.singleLine)}>{datasourceApi?.getQueryDisplayText?.(query)}</p>
<Tooltip content={queryDisplayText} placement="bottom-start">
<p className={cx(styles.mainText, styles.singleLine)}>{queryDisplayText}</p>
</Tooltip>
<p className={cx(styles.otherText, styles.singleLine)}>{description}</p>
</div>
);