stackdriver: rename state vars

This commit is contained in:
Erik Sundell 2018-10-31 13:36:41 +01:00
parent 9872ea7d8c
commit e0c0dc1453
3 changed files with 61 additions and 50 deletions

View File

@ -14,7 +14,7 @@ export default class StackdriverMetricFindQuery {
async query(query: any) { async query(query: any) {
try { try {
switch (query.type) { switch (query.selectedQueryType) {
case MetricFindQueryTypes.Services: case MetricFindQueryTypes.Services:
return this.handleServiceQuery(); return this.handleServiceQuery();
case MetricFindQueryTypes.MetricTypes: case MetricFindQueryTypes.MetricTypes:
@ -49,58 +49,58 @@ export default class StackdriverMetricFindQuery {
})); }));
} }
async handleMetricTypesQuery({ service }) { async handleMetricTypesQuery({ selectedService }) {
if (!service) { if (!selectedService) {
return []; return [];
} }
const metricDescriptors = await this.datasource.getMetricTypes(this.datasource.projectName); const metricDescriptors = await this.datasource.getMetricTypes(this.datasource.projectName);
return getMetricTypesByService(metricDescriptors, service).map(s => ({ return getMetricTypesByService(metricDescriptors, selectedService).map(s => ({
text: s.displayName, text: s.displayName,
value: s.name, value: s.name,
expandable: true, expandable: true,
})); }));
} }
async handleLabelQuery({ type, metricType, labelKey }) { async handleLabelQuery({ selectedQueryType, selectedMetricType, labelKey }) {
if (!metricType) { if (!selectedMetricType) {
return []; return [];
} }
const refId = 'handleLabelsQueryType'; const refId = 'handleLabelsQueryType';
const response = await this.datasource.getLabels(metricType, refId); const response = await this.datasource.getLabels(selectedMetricType, refId);
if (!has(response, `meta.${type}.${labelKey}`)) { if (!has(response, `meta.${selectedQueryType}.${labelKey}`)) {
return []; return [];
} }
return response.meta[type][labelKey].map(this.toFindQueryResult); return response.meta[selectedQueryType][labelKey].map(this.toFindQueryResult);
} }
async handleResourceTypeQuery({ metricType }) { async handleResourceTypeQuery({ selectedMetricType }) {
if (!metricType) { if (!selectedMetricType) {
return []; return [];
} }
try { try {
const refId = 'handleResourceTypeQueryQueryType'; const refId = 'handleResourceTypeQueryQueryType';
const response = await this.datasource.getLabels(metricType, refId); const response = await this.datasource.getLabels(selectedMetricType, refId);
return response.meta.resourceTypes.map(this.toFindQueryResult); return response.meta.resourceTypes.map(this.toFindQueryResult);
} catch (error) { } catch (error) {
return []; return [];
} }
} }
async handleAlignersQuery({ metricType }) { async handleAlignersQuery({ selectedMetricType }) {
if (!metricType) { if (!selectedMetricType) {
return []; return [];
} }
const metricDescriptors = await this.datasource.getMetricTypes(this.datasource.projectName); const metricDescriptors = await this.datasource.getMetricTypes(this.datasource.projectName);
const { valueType, metricKind } = metricDescriptors.find(m => m.type === metricType); const { valueType, metricKind } = metricDescriptors.find(m => m.type === selectedMetricType);
return getAlignmentOptionsByMetric(valueType, metricKind).map(this.toFindQueryResult); return getAlignmentOptionsByMetric(valueType, metricKind).map(this.toFindQueryResult);
} }
async handleAggregationQuery({ metricType }) { async handleAggregationQuery({ selectedMetricType }) {
if (!metricType) { if (!selectedMetricType) {
return []; return [];
} }
const metricDescriptors = await this.datasource.getMetricTypes(this.datasource.projectName); const metricDescriptors = await this.datasource.getMetricTypes(this.datasource.projectName);
const { valueType, metricKind } = metricDescriptors.find(m => m.type === metricType); const { valueType, metricKind } = metricDescriptors.find(m => m.type === selectedMetricType);
return getAggregationOptionsByMetric(valueType, metricKind).map(this.toFindQueryResult); return getAggregationOptionsByMetric(valueType, metricKind).map(this.toFindQueryResult);
} }

View File

@ -18,10 +18,10 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
]; ];
defaults = { defaults = {
type: '', selectedQueryType: '',
metricDescriptors: [], metricDescriptors: [],
service: '', selectedService: '',
metricType: '', selectedMetricType: '',
labels: [], labels: [],
labelKey: '', labelKey: '',
metricTypes: [], metricTypes: [],
@ -43,41 +43,50 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
value: m.service, value: m.service,
name: m.serviceShortName, name: m.serviceShortName,
})); }));
const service = services.some(s => s.value === this.state.service) ? this.state.service : services[0].value; const selectedService = services.some(s => s.value === this.state.selectedService)
const { metricTypes, metricType } = getMetricTypes(metricDescriptors, this.state.metricType, service); ? this.state.selectedService
: services[0].value;
const { metricTypes, selectedMetricType } = getMetricTypes(
metricDescriptors,
this.state.selectedMetricType,
selectedService
);
const state: any = { const state: any = {
services, services,
service, selectedService,
metricTypes, metricTypes,
metricType, selectedMetricType,
metricDescriptors, metricDescriptors,
...await this.getLabels(this.state.metricType), ...await this.getLabels(this.state.selectedMetricType),
}; };
this.setState(state); this.setState(state);
} }
async handleQueryTypeChange(event) { async handleQueryTypeChange(event) {
const state: any = { type: event.target.value, ...await this.getLabels(this.state.metricType, event.target.value) }; const state: any = {
selectedQueryType: event.target.value,
...await this.getLabels(this.state.selectedMetricType, event.target.value),
};
this.setState(state); this.setState(state);
} }
async onServiceChange(event) { async onServiceChange(event) {
const { metricTypes, metricType } = getMetricTypes( const { metricTypes, selectedMetricType } = getMetricTypes(
this.state.metricDescriptors, this.state.metricDescriptors,
this.state.metricType, this.state.selectedMetricType,
event.target.value event.target.value
); );
const state: any = { const state: any = {
service: event.target.value, selectedService: event.target.value,
metricTypes, metricTypes,
metricType, selectedMetricType,
...await this.getLabels(metricType), ...await this.getLabels(selectedMetricType),
}; };
this.setState(state); this.setState(state);
} }
async onMetricTypeChange(event) { async onMetricTypeChange(event) {
const state: any = { metricType: event.target.value, ...await this.getLabels(event.target.value) }; const state: any = { selectedMetricType: event.target.value, ...await this.getLabels(event.target.value) };
this.setState(state); this.setState(state);
} }
@ -94,12 +103,12 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
return [MetricFindQueryTypes.MetricLabels, MetricFindQueryTypes.ResourceLabels].indexOf(queryType) !== -1; return [MetricFindQueryTypes.MetricLabels, MetricFindQueryTypes.ResourceLabels].indexOf(queryType) !== -1;
} }
async getLabels(metricType, type = this.state.type) { async getLabels(selectedMetricType, selectedQueryType = this.state.selectedQueryType) {
let result = { labels: this.state.labels, labelKey: this.state.labelKey }; let result = { labels: this.state.labels, labelKey: this.state.labelKey };
if (this.isLabelQuery(type)) { if (this.isLabelQuery(selectedQueryType)) {
const refId = 'StackdriverTemplateQueryComponent'; const refId = 'StackdriverTemplateQueryComponent';
const response = await this.props.datasource.getLabels(metricType, refId); const response = await this.props.datasource.getLabels(selectedMetricType, refId);
const labels = Object.keys(response.meta[type]); const labels = Object.keys(response.meta[selectedQueryType]);
const labelKey = labels.indexOf(this.state.labelKey) !== -1 ? this.state.labelKey : labels[0]; const labelKey = labels.indexOf(this.state.labelKey) !== -1 ? this.state.labelKey : labels[0];
result = { labels, labelKey }; result = { labels, labelKey };
} }
@ -111,7 +120,7 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
case MetricFindQueryTypes.MetricTypes: case MetricFindQueryTypes.MetricTypes:
return ( return (
<SimpleDropdown <SimpleDropdown
value={this.state.service} value={this.state.selectedService}
options={this.state.services} options={this.state.services}
onValueChange={this.onServiceChange} onValueChange={this.onServiceChange}
label="Services" label="Services"
@ -123,13 +132,13 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
return ( return (
<React.Fragment> <React.Fragment>
<SimpleDropdown <SimpleDropdown
value={this.state.service} value={this.state.selectedService}
options={this.state.services} options={this.state.services}
onValueChange={this.onServiceChange} onValueChange={this.onServiceChange}
label="Services" label="Services"
/> />
<SimpleDropdown <SimpleDropdown
value={this.state.metricType} value={this.state.selectedMetricType}
options={this.state.metricTypes} options={this.state.metricTypes}
onValueChange={this.onMetricTypeChange} onValueChange={this.onMetricTypeChange}
label="Metric Types" label="Metric Types"
@ -139,7 +148,9 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
options={this.state.labels.map(l => ({ value: l, name: l }))} options={this.state.labels.map(l => ({ value: l, name: l }))}
onValueChange={this.onLabelKeyChange} onValueChange={this.onLabelKeyChange}
label={ label={
this.state.type === MetricFindQueryTypes.ResourceLabels ? 'Resource Label Key' : 'Metric Label Key' this.state.selectedQueryType === MetricFindQueryTypes.ResourceLabels
? 'Resource Label Key'
: 'Metric Label Key'
} }
/> />
</React.Fragment> </React.Fragment>
@ -149,13 +160,13 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
return ( return (
<React.Fragment> <React.Fragment>
<SimpleDropdown <SimpleDropdown
value={this.state.service} value={this.state.selectedService}
options={this.state.services} options={this.state.services}
onValueChange={this.onServiceChange} onValueChange={this.onServiceChange}
label="Services" label="Services"
/> />
<SimpleDropdown <SimpleDropdown
value={this.state.metricType} value={this.state.selectedMetricType}
options={this.state.metricTypes} options={this.state.metricTypes}
onValueChange={this.onMetricTypeChange} onValueChange={this.onMetricTypeChange}
label="Metric Types" label="Metric Types"
@ -171,12 +182,12 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
return ( return (
<React.Fragment> <React.Fragment>
<SimpleDropdown <SimpleDropdown
value={this.state.type} value={this.state.selectedQueryType}
options={this.queryTypes} options={this.queryTypes}
onValueChange={this.handleQueryTypeChange} onValueChange={this.handleQueryTypeChange}
label="Query Types" label="Query Types"
/> />
{this.renderQueryTypeSwitch(this.state.type)} {this.renderQueryTypeSwitch(this.state.selectedQueryType)}
</React.Fragment> </React.Fragment>
); );
} }

View File

@ -6,16 +6,16 @@ export const extractServicesFromMetricDescriptors = metricDescriptors => uniqBy(
export const getMetricTypesByService = (metricDescriptors, service) => export const getMetricTypesByService = (metricDescriptors, service) =>
metricDescriptors.filter(m => m.service === service); metricDescriptors.filter(m => m.service === service);
export const getMetricTypes = (metricDescriptors, selectedMetricType, service) => { export const getMetricTypes = (metricDescriptors, metricType, selectedService) => {
const metricTypes = getMetricTypesByService(metricDescriptors, service).map(m => ({ const metricTypes = getMetricTypesByService(metricDescriptors, selectedService).map(m => ({
value: m.type, value: m.type,
name: m.displayName, name: m.displayName,
})); }));
const metricTypeExistInArray = metricTypes.some(m => m.value === selectedMetricType); const metricTypeExistInArray = metricTypes.some(m => m.value === metricType);
const metricType = metricTypeExistInArray ? metricTypeExistInArray.value : metricTypes[0].value; const selectedMetricType = metricTypeExistInArray ? metricTypeExistInArray.value : metricTypes[0].value;
return { return {
metricTypes, metricTypes,
metricType, selectedMetricType,
}; };
}; };