added min-max values check in latency (#158)

* added min-max values check in latency

* error handling antd way

* separated rules validation logic into functions

frontend/src/modules/Traces/LatencyModalForm.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { Modal, Form, InputNumber, Col, Row } from "antd";
-import { Store } from "antd/lib/form/interface";
+import { NamePath, Store } from "antd/lib/form/interface";
 
 interface LatencyModalFormProps {
 	onCreate: (values: Store) => void; //Store is defined in antd forms library
@@ -14,6 +14,25 @@ const LatencyModalForm: React.FC<LatencyModalFormProps> = ({
 	latencyFilterValues,
 }) => {
     const [form] = Form.useForm();
+    
+    const validateMinValue = ({ getFieldValue }: {getFieldValue: (name: NamePath) => any}) => ({
+		validator(_, value: any) {
+		  if (value < getFieldValue('max')) {
+			return Promise.resolve();
+		  }
+		  return Promise.reject(new Error('Min value should be less than Max value'));
+		},
+	  })
+
+    const validateMaxValue = ({ getFieldValue }: {getFieldValue: (name: NamePath) => any}) => ({
+		validator(_, value: any) {
+		  if (value > getFieldValue('min')) {
+			return Promise.resolve();
+		  }
+		  return Promise.reject(new Error('Max value should be greater than Min value'));
+		},
+	  })
+      
 	return (
 		<Modal
 			visible={true}
@@ -45,13 +64,18 @@ const LatencyModalForm: React.FC<LatencyModalFormProps> = ({
 						<Form.Item
 							name="min"
                             				label="Min (in ms)"
+							rules={[validateMinValue]}
 							//   rules={[{ required: true, message: 'Please input the title of collection!' }]}
 						>
 							<InputNumber />
 						</Form.Item>
 					</Col>
 					<Col span={12}>
-						<Form.Item name="max" label="Max (in ms)">
+						<Form.Item 
+							name="max" 
+							label="Max (in ms)"
+							rules = {[validateMaxValue]}
+							>
 							<InputNumber />
 						</Form.Item>
 					</Col>