Filtering out incompatible dashboard params (#3330)

This commit is contained in:
Ran Byron
2019-01-23 16:27:49 +02:00
committed by GitHub
parent 87667676e6
commit d5afa1815e
3 changed files with 28 additions and 19 deletions

View File

@@ -223,7 +223,10 @@ export class ParameterMappingInput extends React.Component {
export class ParameterMappingListInput extends React.Component {
static propTypes = {
mappings: PropTypes.arrayOf(PropTypes.object),
existingParamNames: PropTypes.arrayOf(PropTypes.string),
existingParams: PropTypes.arrayOf(PropTypes.shape({
name: PropTypes.string,
type: PropTypes.string,
})),
onChange: PropTypes.func,
clientConfig: PropTypes.any, // eslint-disable-line react/forbid-prop-types
Query: PropTypes.any, // eslint-disable-line react/forbid-prop-types
@@ -231,7 +234,7 @@ export class ParameterMappingListInput extends React.Component {
static defaultProps = {
mappings: [],
existingParamNames: [],
existingParams: [],
onChange: () => {},
clientConfig: null,
Query: null,
@@ -255,17 +258,23 @@ export class ParameterMappingListInput extends React.Component {
return (
<div>
{this.props.mappings.map((mapping, index) => (
<div key={mapping.name} className={(index === 0 ? '' : ' m-t-15')}>
<ParameterMappingInput
mapping={mapping}
existingParamNames={this.props.existingParamNames}
onChange={newMapping => this.updateParamMapping(mapping, newMapping)}
clientConfig={clientConfig}
Query={Query}
/>
</div>
))}
{this.props.mappings.map((mapping, index) => {
const existingParamsNames = this.props.existingParams
.filter(({ type }) => type === mapping.param.type) // exclude mismatching param types
.map(({ name }) => name); // keep names only
return (
<div key={mapping.name} className={(index === 0 ? '' : ' m-t-15')}>
<ParameterMappingInput
mapping={mapping}
existingParamNames={existingParamsNames}
onChange={newMapping => this.updateParamMapping(mapping, newMapping)}
clientConfig={clientConfig}
Query={Query}
/>
</div>
);
})}
</div>
);
}

View File

@@ -281,9 +281,9 @@ class AddWidgetDialog extends React.Component {
const clientConfig = this.props.clientConfig; // eslint-disable-line react/prop-types
const Query = this.props.Query; // eslint-disable-line react/prop-types
const existingParamNames = map(
const existingParams = map(
this.props.dashboard.getParametersDefs(),
param => param.name,
({ name, type }) => ({ name, type }),
);
return (
@@ -311,7 +311,7 @@ class AddWidgetDialog extends React.Component {
<ParameterMappingListInput
key="parameters-list"
mappings={this.state.parameterMappings}
existingParamNames={existingParamNames}
existingParams={existingParams}
onChange={mappings => this.updateParamMappings(mappings)}
clientConfig={clientConfig}
Query={Query}

View File

@@ -63,9 +63,9 @@ class EditParameterMappingsDialog extends React.Component {
const clientConfig = this.props.clientConfig; // eslint-disable-line react/prop-types
const Query = this.props.Query; // eslint-disable-line react/prop-types
const existingParamNames = map(
const existingParams = map(
this.props.dashboard.getParametersDefs(),
param => param.name,
({ name, type }) => ({ name, type }),
);
return (
@@ -87,7 +87,7 @@ class EditParameterMappingsDialog extends React.Component {
(this.state.parameterMappings.length > 0) &&
<ParameterMappingListInput
mappings={this.state.parameterMappings}
existingParamNames={existingParamNames}
existingParams={existingParams}
onChange={mappings => this.updateParamMappings(mappings)}
clientConfig={clientConfig}
Query={Query}