cleaned up some legacy code and restructured form

This commit is contained in:
pepper 2021-01-19 17:25:32 -05:00
parent faab2fd921
commit d6c1fc7f52
4 changed files with 117 additions and 57 deletions

46
package-lock.json generated
View File

@ -3413,6 +3413,11 @@
"postcss-value-parser": "^4.1.0"
}
},
"autosize": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/autosize/-/autosize-4.0.2.tgz",
"integrity": "sha512-jnSyH2d+qdfPGpWlcuhGiHmqBJ6g3X+8T+iRwFrHPLVcdoGJE/x6Qicm6aDHfTsbgZKxyV8UU/YB2p4cjKDRRA=="
},
"aws-sign2": {
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
@ -14661,6 +14666,17 @@
"prop-types": "^15.5.6"
}
},
"react-textarea-autosize": {
"version": "8.3.0",
"resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.3.0.tgz",
"integrity": "sha512-3GLWFAan2pbwBeoeNDoqGmSbrShORtgWfaWX0RJDivsUrpShh01saRM5RU/i4Zmf+whpBVEY5cA90Eq8Ub1N3w==",
"dev": true,
"requires": {
"@babel/runtime": "^7.10.2",
"use-composed-ref": "^1.0.0",
"use-latest": "^1.0.0"
}
},
"react-time-picker": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/react-time-picker/-/react-time-picker-4.0.1.tgz",
@ -17155,6 +17171,12 @@
"resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.1.tgz",
"integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA=="
},
"ts-essentials": {
"version": "2.0.12",
"resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-2.0.12.tgz",
"integrity": "sha512-3IVX4nI6B5cc31/GFFE+i8ey/N2eA0CZDbo6n0yrz0zDX8ZJ8djmU1p+XRz7G3is0F3bB3pu2pAroFdAWQKU3w==",
"dev": true
},
"ts-pnp": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/ts-pnp/-/ts-pnp-1.2.0.tgz",
@ -17493,6 +17515,30 @@
"resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
"integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ=="
},
"use-composed-ref": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/use-composed-ref/-/use-composed-ref-1.1.0.tgz",
"integrity": "sha512-my1lNHGWsSDAhhVAT4MKs6IjBUtG6ZG11uUqexPH9PptiIZDQOzaF4f5tEbJ2+7qvNbtXNBbU3SfmN+fXlWDhg==",
"dev": true,
"requires": {
"ts-essentials": "^2.0.3"
}
},
"use-isomorphic-layout-effect": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.1.tgz",
"integrity": "sha512-L7Evj8FGcwo/wpbv/qvSfrkHFtOpCzvM5yl2KVyDJoylVuSvzphiiasmjgQPttIGBAy2WKiBNR98q8w7PiNgKQ==",
"dev": true
},
"use-latest": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/use-latest/-/use-latest-1.2.0.tgz",
"integrity": "sha512-d2TEuG6nSLKQLAfW3By8mKr8HurOlTkul0sOpxbClIv4SQ4iOd7BYr7VIzdbktUCnv7dua/60xzd8igMU6jmyw==",
"dev": true,
"requires": {
"use-isomorphic-layout-effect": "^1.0.0"
}
},
"util": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz",

View File

@ -9,6 +9,7 @@
"@testing-library/jest-dom": "^5.11.5",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"autosize": "^4.0.2",
"axios": "^0.21.0",
"axios-react": "^2.0.2",
"bootstrap": "^4.5.3",
@ -71,5 +72,8 @@
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"react-textarea-autosize": "^8.3.0"
}
}

View File

@ -1,5 +1,5 @@
import React, { Component } from "react";
import { Link as a } from "react-router-dom";
import InLineSearch from "./common/Functionality/InlineSearchBar";
// Navbar class component, Just simple href's to retain styling
@ -23,10 +23,17 @@ export class Navigation extends Component {
<Link to="/migrations">Migrations</Link>
</li> */}
<li>
<a href="/reports" className="hide-on-med-and-down">Reports</a>
<a href="/reports" className="hide-on-med-and-down">
Reports
</a>
</li>
<li>
<a href="/historical-migrations" className="hide-on-med-and-down">Historical Migrations</a>
<a
href="/historical-migrations"
className="hide-on-med-and-down"
>
Historical Migrations
</a>
</li>
<li className="orange accent-4 active">
<a href="/book">Book</a>

View File

@ -8,22 +8,13 @@ import { Input, Submit } from "formstrap";
import { callAPI } from "../../../actions/API";
import Msgbox from "../../../actions/Msgbox";
import { builfArrayFromObject } from "../../../actions/Error";
import TextareaAutosize from "react-textarea-autosize";
// Main form and POST Request to add migrations
// found at /book under the web hosting migration tab
// Things to add:
// better date time picking.
const timezoneList = {
losAngeles: "America/Los_Angeles", // -8:00 (-7)
berlin: "Europe/Berlin", // +2:00 (-1)
newYork: "America/New_York", // -5:00 (-4)
melbourne: "Australia/Melbourne", // +8:00
tongatapu: "Pacific/Tongatapu", // +13:00 (+14)
djibouti: "Africa/Djibouti", // +3:00
};
const timezone = timezoneList.melbourne;
const InputValidation = Yup.object().shape({
domain: Yup.string()
.matches(
@ -64,6 +55,7 @@ export const CPanelBooking = () => {
};
const onSubmit = async (values, { setSubmitting, resetForm }) => {
console.log(values);
callAPI
.post("/", values)
.then(function (response) {
@ -85,8 +77,16 @@ export const CPanelBooking = () => {
onSubmit={onSubmit}
validationSchema={InputValidation}
>
{({ errors, touched }) => (
<Form>
{({
handleSubmit,
handleChange,
handleBlur,
values,
touched,
isValid,
errors,
}) => (
<Form noValidate onSubmit={handleSubmit}>
<Container>
<Row>
<Col>
@ -100,11 +100,14 @@ export const CPanelBooking = () => {
mindate={Date()}
/>
</FormGroup>
</Col>
<Col>
<FormGroup>
<Label for="bookedTime">Timeslot *</Label>
<Input type="select" name="booked_time" id="bookedTime">
<Input
type="select"
name="booked_time"
id="bookedTime"
className="has-success"
>
<option>Select</option>
<option>00:00-03:00</option>
<option>03:00-06:00</option>
@ -125,8 +128,6 @@ export const CPanelBooking = () => {
placeholder="example.com.au"
/>
</FormGroup>
</Col>
<Col>
<FormGroup>
<Label for="bookedUsername">cPanel username *</Label>
<Input
@ -137,8 +138,6 @@ export const CPanelBooking = () => {
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col>
<FormGroup>
<Label for="bookedSource">Original server *</Label>
@ -146,22 +145,21 @@ export const CPanelBooking = () => {
type="text"
name="original_server"
id="bookedSource"
placeholder="1.2.3.4"
placeholder="1.2.3.4 / example.com"
/>
</FormGroup>
</Col>
<Col>
<FormGroup>
<Label for="bookedDestination">New server *</Label>
<Input
type="text"
name="new_server"
id="bookedDestination"
placeholder="1.2.3.4"
placeholder="1.2.3.4 / S111.SYD1"
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col>
<FormGroup>
@ -185,17 +183,6 @@ export const CPanelBooking = () => {
/>
</FormGroup>
</Col>
<Col>
<FormGroup>
<Label for="bookedType">Migration type *</Label>
<Input type="select" name="migration_type" id="bookedType">
<option>Select</option>
<option>cPanel</option>
<option>Plesk</option>
<option>Other</option>
</Input>
</FormGroup>
</Col>
<Col>
<FormGroup>
<Label for="bookedAgent">Agent Initials *</Label>
@ -207,27 +194,43 @@ export const CPanelBooking = () => {
/>
</FormGroup>
</Col>
<Col>
<FormGroup>
<Label for="bookedType">Migration type *</Label>
<Input type="select" name="migration_type" id="bookedType">
<option>Select</option>
<option>cPanel</option>
<option>Plesk</option>
<option>Other</option>
</Input>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={4}>
<FormGroup>
<Label for="bookedAdditionalDomains">Addon Domains</Label>
<Input
type="text"
name="additional_domains"
id="bookedAdditionalDomains"
placeholder="example.com.au,example.net.au"
/>
</FormGroup>
<FormGroup>
<Label for="bookedTermDate">
Estimated termination date (internal migrations only)
</Label>
<Input type="date" name="term_date" id="bookedTermDate" />
</FormGroup>
</Col>
<Col md={8}>
<FormGroup>
<Label for="bookedNotes">Notes</Label>
<Input name="notes" id="notes" type="textarea" rows={6} />
</FormGroup>
</Col>
</Row>
<FormGroup>
<Label for="bookedAdditionalDomains">Addon Domains</Label>
<Input
type="text"
name="additional_domains"
id="bookedAdditionalDomains"
placeholder="example.com.au,example.net.au"
/>
</FormGroup>
<FormGroup>
<Label for="bookedTermDate">
Estimated termination date (internal migrations only)
</Label>
<Input type="date" name="term_date" id="bookedTermDate" />
</FormGroup>
<FormGroup>
<Label for="bookedNotes">Notes</Label>
<Input type="textarea" name="notes" id="notes" />
</FormGroup>
<Submit withSpinner>Submit</Submit>
</Container>
{respID ? <Msgbox linkid={respID}></Msgbox> : null}