diff --git a/public/app/plugins/datasource/stackdriver/components/AlignmentPeriods.tsx b/public/app/plugins/datasource/stackdriver/components/AlignmentPeriods.tsx index ef5ed910862..e5ac77ed6fb 100644 --- a/public/app/plugins/datasource/stackdriver/components/AlignmentPeriods.tsx +++ b/public/app/plugins/datasource/stackdriver/components/AlignmentPeriods.tsx @@ -1,16 +1,28 @@ import React, { SFC } from 'react'; import _ from 'lodash'; +import kbn from 'app/core/utils/kbn'; import { MetricSelect } from 'app/core/components/Select/MetricSelect'; -import { alignmentPeriods } from '../constants'; +import { alignmentPeriods, alignOptions } from '../constants'; export interface Props { onChange: (alignmentPeriod) => void; templateSrv: any; alignmentPeriod: string; + perSeriesAligner: string; + usedAlignmentPeriod: string; } -export const AlignmentPeriods: SFC = ({ alignmentPeriod, templateSrv, onChange }) => { +export const AlignmentPeriods: SFC = ({ + alignmentPeriod, + templateSrv, + onChange, + perSeriesAligner, + usedAlignmentPeriod, +}) => { + const alignment = alignOptions.find(ap => ap.value === templateSrv.replace(perSeriesAligner)); + const formatAlignmentText = `${kbn.secondsToHms(usedAlignmentPeriod)} interval (${alignment ? alignment.text : ''})`; + return ( <>
@@ -35,7 +47,7 @@ export const AlignmentPeriods: SFC = ({ alignmentPeriod, templateSrv, onC />
-
+ {usedAlignmentPeriod && }
diff --git a/public/app/plugins/datasource/stackdriver/components/QueryEditor.tsx b/public/app/plugins/datasource/stackdriver/components/QueryEditor.tsx index 6710fd6146c..3175a840d70 100644 --- a/public/app/plugins/datasource/stackdriver/components/QueryEditor.tsx +++ b/public/app/plugins/datasource/stackdriver/components/QueryEditor.tsx @@ -46,6 +46,7 @@ export const DefaultTarget: State = { alignOptions: [], lastQuery: '', lastQueryError: '', + usedAlignmentPeriod: '', }; export class QueryEditor extends React.Component { @@ -71,7 +72,11 @@ export class QueryEditor extends React.Component { onDataReceived(dataList) { const series = dataList.find(item => item.refId === this.props.target.refId); if (series) { - this.setState({ lastQuery: decodeURIComponent(series.meta.rawQuery), lastQueryError: '' }); + this.setState({ + lastQuery: decodeURIComponent(series.meta.rawQuery), + lastQueryError: '', + usedAlignmentPeriod: series.meta.alignmentPeriod, + }); } } @@ -125,6 +130,7 @@ export class QueryEditor extends React.Component { render() { const { + usedAlignmentPeriod, defaultProject, metricType, crossSeriesReducer, @@ -180,12 +186,14 @@ export class QueryEditor extends React.Component { ) } - this.onPropertyChange('aliasBy', value)} /> this.onPropertyChange('alignmentPeriod', value)} /> + this.onPropertyChange('aliasBy', value)} /> )} diff --git a/public/app/plugins/datasource/stackdriver/components/__snapshots__/QueryEditor.test.tsx.snap b/public/app/plugins/datasource/stackdriver/components/__snapshots__/QueryEditor.test.tsx.snap index a3a723e8bed..c93b062c31e 100644 --- a/public/app/plugins/datasource/stackdriver/components/__snapshots__/QueryEditor.test.tsx.snap +++ b/public/app/plugins/datasource/stackdriver/components/__snapshots__/QueryEditor.test.tsx.snap @@ -282,32 +282,6 @@ Array [ , -
-
- - -
-
-
-
-
,
@@ -407,6 +381,30 @@ Array [
+
+ +
+ , +
+
+ + +