From c722ea4f768220969867d979d6bf3feb8ea37a63 Mon Sep 17 00:00:00 2001
From: Johannes Schill <johannes.schill@polyester.se>
Date: Fri, 30 Nov 2018 11:04:56 +0100
Subject: [PATCH] react-panel: Input validation should be optional

---
 public/app/core/components/Form/Input.tsx | 24 ++++++++++++-----------
 public/app/core/utils/validate.ts         |  7 ++++++-
 2 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/public/app/core/components/Form/Input.tsx b/public/app/core/components/Form/Input.tsx
index 315acbd645c..e815336edbe 100644
--- a/public/app/core/components/Form/Input.tsx
+++ b/public/app/core/components/Form/Input.tsx
@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react';
 import { ValidationEvents, ValidationRule } from 'app/types';
-import { validate } from 'app/core/utils/validate';
+import { validate, hasValidationEvent } from 'app/core/utils/validate';
 
 export enum InputStatus {
   Invalid = 'invalid',
@@ -21,7 +21,7 @@ export enum EventsWithValidation {
 }
 
 interface Props extends React.HTMLProps<HTMLInputElement> {
-  validationEvents: ValidationEvents;
+  validationEvents?: ValidationEvents;
   hideErrorMessage?: boolean;
 
   // Override event props and append status as argument
@@ -57,15 +57,17 @@ export class Input extends PureComponent<Props> {
 
   populateEventPropsWithStatus = (restProps, validationEvents: ValidationEvents) => {
     const inputElementProps = { ...restProps };
-    Object.keys(EventsWithValidation).forEach(eventName => {
-      inputElementProps[eventName] = async evt => {
-        if (validationEvents[eventName]) {
-          await this.validatorAsync(validationEvents[eventName]).apply(this, [evt]);
-        }
-        if (restProps[eventName]) {
-          restProps[eventName].apply(null, [evt, this.status]);
-        }
-      };
+    Object.keys(EventsWithValidation).forEach((eventName: EventsWithValidation) => {
+      if (hasValidationEvent(eventName, validationEvents) || restProps[eventName]) {
+        inputElementProps[eventName] = async evt => {
+          if (hasValidationEvent(eventName, validationEvents)) {
+            await this.validatorAsync(validationEvents[eventName]).apply(this, [evt]);
+          }
+          if (restProps[eventName]) {
+            restProps[eventName].apply(null, [evt, this.status]);
+          }
+        };
+      }
     });
     return inputElementProps;
   };
diff --git a/public/app/core/utils/validate.ts b/public/app/core/utils/validate.ts
index 34f8125833f..c6663882808 100644
--- a/public/app/core/utils/validate.ts
+++ b/public/app/core/utils/validate.ts
@@ -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[]) => {
   const errors = validationRules.reduce((acc, currRule) => {
@@ -9,3 +10,7 @@ export const validate = (value: string, validationRules: ValidationRule[]) => {
   }, []);
   return errors.length > 0 ? errors : null;
 };
+
+export const hasValidationEvent = (event: EventsWithValidation, validationEvents: ValidationEvents) => {
+  return validationEvents && validationEvents[event];
+};