92 lines
2.5 KiB
TypeScript
92 lines
2.5 KiB
TypeScript
import React from "react";
|
|
import {
|
|
AlertDialog,
|
|
AlertDialogAction,
|
|
AlertDialogContent,
|
|
AlertDialogFooter,
|
|
AlertDialogHeader,
|
|
AlertDialogTitle,
|
|
} from "./ui/alert-dialog";
|
|
import { Input } from "./ui/input";
|
|
import toast from "react-hot-toast";
|
|
import { PICO_BACKEND_FORM_SECRET } from "../config";
|
|
|
|
const TermsOfServiceDialog: React.FC<{
|
|
open: boolean;
|
|
onOpenChange: (open: boolean) => void;
|
|
}> = ({ open, onOpenChange }) => {
|
|
const [email, setEmail] = React.useState("");
|
|
|
|
const onSubscribe = async () => {
|
|
await fetch("https://backend.buildpicoapps.com/form", {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
body: JSON.stringify({ email, secret: PICO_BACKEND_FORM_SECRET }),
|
|
});
|
|
};
|
|
|
|
return (
|
|
<AlertDialog open={open} onOpenChange={onOpenChange}>
|
|
<AlertDialogContent>
|
|
<AlertDialogHeader>
|
|
<AlertDialogTitle className="mb-2">
|
|
Enter your email to get started
|
|
</AlertDialogTitle>
|
|
</AlertDialogHeader>
|
|
|
|
<div className="mb-2">
|
|
<Input
|
|
placeholder="Email"
|
|
value={email}
|
|
onChange={(e) => {
|
|
setEmail(e.target.value);
|
|
}}
|
|
/>
|
|
</div>
|
|
<div className="flex items-center space-x-2">
|
|
<span>
|
|
By providing your email, you consent to receiving occasional product
|
|
updates, and you accept the{" "}
|
|
<a
|
|
href="https://a.picoapps.xyz/camera-write"
|
|
target="_blank"
|
|
className="underline"
|
|
>
|
|
terms of service
|
|
</a>
|
|
. <br />
|
|
<br />
|
|
Prefer to run it yourself locally? This project is open source.{" "}
|
|
<a
|
|
href="https://github.com/abi/screenshot-to-code"
|
|
target="_blank"
|
|
className="underline"
|
|
>
|
|
Download the code and get started on Github.
|
|
</a>
|
|
</span>
|
|
</div>
|
|
|
|
<AlertDialogFooter>
|
|
<AlertDialogAction
|
|
onClick={(e) => {
|
|
if (!email.trim() || !email.trim().includes("@")) {
|
|
e.preventDefault();
|
|
toast.error("Please enter your email");
|
|
} else {
|
|
onSubscribe();
|
|
}
|
|
}}
|
|
>
|
|
Agree
|
|
</AlertDialogAction>
|
|
</AlertDialogFooter>
|
|
</AlertDialogContent>
|
|
</AlertDialog>
|
|
);
|
|
};
|
|
|
|
export default TermsOfServiceDialog;
|