Commit 35506d49 authored by David Haynes's avatar David Haynes 🙆
Browse files

Really sketch implementation of submitting go links

- to be abstracted and prettified
parent b74653e6
Pipeline #3574 passed with stage
in 1 minute and 13 seconds
...@@ -3,13 +3,16 @@ import { Formik, Field, Form, ErrorMessage } from "formik"; ...@@ -3,13 +3,16 @@ import { Formik, Field, Form, ErrorMessage } from "formik";
import * as Yup from "yup"; import * as Yup from "yup";
import { PageTemplate, DebugRead } from "Components"; import { PageTemplate, DebugRead } from "Components";
const SignupSchema = Yup.object().shape({ const DebugCreate = Yup.object().shape({
password: Yup.string() destination: Yup.string()
.min(2, "Too Short!") .url()
.max(50, "Too Long!"), .max(1000, "Too Long!"),
email: Yup.string() short: Yup.string()
.email("Invalid email")
.required("Required") .required("Required")
.max(20, "Too Long!")
// expires: Yup.date()
// .nullable()
// .min(new Date(new Date().getTime() + 24 * 60 * 60 * 1000))
}); });
class DebugCRUD extends React.Component { class DebugCRUD extends React.Component {
...@@ -18,6 +21,22 @@ class DebugCRUD extends React.Component { ...@@ -18,6 +21,22 @@ class DebugCRUD extends React.Component {
this.state = {}; this.state = {};
} }
getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != "") {
var cookies = document.cookie.split(";");
for (var i = 0; i < cookies.length; i++) {
var cookie = cookies[i].trim();
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == name + "=") {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
render() { render() {
return ( return (
<PageTemplate> <PageTemplate>
...@@ -26,20 +45,29 @@ class DebugCRUD extends React.Component { ...@@ -26,20 +45,29 @@ class DebugCRUD extends React.Component {
<h3>Create</h3> <h3>Create</h3>
<Formik <Formik
initialValues={{ email: "", password: "" }} initialValues={{ destination: "", short: "", expires: null }}
validationSchema={SignupSchema} validationSchema={DebugCreate}
onSubmit={(values, { setSubmitting }) => { onSubmit={(values, { setSubmitting }) => {
setTimeout(() => { fetch("/api/golinks/", {
console.log(JSON.stringify(values, null, 2)); method: "post",
setSubmitting(false); headers: {
}, 400); "Content-Type": "application/json",
"X-CSRFToken": this.getCookie("csrftoken")
},
body: JSON.stringify(values)
}).then(response => console.log(response));
}} }}
render={({ isSubmitting }) => ( render={({ isSubmitting }) => (
<Form> <Form>
<Field type="email" name="email" placeholder="Email" /> <Field
<ErrorMessage name="email" component="div" /> name="destination"
<Field type="password" name="password" /> placeholder="https://longwebsitelink.com"
<ErrorMessage name="password" /> />{" "}
<ErrorMessage name="destination" component="div" />
<Field name="short" />
<ErrorMessage name="short" />
<Field type="select" name="expires" />
<ErrorMessage name="expires" />
<button type="submit" disabled={isSubmitting}> <button type="submit" disabled={isSubmitting}>
Submit Submit
</button> </button>
...@@ -51,50 +79,7 @@ class DebugCRUD extends React.Component { ...@@ -51,50 +79,7 @@ class DebugCRUD extends React.Component {
<DebugRead /> <DebugRead />
<h3>Update</h3> <h3>Update</h3>
<Formik
initialValues={{ email: "", password: "" }}
validationSchema={SignupSchema}
onSubmit={(values, { setSubmitting }) => {
setTimeout(() => {
console.log(JSON.stringify(values, null, 2));
setSubmitting(false);
}, 400);
}}
render={({ isSubmitting }) => (
<Form>
<Field type="email" name="email" placeholder="Email" />
<ErrorMessage name="email" component="div" />
<Field type="password" name="password" />
<ErrorMessage name="password" />
<button type="submit" disabled={isSubmitting}>
Submit
</button>
</Form>
)}
/>
<h3>Delete</h3> <h3>Delete</h3>
<Formik
initialValues={{ email: "", password: "" }}
validationSchema={SignupSchema}
onSubmit={(values, { setSubmitting }) => {
setTimeout(() => {
console.log(JSON.stringify(values, null, 2));
setSubmitting(false);
}, 400);
}}
render={({ isSubmitting }) => (
<Form>
<Field type="email" name="email" placeholder="Email" />
<ErrorMessage name="email" component="div" />
<Field type="password" name="password" />
<ErrorMessage name="password" />
<button type="submit" disabled={isSubmitting}>
Submit
</button>
</Form>
)}
/>
</div> </div>
</PageTemplate> </PageTemplate>
); );
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment