diff --git a/src/components/VariableEditor/VariableEditor.tsx b/src/components/VariableEditor/VariableEditor.tsx index 23ded2d..7231365 100644 --- a/src/components/VariableEditor/VariableEditor.tsx +++ b/src/components/VariableEditor/VariableEditor.tsx @@ -1,5 +1,5 @@ import React, { useCallback, useRef } from 'react'; -import { AsyncSelect, InlineField } from '@grafana/ui'; +import { AsyncSelect, Field, InlineField, TextArea } from '@grafana/ui'; import { DataQuery } from '@grafana/schema'; import { getBackendSrv } from '@grafana/runtime'; import { @@ -10,8 +10,9 @@ import { QueryEditorProps, SelectableValue, } from '@grafana/data'; -import { Observable } from 'rxjs'; +import { Observable} from 'rxjs'; import invariant from 'tiny-invariant'; +import { createRequestVariables } from 'datasource'; /** * The _Variables_ DataSource is defined separately from the UQL query @@ -25,6 +26,7 @@ import invariant from 'tiny-invariant'; type VariableDataSource = DataSourceApi; interface VariableQuery extends DataQuery { attributeKey: string; + scopeFilterExpression?: string; } export class VariableEditor extends CustomVariableSupport { @@ -38,7 +40,7 @@ export class VariableEditor extends CustomVariableSupport { */ query = (request: DataQueryRequest): Observable => { const { url, projectName } = this; - const { attributeKey } = request.targets[0]; + const { attributeKey, scopeFilterExpression } = request.targets[0]; invariant(typeof attributeKey === 'string', 'Invalid attribute key'); return new Observable((subscriber) => { @@ -50,6 +52,8 @@ export class VariableEditor extends CustomVariableSupport { 'scope-to-attribute-keys': [attributeKey], 'oldest-time': request.range.from, 'youngest-time': request.range.to, + 'template-variables': createRequestVariables(), + 'scope-to-filter-expression': scopeFilterExpression }, }) .then((res: AttributeRes) => { @@ -112,23 +116,41 @@ export class VariableEditor extends CustomVariableSupport { ); return ( -
- - { - if (v.value) { - onChange({ refId: v.value, attributeKey: v.value }); - } - }} - /> - +
+
+ + { + if (v.value) { + onChange({...query, refId: v.value, attributeKey: v.value }); + } + }} + /> + +
+ +
+ +