From 2508af3cde19cc7cf508f5a923db4e7716c62513 Mon Sep 17 00:00:00 2001
From: pepper <git@pooper.net.au>
Date: Thu, 10 Dec 2020 23:17:14 -0500
Subject: [PATCH] General change

---
 package-lock.json                             |  34 ++
 package.json                                  |   3 +-
 src/components/root/Navigation.js             |  12 +-
 src/components/root/Pages/Book.js             |   6 +
 src/components/root/Pages/IDSingle.js         |   1 +
 .../root/common/Forms/CPanelBooking.js        | 301 +++++++++---------
 src/components/root/common/Forms/FormPage.js  |   2 +-
 .../common/Functionality/InlineSearchBar.js   |   6 +-
 8 files changed, 207 insertions(+), 158 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index ab5b992..844bada 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2546,6 +2546,11 @@
         }
       }
     },
+    "@types/lodash": {
+      "version": "4.14.165",
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.165.tgz",
+      "integrity": "sha512-tjSSOTHhI5mCHTy/OOXYIhi2Wt1qcbHmuXD1Ha7q70CgI/I71afO4XtLb/cVexki1oVYchpul/TOuu3Arcdxrg=="
+    },
     "@types/minimatch": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
@@ -11750,6 +11755,11 @@
       "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz",
       "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA=="
     },
+    "nanoclone": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/nanoclone/-/nanoclone-0.2.1.tgz",
+      "integrity": "sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA=="
+    },
     "nanoid": {
       "version": "3.1.16",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.16.tgz",
@@ -13849,6 +13859,11 @@
         "warning": "^4.0.0"
       }
     },
+    "property-expr": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/property-expr/-/property-expr-2.0.4.tgz",
+      "integrity": "sha512-sFPkHQjVKheDNnPvotjQmm3KD3uk1fWKUN7CrpdbwmUx3CrG3QiM8QpTSimvig5vTXmTvjz7+TDvXOI9+4rkcg=="
+    },
     "proxy-addr": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz",
@@ -17102,6 +17117,11 @@
       "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
       "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw=="
     },
+    "toposort": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/toposort/-/toposort-2.0.2.tgz",
+      "integrity": "sha1-riF2gXXRVZ1IvvNUILL0li8JwzA="
+    },
     "tough-cookie": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-3.0.1.tgz",
@@ -19114,6 +19134,20 @@
           "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg=="
         }
       }
+    },
+    "yup": {
+      "version": "0.32.5",
+      "resolved": "https://registry.npmjs.org/yup/-/yup-0.32.5.tgz",
+      "integrity": "sha512-bLbkTrPrFEF4rg30lS8T3QqoVLSAJ1N/b6btn5HVM4y9Q2EVJr2VLk+3kcskqPB41OSPx0cGRLINklH7PNqSYg==",
+      "requires": {
+        "@babel/runtime": "^7.10.5",
+        "@types/lodash": "^4.14.165",
+        "lodash": "^4.17.20",
+        "lodash-es": "^4.17.11",
+        "nanoclone": "^0.2.1",
+        "property-expr": "^2.0.4",
+        "toposort": "^2.0.2"
+      }
     }
   }
 }
diff --git a/package.json b/package.json
index a1f5b7d..c7ce9ee 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,8 @@
     "reactstrap-date-picker": "0.0.11",
     "redux": "^4.0.5",
     "styled-components": "^5.2.1",
-    "web-vitals": "^0.2.4"
+    "web-vitals": "^0.2.4",
+    "yup": "^0.32.5"
   },
   "scripts": {
     "start": "react-scripts start",
diff --git a/src/components/root/Navigation.js b/src/components/root/Navigation.js
index c3f7c5f..3a5121a 100644
--- a/src/components/root/Navigation.js
+++ b/src/components/root/Navigation.js
@@ -33,16 +33,8 @@ export class Navigation extends Component {
               </li>
             </ul>
             {/* Inline UUID search bar is here */}
-            <ul className="right hide-on-med-and-down">
-              <li style={{ paddingRight: "1em" }}>UUID:</li>
-              <li>
-                <InLineSearch style={{ paddingRight: "4em" }}></InLineSearch>
-              </li>
-              {/* <li>
-                <Link>
-                  <IdSearchForm />
-                </Link>
-              </li> */}
+            <ul className="right ">
+              <InLineSearch />
             </ul>
           </div>
         </div>
diff --git a/src/components/root/Pages/Book.js b/src/components/root/Pages/Book.js
index 45ee8ee..0115407 100644
--- a/src/components/root/Pages/Book.js
+++ b/src/components/root/Pages/Book.js
@@ -6,6 +6,12 @@ import FormPage from "../common/Forms/FormPage";
 // links directly to FormPage which contains the POST request
 
 export default class Book extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      migs: [],
+    };
+  }
   render() {
     return (
       <div className="container-fluid">
diff --git a/src/components/root/Pages/IDSingle.js b/src/components/root/Pages/IDSingle.js
index 9959bfa..2a0a803 100644
--- a/src/components/root/Pages/IDSingle.js
+++ b/src/components/root/Pages/IDSingle.js
@@ -31,6 +31,7 @@ export default class Reports extends Component {
       .catch(function (error) {
         console.log(error);
       });
+    console.log(urlID);
   }
 
   render() {
diff --git a/src/components/root/common/Forms/CPanelBooking.js b/src/components/root/common/Forms/CPanelBooking.js
index 594e9af..df7a623 100644
--- a/src/components/root/common/Forms/CPanelBooking.js
+++ b/src/components/root/common/Forms/CPanelBooking.js
@@ -3,6 +3,7 @@ import "bootstrap/dist/css/bootstrap.min.css";
 import moment from "moment";
 import { Col, FormGroup, Row, Container, Label } from "reactstrap";
 import { Formik, Form } from "formik";
+import * as Yup from "yup";
 import { Input, Submit } from "formstrap";
 import { callAPI } from "../../../actions/API";
 
@@ -10,6 +11,10 @@ import { callAPI } from "../../../actions/API";
 // found at /book under the web hosting migration tab
 // Things to add:
 // better date time picking.
+const InputValidation = Yup.object().shape({
+  domain: Yup.string().min(2, "Too Short!").required("Required"),
+  username: Yup.string().min(2, "Too Short!").required("Required"),
+});
 
 export const CPanelBooking = () => {
   const initialValues = {
@@ -30,152 +35,158 @@ export const CPanelBooking = () => {
     resetForm({ values: "" });
   };
   return (
-    <Formik initialValues={initialValues} onSubmit={onSubmit}>
-      <Form>
-        <Container>
-          <Row>
-            <Col>
-              <FormGroup>
-                <Label for="bookedDate">Date</Label>
-                <Input
-                  type="date"
-                  name="booked_date"
-                  id="bookedDate"
-                  placeholder="date placeholder"
-                  mindate={Date()}
-                />
-              </FormGroup>
-            </Col>
-            <Col>
-              <FormGroup>
-                <Label for="bookedTime">Timeslot</Label>
-                <Input type="select" name="booked_time" id="bookedTime">
-                  <option>Select</option>
-                  <option>00:00-03:00</option>
-                  <option>03:00-06:00</option>
-                  <option>06:00-09:00</option>
-                  <option>08:00-12:00</option>
-                  <option>12:00-18:00</option>
-                  <option>18:00-00:00</option>
-                </Input>
-              </FormGroup>
-            </Col>
-            <Col>
-              <FormGroup>
-                <Label for="bookedDomain">Domain</Label>
-                <Input
-                  type="text"
-                  name="domain"
-                  id="bookedDomain"
-                  placeholder="example.com.au"
-                />
-              </FormGroup>
-            </Col>
-            <Col>
-              <FormGroup>
-                <Label for="bookedUsername">cPanel username</Label>
-                <Input
-                  type="text"
-                  name="username"
-                  id="bookedUsername"
-                  placeholder="example"
-                />
-              </FormGroup>
-            </Col>
-          </Row>
-          <Row>
-            <Col>
-              <FormGroup>
-                <Label for="bookedSource">Original server</Label>
-                <Input
-                  type="text"
-                  name="original_server"
-                  id="bookedSource"
-                  placeholder="1.2.3.4"
-                />
-              </FormGroup>
-            </Col>
-            <Col>
-              <FormGroup>
-                <Label for="bookedDestination">New server</Label>
-                <Input
-                  type="text"
-                  name="new_server"
-                  id="bookedDestination"
-                  placeholder="1.2.3.4"
-                />
-              </FormGroup>
-            </Col>
-          </Row>
-          <Row>
-            <Col>
-              <FormGroup>
-                <Label for="bookedBrand">Brand</Label>
-                <Input type="select" name="brand" id="bookedBrand">
-                  <option>Select</option>
-                  <option>VentraIP</option>
-                  <option>Zuver</option>
-                  <option>Synergy</option>
-                </Input>
-              </FormGroup>
-            </Col>
-            <Col>
-              <FormGroup>
-                <Label for="bookedTicket">Ticket ID</Label>
-                <Input
-                  type="text"
-                  name="ticket_id"
-                  id="bookedTicket"
-                  placeholder="VIP-A1234567"
-                />
-              </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>
-                <Input
-                  type="text"
-                  name="agent_booked"
-                  id="bookedAgent"
-                  placeholder="SZ"
-                />
-              </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>
+    <Formik
+      initialValues={initialValues}
+      onSubmit={onSubmit}
+      validationSchema={InputValidation}
+    >
+      {({ errors, touched }) => (
+        <Form>
+          <Container>
+            <Row>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedDate">Date</Label>
+                  <Input
+                    type="date"
+                    name="booked_date"
+                    id="bookedDate"
+                    placeholder="date placeholder"
+                    mindate={Date()}
+                  />
+                </FormGroup>
+              </Col>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedTime">Timeslot</Label>
+                  <Input type="select" name="booked_time" id="bookedTime">
+                    <option>Select</option>
+                    <option>00:00-03:00</option>
+                    <option>03:00-06:00</option>
+                    <option>06:00-09:00</option>
+                    <option>08:00-12:00</option>
+                    <option>12:00-18:00</option>
+                    <option>18:00-00:00</option>
+                  </Input>
+                </FormGroup>
+              </Col>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedDomain">Domain</Label>
+                  <Input
+                    type="text"
+                    name="domain"
+                    id="bookedDomain"
+                    placeholder="example.com.au"
+                  />
+                </FormGroup>
+              </Col>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedUsername">cPanel username</Label>
+                  <Input
+                    type="text"
+                    name="username"
+                    id="bookedUsername"
+                    placeholder="example"
+                  />
+                </FormGroup>
+              </Col>
+            </Row>
+            <Row>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedSource">Original server</Label>
+                  <Input
+                    type="text"
+                    name="original_server"
+                    id="bookedSource"
+                    placeholder="1.2.3.4"
+                  />
+                </FormGroup>
+              </Col>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedDestination">New server</Label>
+                  <Input
+                    type="text"
+                    name="new_server"
+                    id="bookedDestination"
+                    placeholder="1.2.3.4"
+                  />
+                </FormGroup>
+              </Col>
+            </Row>
+            <Row>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedBrand">Brand</Label>
+                  <Input type="select" name="brand" id="bookedBrand">
+                    <option>Select</option>
+                    <option>VentraIP</option>
+                    <option>Zuver</option>
+                    <option>Synergy</option>
+                  </Input>
+                </FormGroup>
+              </Col>
+              <Col>
+                <FormGroup>
+                  <Label for="bookedTicket">Ticket ID</Label>
+                  <Input
+                    type="text"
+                    name="ticket_id"
+                    id="bookedTicket"
+                    placeholder="VIP-A1234567"
+                  />
+                </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>
+                  <Input
+                    type="text"
+                    name="agent_booked"
+                    id="bookedAgent"
+                    placeholder="SZ"
+                  />
+                </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>
-      </Form>
+            <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>
+        </Form>
+      )}
     </Formik>
   );
 };
diff --git a/src/components/root/common/Forms/FormPage.js b/src/components/root/common/Forms/FormPage.js
index 24b2d20..7c58803 100644
--- a/src/components/root/common/Forms/FormPage.js
+++ b/src/components/root/common/Forms/FormPage.js
@@ -13,7 +13,7 @@ import classnames from "classnames";
 import { CPanelBooking } from "./CPanelBooking";
 import EmailBooking from "./EmailBooking";
 
-const FormPage = (props) => {
+const FormPage = ({ item }) => {
   const [activeTab, setActiveTab] = useState("1");
 
   const toggle = (tab) => {
diff --git a/src/components/root/common/Functionality/InlineSearchBar.js b/src/components/root/common/Functionality/InlineSearchBar.js
index fc05397..c89d39b 100644
--- a/src/components/root/common/Functionality/InlineSearchBar.js
+++ b/src/components/root/common/Functionality/InlineSearchBar.js
@@ -29,7 +29,11 @@ class InLineSearch extends React.Component {
           value={this.state.data}
           onChange={this.onChange}
           onKeyDown={this.onKeyPressed}
-        ></input>
+          placeholder="Enter Migration UUID"
+          id="search"
+          type="search"
+          required
+        />
       </span>
     );
   }