feat: refactoring, soem work on forms

routes/(guest)/sign-in.tsx

@@ -0,0 +1,74 @@
+import { z } from "zod";
+import { backendSignIn } from "../../backend/sign-in.ts";
+import Headline from "../../components/Headline.tsx";
+import { SignInForm } from "../../components/SignInForm.tsx";
+import { setAuthCookie } from "../../lib/auth.ts";
+import { define } from "../../utils.ts";
+
+const loginSchema = z.object({
+  email: z.string(),
+  password: z.string().min(8),
+});
+
+export const handler = define.handlers({
+  GET(_ctx) {
+    return {
+      data: {
+        email: "",
+        error: undefined,
+      },
+    };
+  },
+
+  async POST(ctx) {
+    const formData = await ctx.req.formData();
+    const request = loginSchema.safeParse({
+      email: formData.get("email"),
+      password: formData.get("password"),
+    });
+
+    if (!request.success) {
+      return {
+        data: {
+          email: formData.get("email") as string,
+          error: request.error.issues[0].message,
+        },
+      };
+    }
+    const { email, password } = request.data;
+
+    // Super secure authorization method
+    if (!await backendSignIn(email, password)) {
+      return {
+        data: {
+          email,
+        },
+      };
+    }
+
+    const headers = new Headers();
+    setAuthCookie(headers);
+
+    const url = new URL(ctx.req.url);
+    url.pathname = "/dashboard";
+    headers.set("location", url.toString());
+    return new Response(null, {
+      status: 303,
+      headers,
+    });
+  },
+});
+
+export default define.page<typeof handler>(function SignInPage(ctx) {
+  const email = ctx.data.email || "";
+  const error = ctx.data.error;
+
+  return (
+    <div class="p-4">
+      <div class="max-w-96 mx-auto p-4 flex flex-col gap-4 border rounded">
+        <Headline>Sign in</Headline>
+        <SignInForm email={email} error={error} />
+      </div>
+    </div>
+  );
+});