From 7aea3080b69bfdacb24ee20c13ad3790b3c91ea1 Mon Sep 17 00:00:00 2001 From: pepper Date: Tue, 19 Jan 2021 01:24:51 -0500 Subject: [PATCH] Cam did stuff --- .../root/common/Forms/CPanelBooking.js | 75 +++++------- .../common/Forms/FormikFieldDateTimePicker.js | 113 ------------------ 2 files changed, 31 insertions(+), 157 deletions(-) delete mode 100644 src/components/root/common/Forms/FormikFieldDateTimePicker.js diff --git a/src/components/root/common/Forms/CPanelBooking.js b/src/components/root/common/Forms/CPanelBooking.js index fe0ff38..bf6f56d 100644 --- a/src/components/root/common/Forms/CPanelBooking.js +++ b/src/components/root/common/Forms/CPanelBooking.js @@ -7,8 +7,7 @@ import * as Yup from "yup"; import { Input, Submit } from "formstrap"; import { callAPI } from "../../../actions/API"; import Msgbox from "../../../actions/Msgbox"; -import { buildErrorStringFromArray } from "../../../actions/Error"; -// import FormikFieldDateTimePicker from "./FormikFieldDateTimePicker"; +import { builfArrayFromObject } from "../../../actions/Error"; // Main form and POST Request to add migrations // found at /book under the web hosting migration tab @@ -25,39 +24,39 @@ const timezoneList = { }; const timezone = timezoneList.melbourne; - - const InputValidation = Yup.object().shape({ domain: Yup.string() .matches( - /^((https?):\/\/)?(www.)?[a-z0-9]+(\.[a-z]{2,}){1,3}(#?\/?[a-zA-Z0-9#]+)*\/?(\?[a-zA-Z0-9-_]+=[a-zA-Z0-9-%]+&?)?$/, + /^((https?):\/\/)?(www.)?[a-z0-9]+(\.[a-z]{2,}){1,3}(#?\/?[a-zA-Z0-9#]+)*\/?(\?[a-zA-Z0-9-_]+=[a-zA-Z0-9-%]+&?)?$/i, "Enter correct url!" ) .required("Please enter a domain"), username: Yup.string().min(2, "Too Short!").required("Required"), original_server: Yup.string() .matches( - /^((([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d)\.){3}([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d))|(((https?):\/\/)?(www.)?[a-z0-9]+(\.[a-z]{2,}){1,3}(#?\/?[a-zA-Z0-9#]+)*\/?(\?[a-zA-Z0-9-_]+=[a-zA-Z0-9-%]+&?)?)$/, + /^((([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d)\.){3}([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d))|(((https?):\/\/)?(www.)?[a-z0-9]+(\.[a-z]{2,}){1,3}(#?\/?[a-zA-Z0-9#]+)*\/?(\?[a-zA-Z0-9-_]+=[a-zA-Z0-9-%]+&?)?)|([a-z0-9]{0,4}-[a-z0-9]{0,2}-[a-z0-9]{0,3})$/i, "Please enter a valid IPv4 Address or domain" ) .required("Please enter a valid IPv4 or domain"), new_server: Yup.string() .matches( - /^((([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d)\.){3}([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d))|(((https?):\/\/)?(www.)?[a-z0-9]+(\.[a-z]{2,}){1,3}(#?\/?[a-zA-Z0-9#]+)*\/?(\?[a-zA-Z0-9-_]+=[a-zA-Z0-9-%]+&?)?)$/, + /^((([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d)\.){3}([1-9]?\d|1\d\d|2[0-5][0-5]|2[0-4]\d))|(((https?):\/\/)?(www.)?[a-z0-9]+(\.[a-z]{2,}){1,3}(#?\/?[a-zA-Z0-9#]+)*\/?(\?[a-zA-Z0-9-_]+=[a-zA-Z0-9-%]+&?)?)|([a-z0-9]{0,4}-[a-z0-9]{0,2}-[a-z0-9]{0,3})$/i, "Please enter a valid IPv4 Address or domain" ) .required("Please enter a valid IPv4 or domain"), - agent_booked: Yup.string().min(2, "Too short!").required("Requried"), - booked_time: Yup.string().required("Requried"), - ticket_id: Yup.string().required("Requried"), - brand: Yup.string().required("Requried"), - migration_type: Yup.string().required("Requried"), - booked_date: Yup.date().required("Required") + agent_booked: Yup.string() + .min(2, "Too short!") + .required("Please enter your name!"), + booked_time: Yup.string().required("Time is needed!"), + ticket_id: Yup.string().required("Please add a ticket ID!"), + brand: Yup.string().required("Bush Did 911"), + migration_type: Yup.string().required("Type is required!"), + booked_date: Yup.date().required("Please enter a date!"), }); export const CPanelBooking = () => { - const [respID, setRespID] = useState(0) - const [error, setError] = useState(0) + const [respID, setRespID] = useState(0); + const [error, setError] = useState(0); const initialValues = { submit_time: moment().format("YYYY-MM-DD"), @@ -70,15 +69,15 @@ export const CPanelBooking = () => { .then(function (response) { // console.log(response); // add function here - setRespID(response.data.id) - setError(0) + setRespID(response.data.id); + setError(0); + resetForm({ values: "" }); }) .catch(function (error) { - setError(buildErrorStringFromArray(error.response.data)) - setRespID(0) + setError(builfArrayFromObject(error.response.data)); + setRespID(0); }); setSubmitting(false); - resetForm({ values: "" }); }; return ( { - + { /> - {/* - - */} - + @@ -130,7 +117,7 @@ export const CPanelBooking = () => { - + { - + { - + { - + { - + @@ -189,7 +176,7 @@ export const CPanelBooking = () => { - + { - + @@ -211,7 +198,7 @@ export const CPanelBooking = () => { - + { Submit - { respID ? : null } - { error ? : null } + {respID ? : null} + {error ? : null} )} diff --git a/src/components/root/common/Forms/FormikFieldDateTimePicker.js b/src/components/root/common/Forms/FormikFieldDateTimePicker.js deleted file mode 100644 index af2919b..0000000 --- a/src/components/root/common/Forms/FormikFieldDateTimePicker.js +++ /dev/null @@ -1,113 +0,0 @@ -import React from "react"; -import PropTypes from "prop-types"; -import { zonedTimeToUtc, utcToZonedTime, toDate } from "date-fns-tz"; -import { DateTimePicker, DatePicker, TimePicker } from "@material-ui/pickers"; - -const componentTypes = { - datetime: DateTimePicker, - date: DatePicker, - time: TimePicker, -}; - -const isoDateRegExp = /^(\d{1,})-?(\d{2})?-?(\d{2})T?(\d{2})?:?(\d{2})?:?(\d{2})?\.?(\d{3})?(Z|[+-]\d{2}:\d{2})?/; -const timeRegExp = /^(\d{2}):(\d{2}):?(\d{2})?\.?(\d{3})?/; - -const getDateForPicker = (str, timezone) => { - if (isoDateRegExp.test(str)) { - return timezone ? utcToZonedTime(new Date(str), timezone) : toDate(str); - } else if (timeRegExp.test(str)) { - const date = new Date(); - const utcDateISOString = new Date( - Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()) - ).toISOString(); - return toDate( - utcDateISOString.substring(0, utcDateISOString.indexOf("T") + 1) + str - ); - } - return null; -}; - -const FormikFieldDateTimePicker = ({ - field, - form, - type, - timezone, - returnDateOnly, - ...restProps -}) => { - const CustomTag = componentTypes[type]; - const currentError = form.errors[field.name]; - - const pickerValue = getDateForPicker(field.value, timezone); - - const handleChange = (date) => { - if (date === null) { - form.setFieldValue(field.name, null, true); - return; - } - - let storedValue; - if (timezone) { - storedValue = zonedTimeToUtc(date, timezone).toISOString(); - storedValue = returnDateOnly - ? storedValue.substring(0, storedValue.indexOf("T")) - : storedValue; - } else { - const utcDateIsoString = new Date( - Date.UTC( - date.getFullYear(), - date.getMonth(), - date.getDate(), - date.getHours(), - date.getMinutes(), - date.getSeconds(), - date.getMilliseconds() - ) - ).toISOString(); - - if (isoDateRegExp.test(field.value)) { - storedValue = !returnDateOnly - ? utcDateIsoString.substring(0, utcDateIsoString.indexOf("Z")) - : utcDateIsoString.substring(0, utcDateIsoString.indexOf("T")); - } else { - storedValue = utcDateIsoString.substring( - utcDateIsoString.indexOf("T") + 1, - utcDateIsoString.indexOf("Z") - ); - } - } - form.setFieldValue(field.name, storedValue, true); - }; - - const handleBlur = (e) => { - field.onBlur(e); - }; - - return ( - form.setFieldError(field.name, error)} - onChange={handleChange} - onBlur={handleBlur} - {...restProps} - /> - ); -}; - -FormikFieldDateTimePicker.propTypes = { - field: PropTypes.shape().isRequired, - form: PropTypes.shape().isRequired, - type: PropTypes.oneOf(["datetime", "date", "time"]), - timezone: PropTypes.string, - returnDateOnly: PropTypes.bool, -}; - -FormikFieldDateTimePicker.defaultProps = { - type: "datetime", - returnDateOnly: false, -}; - -export default FormikFieldDateTimePicker;