mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
react-panel: Input validation should be optional
This commit is contained in:
parent
6cbbffffb9
commit
c722ea4f76
@ -1,6 +1,6 @@
|
|||||||
import React, { PureComponent } from 'react';
|
import React, { PureComponent } from 'react';
|
||||||
import { ValidationEvents, ValidationRule } from 'app/types';
|
import { ValidationEvents, ValidationRule } from 'app/types';
|
||||||
import { validate } from 'app/core/utils/validate';
|
import { validate, hasValidationEvent } from 'app/core/utils/validate';
|
||||||
|
|
||||||
export enum InputStatus {
|
export enum InputStatus {
|
||||||
Invalid = 'invalid',
|
Invalid = 'invalid',
|
||||||
@ -21,7 +21,7 @@ export enum EventsWithValidation {
|
|||||||
}
|
}
|
||||||
|
|
||||||
interface Props extends React.HTMLProps<HTMLInputElement> {
|
interface Props extends React.HTMLProps<HTMLInputElement> {
|
||||||
validationEvents: ValidationEvents;
|
validationEvents?: ValidationEvents;
|
||||||
hideErrorMessage?: boolean;
|
hideErrorMessage?: boolean;
|
||||||
|
|
||||||
// Override event props and append status as argument
|
// Override event props and append status as argument
|
||||||
@ -57,15 +57,17 @@ export class Input extends PureComponent<Props> {
|
|||||||
|
|
||||||
populateEventPropsWithStatus = (restProps, validationEvents: ValidationEvents) => {
|
populateEventPropsWithStatus = (restProps, validationEvents: ValidationEvents) => {
|
||||||
const inputElementProps = { ...restProps };
|
const inputElementProps = { ...restProps };
|
||||||
Object.keys(EventsWithValidation).forEach(eventName => {
|
Object.keys(EventsWithValidation).forEach((eventName: EventsWithValidation) => {
|
||||||
|
if (hasValidationEvent(eventName, validationEvents) || restProps[eventName]) {
|
||||||
inputElementProps[eventName] = async evt => {
|
inputElementProps[eventName] = async evt => {
|
||||||
if (validationEvents[eventName]) {
|
if (hasValidationEvent(eventName, validationEvents)) {
|
||||||
await this.validatorAsync(validationEvents[eventName]).apply(this, [evt]);
|
await this.validatorAsync(validationEvents[eventName]).apply(this, [evt]);
|
||||||
}
|
}
|
||||||
if (restProps[eventName]) {
|
if (restProps[eventName]) {
|
||||||
restProps[eventName].apply(null, [evt, this.status]);
|
restProps[eventName].apply(null, [evt, this.status]);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
}
|
||||||
});
|
});
|
||||||
return inputElementProps;
|
return inputElementProps;
|
||||||
};
|
};
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import { ValidationRule } from 'app/types';
|
import { ValidationRule, ValidationEvents } from 'app/types';
|
||||||
|
import { EventsWithValidation } from 'app/core/components/Form/Input';
|
||||||
|
|
||||||
export const validate = (value: string, validationRules: ValidationRule[]) => {
|
export const validate = (value: string, validationRules: ValidationRule[]) => {
|
||||||
const errors = validationRules.reduce((acc, currRule) => {
|
const errors = validationRules.reduce((acc, currRule) => {
|
||||||
@ -9,3 +10,7 @@ export const validate = (value: string, validationRules: ValidationRule[]) => {
|
|||||||
}, []);
|
}, []);
|
||||||
return errors.length > 0 ? errors : null;
|
return errors.length > 0 ? errors : null;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const hasValidationEvent = (event: EventsWithValidation, validationEvents: ValidationEvents) => {
|
||||||
|
return validationEvents && validationEvents[event];
|
||||||
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user