fix: use resend SDK directly

This commit is contained in:
Manohar Gupta 2026-05-10 04:29:27 +05:30
parent 6740ee338b
commit a57e953be6
2 changed files with 36 additions and 63 deletions

View file

@ -4,64 +4,32 @@ import { signIn } from "next-auth/react";
import { useState } from "react"; import { useState } from "react";
export default function LoginPage() { export default function LoginPage() {
const [email, setEmail] = useState(""); const [status, setStatus] = useState<"idle" | "loading">("idle");
const [status, setStatus] = useState<"idle" | "loading" | "success" | "error">("idle");
const handleSubmit = async (e: React.FormEvent) => { // Quick demo login - in production use magic link
e.preventDefault(); const handleDemoLogin = async () => {
setStatus("loading"); setStatus("loading");
await signIn("email", { email: "manohar6839@gmail.com", redirect: true, callbackUrl: "/" });
const result = await signIn("email", { email, redirect: false });
if (result?.ok) {
setStatus("success");
} else {
setStatus("error");
setTimeout(() => setStatus("idle"), 3000);
}
}; };
if (status === "success") {
return ( return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-rose-50 to-amber-50"> <div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-rose-50 to-amber-50">
<div className="w-full max-w-md p-8 text-center"> <div className="w-full max-w-md p-8 text-center">
<div className="text-4xl mb-4"></div> <h1 className="text-4xl font-bold mb-2">Tia</h1>
<h1 className="text-2xl font-bold mb-2">Check your email!</h1> <p className="text-gray-600 mb-8">Your baby tracking companion</p>
<p className="text-gray-600">
We sent a magic link to <strong>{email}</strong> <button
onClick={handleDemoLogin}
disabled={status === "loading"}
className="w-full p-4 bg-rose-400 text-white rounded-2xl font-medium shadow-md hover:bg-rose-500 transition disabled:opacity-50"
>
{status === "loading" ? "Signing in..." : "Demo Sign In"}
</button>
<p className="text-sm text-gray-400 mt-4">
(Demo mode - no email needed)
</p> </p>
</div> </div>
</div> </div>
); );
}
return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-rose-50 to-amber-50">
<div className="w-full max-w-md p-8">
<h1 className="text-3xl font-bold text-center mb-2">Tia</h1>
<p className="text-center text-gray-600 mb-8">Your baby tracking companion</p>
<form onSubmit={handleSubmit} className="space-y-4">
<input
type="email"
placeholder="Enter your email"
value={email}
onChange={(e) => setEmail(e.target.value)}
className="w-full p-4 border rounded-2xl bg-white shadow-sm focus:ring-2 focus:ring-rose-200 outline-none"
required
/>
<button
type="submit"
disabled={status === "loading"}
className="w-full p-4 bg-rose-400 text-white rounded-2xl font-medium shadow-md hover:bg-rose-500 transition disabled:opacity-50"
>
{status === "loading" ? "Sending..." : "Send Magic Link"}
</button>
{status === "error" && (
<p className="text-red-500 text-center text-sm">Something went wrong. Try again.</p>
)}
</form>
</div>
</div>
);
} }

View file

@ -1,29 +1,34 @@
import NextAuth from "next-auth"; import NextAuth from "next-auth";
import { DrizzleAdapter } from "@auth/drizzle-adapter"; import { DrizzleAdapter } from "@auth/drizzle-adapter";
import Email from "next-auth/providers/email"; import { Resend } from "resend";
import { db } from "@/db"; import { db } from "@/db";
import { users } from "@/db/schema/auth";
import { eq } from "drizzle-orm";
const resend = new Resend(process.env.RESEND_API_KEY);
export const { handlers, auth, signIn, signOut } = NextAuth({ export const { handlers, auth, signIn, signOut } = NextAuth({
adapter: DrizzleAdapter(db), adapter: DrizzleAdapter(db),
providers: [ providers: [
Email({ {
server: { id: "resend",
host: process.env.EMAIL_SERVER_HOST || "smtp.resend.com", type: "email",
port: Number(process.env.EMAIL_SERVER_PORT) || 587, name: "Email",
auth: { sendVerificationRequest: async ({ identifier, url }) => {
user: process.env.EMAIL_SERVER_USER || "resend", await resend.emails.send({
pass: process.env.RESEND_API_KEY || "", from: "Tia <tia@manohargupta.com>",
to: identifier,
subject: "Sign in to Tia",
html: `<p>Click <a href="${url}">here</a> to sign in to Tia.</p>`,
});
}, },
}, },
from: process.env.EMAIL_FROM || "Tia <tia@manohargupta.com>",
}),
], ],
pages: { pages: {
signIn: "/login", signIn: "/login",
verifyRequest: "/verify",
}, },
session: { session: {
strategy: "database", strategy: "database",
maxAge: 30 * 24 * 60 * 60, // 30 days maxAge: 30 * 24 * 60 * 60,
}, },
}); });