diff --git a/packages/grafana-ui/src/components/OptionsUI/links.tsx b/packages/grafana-ui/src/components/OptionsUI/links.tsx index 09d5e23e59d..768f14ff556 100644 --- a/packages/grafana-ui/src/components/OptionsUI/links.tsx +++ b/packages/grafana-ui/src/components/OptionsUI/links.tsx @@ -1,5 +1,10 @@ import React from 'react'; -import { FieldConfigEditorProps, DataLink, DataLinksFieldConfigSettings } from '@grafana/data'; +import { + DataLink, + DataLinksFieldConfigSettings, + FieldConfigEditorProps, + VariableSuggestionsScope, +} from '@grafana/data'; import { DataLinksInlineEditor } from '../DataLinks/DataLinksInlineEditor/DataLinksInlineEditor'; export const DataLinksValueEditor: React.FC> = ({ @@ -12,7 +17,7 @@ export const DataLinksValueEditor: React.FC ); }; diff --git a/packages/grafana-ui/src/components/Table/DefaultCell.tsx b/packages/grafana-ui/src/components/Table/DefaultCell.tsx index 3d174444da0..960af415d02 100644 --- a/packages/grafana-ui/src/components/Table/DefaultCell.tsx +++ b/packages/grafana-ui/src/components/Table/DefaultCell.tsx @@ -1,14 +1,35 @@ import React, { FC } from 'react'; import { TableCellProps } from './types'; -import { formattedValueToString } from '@grafana/data'; +import { formattedValueToString, LinkModel } from '@grafana/data'; export const DefaultCell: FC = props => { - const { field, cell, tableStyles } = props; + const { field, cell, tableStyles, row } = props; + let link: LinkModel | undefined; if (!field.display) { return null; } const displayValue = field.display(cell.value); - return
{formattedValueToString(displayValue)}
; + + if (field.getDataLinksSupplier) { + link = field + .getDataLinksSupplier({ + valueRowIndex: row.index, + }) + .getLinks()[0]; + } + const value = formattedValueToString(displayValue); + + return ( +
+ {link ? ( + + {value} + + ) : ( + value + )} +
+ ); }; diff --git a/public/app/plugins/panel/bargauge/BarGaugePanel.tsx b/public/app/plugins/panel/bargauge/BarGaugePanel.tsx index bcc90b5f771..e0bc15e2607 100644 --- a/public/app/plugins/panel/bargauge/BarGaugePanel.tsx +++ b/public/app/plugins/panel/bargauge/BarGaugePanel.tsx @@ -13,7 +13,6 @@ import { getDisplayValueAlignmentFactors, DisplayValueAlignmentFactors, } from '@grafana/data'; -import { getFieldLinksSupplier } from 'app/features/panel/panellinks/linkSuppliers'; export class BarGaugePanel extends PureComponent> { renderValue = (valueProps: VizRepeaterRenderValueProps): JSX.Element => { @@ -21,8 +20,19 @@ export class BarGaugePanel extends PureComponent> { const { value, alignmentFactors, orientation, width, height } = valueProps; const { field, display, view, colIndex } = value; + const linksSupplier = value.view.dataFrame.fields[value.colIndex].getDataLinksSupplier; + return ( - + {({ openMenu, targetClassName }) => { return ( > { renderValue = (valueProps: VizRepeaterRenderValueProps): JSX.Element => { @@ -18,8 +17,18 @@ export class GaugePanel extends PureComponent> { const { value, width, height } = valueProps; const { field, display } = value; + const linksSupplier = value.view.dataFrame.fields[value.colIndex].getDataLinksSupplier; return ( - + {({ openMenu, targetClassName }) => { return ( > { renderValue = (valueProps: VizRepeaterRenderValueProps): JSX.Element => { const { timeRange, options } = this.props; @@ -46,9 +44,19 @@ export class StatPanel extends PureComponent> { sparkline.highlightIndex = sparkline.data.length - 1; } } + const linksSupplier = value.view.dataFrame.fields[value.colIndex].getDataLinksSupplier; return ( - + {({ openMenu, targetClassName }) => { return (