with date post call done

Author: vigneshwaran-chandrasekaran

package.json

@@ -15,6 +15,7 @@
     "formik-antd": "^2.0.1",
     "js-sha512": "^0.8.0",
     "lodash": "^4.17.15",
+    "moment": "^2.26.0",
     "node-sass": "^4.14.1",
     "prop-types": "^15.7.2",
     "qs": "^6.9.4",
@@ -57,4 +58,4 @@
   "devDependencies": {
     "env-cmd": "^10.1.0"
   }
-}
+}

src/forms/todo/todo.form.js

@@ -1,10 +1,12 @@
 import React, { useState, useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { message, Col, Row, Select } from 'antd';
-import { Form, Input } from 'formik-antd';
+import { Form, Input, DatePicker } from 'formik-antd';
 import { Formik } from 'formik';
 import * as Yup from 'yup';
 import PropTypes from 'prop-types';
+import moment from 'moment';
+
 import { API } from '../../services';
 import { FormActionButtons } from '../FormActionButtons';
 import { TODO_LABEL } from '../../helpers/';
@@ -14,18 +16,19 @@ const { Option } = Select;
 const TodoSchema = Yup.object({
 	title: Yup.string().required('Title required'),
 	description: Yup.string().required('Description required'),
-	// dueDate: Yup.number().required('Duedate code required'),
+	dueDate: Yup.string().required('Duedate required'),
 	label: Yup.number().required('Label code required'),
 });
 
 function TodoForm({ onClose, editMode, editableTodo }) {
 	const dispatch = useDispatch();
+	const [dueDate, setDueDate] = useState();
 
 	const initialValues = {
 		title: editMode ? editableTodo.title : undefined,
 		description: editMode ? editableTodo.description : undefined,
-		dueDate: editMode ? editableTodo.phone : undefined,
-		label: editMode ? editableTodo.label : undefined,
+		dueDate: editMode ? editableTodo.phone : moment(),
+		label: editMode ? editableTodo.label : 3,
 	};
 
 	function handleSubmit(values, { setErrors, resetForm, setSubmitting }) {
@@ -48,7 +51,12 @@ function TodoForm({ onClose, editMode, editableTodo }) {
 		const CREDENTIALS = {
 			url,
 			method: editMode ? 'put' : 'post',
-			data: values,
+			data: {
+				...values,
+				dueDate: moment(values.dueDate, 'DD-MM-YYYY').format(
+					'YYYY-MM-DD'
+				),
+			},
 			setErrors,
 		};
 
@@ -102,6 +110,33 @@ function TodoForm({ onClose, editMode, editableTodo }) {
 							</Form.Item>
 						</Col>
 					</Row>
+					<Row>
+						<Col span={24}>
+							{/* <label className="ant-form-item-label">
+								Duedate
+							</label> */}
+							<Form.Item
+								name="dueDate"
+								label="Duedate"
+								hasFeedback={true}
+								showValidateSuccess={true}
+							>
+								<DatePicker
+									value={dueDate}
+									name="dueDate"
+									onChange={(date, dateString) => {
+										setDueDate(date);
+										setFieldValue('dueDate', dateString);
+									}}
+									format="DD-MM-YYYY"
+									disabledDate={(current) => {
+										return current && current < moment();
+									}}
+									style={{ width: '100%' }}
+								/>
+							</Form.Item>
+						</Col>
+					</Row>
 					<Row gutter={8}>
 						<Col span={24}>
 							<Form.Item