diff --git a/.betterer.results b/.betterer.results index 00955bb243f..b8241585e54 100644 --- a/.betterer.results +++ b/.betterer.results @@ -6306,6 +6306,7 @@ exports[`no gf-form usage`] = { [0, 0, 0, "gf-form usage has been deprecated. Use a component from @grafana/ui or custom CSS instead.", "5381"] ], "public/app/plugins/datasource/loki/configuration/DerivedField.tsx:5381": [ + [0, 0, 0, "gf-form usage has been deprecated. Use a component from @grafana/ui or custom CSS instead.", "5381"], [0, 0, 0, "gf-form usage has been deprecated. Use a component from @grafana/ui or custom CSS instead.", "5381"], [0, 0, 0, "gf-form usage has been deprecated. Use a component from @grafana/ui or custom CSS instead.", "5381"], [0, 0, 0, "gf-form usage has been deprecated. Use a component from @grafana/ui or custom CSS instead.", "5381"] diff --git a/docs/sources/datasources/loki/configure-loki-data-source.md b/docs/sources/datasources/loki/configure-loki-data-source.md index 5bd23377868..b667c8e1bf8 100644 --- a/docs/sources/datasources/loki/configure-loki-data-source.md +++ b/docs/sources/datasources/loki/configure-loki-data-source.md @@ -124,6 +124,8 @@ Each derived field consists of the following: - **Internal link** - Toggle on to define an internal link. For internal links, you can select the target data source from a selector. This supports only tracing data sources. +- **Open in new tab** - Toggle on to open the link in a new tab or window. + - **Show example log message** - Click to paste an example log line to test the regular expression of your derived fields. Click **Save & test** to test your connection. diff --git a/public/app/plugins/datasource/loki/configuration/DerivedField.tsx b/public/app/plugins/datasource/loki/configuration/DerivedField.tsx index 800dd4541c0..55258531ca7 100644 --- a/public/app/plugins/datasource/loki/configuration/DerivedField.tsx +++ b/public/app/plugins/datasource/loki/configuration/DerivedField.tsx @@ -34,6 +34,9 @@ const getStyles = (theme: GrafanaTheme2) => ({ internalLink: css({ marginRight: theme.spacing(1), }), + openNewTab: css({ + marginRight: theme.spacing(1), + }), dataSource: css({}), nameMatcherField: css({ width: theme.spacing(20), @@ -53,6 +56,7 @@ export const DerivedField = (props: Props) => { const { value, onChange, onDelete, suggestions, className, validateName } = props; const styles = useStyles2(getStyles); const [showInternalLink, setShowInternalLink] = useState(!!value.datasourceUid); + const [openInNewTab, setOpenInNewTab] = useState(!!value.targetBlank); const previousUid = usePrevious(value.datasourceUid); const [fieldType, setFieldType] = useState(value.matcherType ?? 'regex'); @@ -198,6 +202,22 @@ export const DerivedField = (props: Props) => { )} + +
+ + ) => { + const { checked } = e.currentTarget; + onChange({ + ...value, + targetBlank: checked, + }); + setOpenInNewTab(checked); + }} + /> + +
); }; diff --git a/public/app/plugins/datasource/loki/getDerivedFields.test.ts b/public/app/plugins/datasource/loki/getDerivedFields.test.ts index 41004b16c1f..674d95cea91 100644 --- a/public/app/plugins/datasource/loki/getDerivedFields.test.ts +++ b/public/app/plugins/datasource/loki/getDerivedFields.test.ts @@ -122,6 +122,7 @@ describe('getDerivedFields', () => { matcherType: 'regex', name: 'trace1', url: 'http://localhost/${__value.raw}', + targetBlank: true, }, { matcherRegex: 'trace3', @@ -141,6 +142,7 @@ describe('getDerivedFields', () => { expect(trace1!.config.links![0]).toEqual({ url: 'http://localhost/${__value.raw}', title: '', + targetBlank: true, }); const trace3 = newFields.find((f) => f.name === 'trace3Name'); diff --git a/public/app/plugins/datasource/loki/getDerivedFields.ts b/public/app/plugins/datasource/loki/getDerivedFields.ts index 75b9b6f7de7..e28c697adfc 100644 --- a/public/app/plugins/datasource/loki/getDerivedFields.ts +++ b/public/app/plugins/datasource/loki/getDerivedFields.ts @@ -95,6 +95,7 @@ function fieldFromDerivedFieldConfig(derivedFieldConfigs: DerivedFieldConfig[]): datasourceUid: derivedFieldConfig.datasourceUid, datasourceName: dsSettings?.name ?? 'Data source not found', }, + targetBlank: derivedFieldConfig.targetBlank, }); } else if (derivedFieldConfig.url) { acc.push({ @@ -102,6 +103,7 @@ function fieldFromDerivedFieldConfig(derivedFieldConfigs: DerivedFieldConfig[]): title: derivedFieldConfig.urlDisplayLabel || '', // This is hardcoded for Jaeger or Zipkin not way right now to specify datasource specific query object url: derivedFieldConfig.url, + targetBlank: derivedFieldConfig.targetBlank, }); } return acc; diff --git a/public/app/plugins/datasource/loki/types.ts b/public/app/plugins/datasource/loki/types.ts index 806e7e81434..a0622c27184 100644 --- a/public/app/plugins/datasource/loki/types.ts +++ b/public/app/plugins/datasource/loki/types.ts @@ -66,6 +66,7 @@ export type DerivedFieldConfig = { urlDisplayLabel?: string; datasourceUid?: string; matcherType?: 'label' | 'regex'; + targetBlank?: boolean; }; export enum LokiVariableQueryType {