Public
Script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import date_me_doc_locations from "https://esm.town/v/stevekrouse/date_me_doc_locations";
const Link = ({ href, children }) => {
return <a href={href} className="text-sky-600 hover:text-sky-500" target="_blank">{children}</a>;
};
export const action = async ({ request }: { request: Request }) => {
"use server"; // just a silly convention
const { sqlite } = await import("https://esm.town/v/std/sqlite");
const { email } = await import("https://esm.town/v/stevekrouse/email");
const form = await request.formData();
const args = [
JSON.stringify(form.get("Name")),
JSON.stringify(form.get("Profile")),
parseInt(form.get("Age") as string),
JSON.stringify(form.get("Gender[]")),
JSON.stringify(form.get("InterestedIn[]")),
JSON.stringify(form.get("location[]")),
JSON.stringify(form.get("LocationFlexibility")),
JSON.stringify(form.get("Style") === "mono" ? ["mono"] : form.get("Style") === "poly" ? ["poly"] : ["Any"]),
JSON.stringify(form.get("Contact")),
new Date().toISOString(),
];
console.log(args);
try {
await sqlite.execute(
{
sql: `INSERT INTO DateMeDocs (
Name,
Profile,
Age,
Gender,
InterestedIn,
Location,
LocationFlexibility,
Style,
Contact,
LastUpdated
) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,
args,
},
);
await email({ subject: "Date Me Doc Submit Success: " + form.get("Name"), text: args.join("\n") });
} catch (e) {
await email({ subject: "Date Me Doc Submit Error: " + form.get("Name"), text: args.join("\n") });
}
const url = new URL(request.url);
return Response.redirect(`${url.origin}/success`, 303);
};
export default () => (
<form className="max-w-xl mx-auto bg-white p-6" method="post">
<h2 className="text-2xl mb-4 font-semibold text-gray-800">Submit Your Date Me Doc</h2>
<div className="mb-4">
<label htmlFor="Name" className="block text-gray-700 font-bold mb-2">
Name<span className="ml-1 text-red-500 ">*</span>
</label>
<input
type="text"
id="Name"
name="Name"
required
placeholder="William Thacker"
className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
/>
</div>
<div className="mb-4">
<label htmlFor="Profile" className="block text-gray-700 font-bold mb-1">
Profile URL<span className="ml-1 text-red-500 ">*</span>
</label>
<div className="text-sm mb-2">
If you don't have a Date Me Doc yet, create one in <Link href="https://notion.com">Notion</Link> or{" "}
<Link href="https://docs.google.com">Google Docs</Link>, and then copy its public link here.
</div>
<input
type="url"
id="Profile"
name="Profile"
required
placeholder="https://horse-and-hound.com/dating"
className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
/>
</div>
<div className="mb-4">
<label htmlFor="Age" className="block text-gray-700 font-bold mb-2">Age</label>
<input
type="number"
id="Age"
name="Age"
required
placeholder="35"
className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
/>
</div>
<div className="mb-4 flex items-center">
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
Comments
Nobody has commented on this val yet: be the first!
August 17, 2024