"use client";
import { postLogin, postRegister } from "@/actions/login";
import { cn } from "@/lib/utils";
import { zodResolver } from "@hookform/resolvers/zod";
import { useForm } from "react-hook-form";
import { z } from "zod";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import {
Card,
CardHeader,
CardDescription,
CardContent,
CardFooter,
CardTitle,
} from "@/components/ui/card";
import {
Form,
FormControl,
FormDescription,
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form";
import { Label } from "@/components/ui/label";
import { Input } from "@/components/ui/input";
import { useActionState } from "react";
const FormSchema = z.object({
username: z.string().min(2, {
message: "Username must be at least 2 characters.",
}),
password: z.string().min(2, {
message: "Password must be at least 2 characters.",
}),
});
export default function AuthScreen() {
return ;
}
function OOldform() {
const [state, formAction, isPending] = useActionState<
{ msg: string },
FormData
>(postLogin, { msg: "init" });
return (
);
}
function Oldform() {
const [state, formAction, isPending] = useActionState<
{ msg: string },
FormData
>(postLogin, { msg: "init" });
return (
);
}
function Register({ setRegister }: { setRegister: (b: boolean) => void }) {
const form = useForm>({
resolver: zodResolver(FormSchema),
defaultValues: {
username: "",
password: "",
},
});
async function onSubmit(data: z.infer) {
const body = JSON.stringify({
name: data.username,
creds: data.password,
});
const opts = {
method: "POST",
headers: { "Content-type": "application/json" },
body,
};
const res = await fetch("/api/db/user/new", opts);
const j = await res.json();
console.log(j);
if ("error" in j) toast(`Error: ${j.error}`);
else {
toast("Register successful");
}
}
return (
Register
);
}
function LoginForm({
className,
...props
}: React.ComponentPropsWithoutRef<"div">) {
const form = useForm>({
resolver: zodResolver(FormSchema),
defaultValues: {
username: "",
password: "",
},
});
async function onSubmit(data: z.infer) {
console.log("oh hai");
const body = JSON.stringify({
name: data.username,
creds: data.password,
});
const opts = {
method: "POST",
headers: { "Content-type": "application/json" },
body,
};
const res = await fetch("/api/login", opts);
const j = await res.json();
console.log({ j });
if ("error" in j) toast(`Error! ${j.error}`);
else {
toast("Login successful");
}
}
return (
Welcome back
Login to Sorlang
);
}