mirror of
https://github.com/leonvanzyl/agentic-coding-starter-kit.git
synced 2026-01-29 22:12:03 +00:00
Replace Google OAuth provider with email/password authentication to reduce friction for MVP development and vibe coding workflows. Changes: - Remove Google OAuth configuration from auth.ts - Add emailAndPassword provider with enabled: true - Add email verification with sendOnSignUp: true - Add password reset functionality - Log verification and reset URLs to terminal (no email integration yet) New auth pages (src/app/(auth)/): - /login - Sign in page - /register - Sign up page - /forgot-password - Password reset request - /reset-password - Password reset completion New components (src/components/auth/): - sign-up-form.tsx - Registration form - forgot-password-form.tsx - Password reset request form - reset-password-form.tsx - Password reset form Updated components: - sign-in-button.tsx - Now email/password form instead of Google button - user-profile.tsx - Shows Sign in/Sign up buttons when logged out Bug fixes: - Fix React render error in profile page by wrapping router.push in useEffect Config updates: - Remove GOOGLE_CLIENT_ID and GOOGLE_CLIENT_SECRET from env.example - Update CLAUDE.md documentation to reflect email/password auth - Add requestPasswordReset, resetPassword, sendVerificationEmail to auth-client exports All changes applied to both main project and create-agentic-app template. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
84 lines
2.3 KiB
TypeScript
84 lines
2.3 KiB
TypeScript
"use client"
|
|
|
|
import { useState } from "react"
|
|
import Link from "next/link"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Input } from "@/components/ui/input"
|
|
import { Label } from "@/components/ui/label"
|
|
import { requestPasswordReset } from "@/lib/auth-client"
|
|
|
|
export function ForgotPasswordForm() {
|
|
const [email, setEmail] = useState("")
|
|
const [error, setError] = useState("")
|
|
const [success, setSuccess] = useState(false)
|
|
const [isPending, setIsPending] = useState(false)
|
|
|
|
const handleSubmit = async (e: React.FormEvent) => {
|
|
e.preventDefault()
|
|
setError("")
|
|
setIsPending(true)
|
|
|
|
try {
|
|
const result = await requestPasswordReset({
|
|
email,
|
|
redirectTo: "/reset-password",
|
|
})
|
|
|
|
if (result.error) {
|
|
setError(result.error.message || "Failed to send reset email")
|
|
} else {
|
|
setSuccess(true)
|
|
}
|
|
} catch {
|
|
setError("An unexpected error occurred")
|
|
} finally {
|
|
setIsPending(false)
|
|
}
|
|
}
|
|
|
|
if (success) {
|
|
return (
|
|
<div className="space-y-4 w-full max-w-sm text-center">
|
|
<p className="text-sm text-muted-foreground">
|
|
If an account exists with that email, a password reset link has been sent.
|
|
Check your terminal for the reset URL.
|
|
</p>
|
|
<Link href="/login">
|
|
<Button variant="outline" className="w-full">
|
|
Back to sign in
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<form onSubmit={handleSubmit} className="space-y-4 w-full max-w-sm">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="email">Email</Label>
|
|
<Input
|
|
id="email"
|
|
type="email"
|
|
placeholder="you@example.com"
|
|
value={email}
|
|
onChange={(e) => setEmail(e.target.value)}
|
|
required
|
|
disabled={isPending}
|
|
/>
|
|
</div>
|
|
{error && (
|
|
<p className="text-sm text-destructive">{error}</p>
|
|
)}
|
|
<Button type="submit" className="w-full" disabled={isPending}>
|
|
{isPending ? "Sending..." : "Send reset link"}
|
|
</Button>
|
|
<div className="text-center text-sm text-muted-foreground">
|
|
Remember your password?{" "}
|
|
<Link href="/login" className="text-primary hover:underline">
|
|
Sign in
|
|
</Link>
|
|
</div>
|
|
</form>
|
|
)
|
|
}
|