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
This commit is contained in:
Sai Deepesh 2021-06-12 10:30:10 +05:30 committed by GitHub
parent a118c3c8a1
commit 72f5688194
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -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
@ -13,13 +13,32 @@ const LatencyModalForm: React.FC<LatencyModalFormProps> = ({
onCancel,
latencyFilterValues,
}) => {
const [form] = Form.useForm();
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}
title="Chose min and max values of Latency"
okText="Apply"
cancelText="Cancel"
cancelText="Cancel"
onCancel={onCancel}
onOk={() => {
form
@ -31,7 +50,7 @@ const LatencyModalForm: React.FC<LatencyModalFormProps> = ({
.catch((info) => {
console.log("Validate Failed:", info);
});
}}
}}
>
<Form
form={form}
@ -44,14 +63,19 @@ const LatencyModalForm: React.FC<LatencyModalFormProps> = ({
<Col span={12}>
<Form.Item
name="min"
label="Min (in ms)"
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>