57 lines
1.8 KiB
TypeScript
57 lines
1.8 KiB
TypeScript
"use client"
|
|
|
|
import React, { useState } from "react"
|
|
import { useRouter } from "next/navigation"
|
|
import { createClient } from "@/lib/supabase/client"
|
|
import { Loader2 } from "lucide-react"
|
|
import { toast } from "sonner"
|
|
|
|
export default function UpdatePasswordPage() {
|
|
const [password, setPassword] = useState("")
|
|
const [loading, setLoading] = useState(false)
|
|
const router = useRouter()
|
|
const supabase = createClient()
|
|
|
|
async function handleUpdatePassword(e: React.FormEvent) {
|
|
e.preventDefault()
|
|
setLoading(true)
|
|
|
|
const { error } = await supabase.auth.updateUser({
|
|
password: password,
|
|
})
|
|
|
|
if (error) {
|
|
toast.error(error.message)
|
|
} else {
|
|
toast.success("Passwort erfolgreich geändert.")
|
|
router.push("/feed")
|
|
router.refresh()
|
|
}
|
|
setLoading(false)
|
|
}
|
|
|
|
return (
|
|
<main className="flex min-h-dvh flex-col items-center justify-center px-6">
|
|
<div className="w-full max-w-sm">
|
|
<h1 className="mb-6 text-2xl font-bold">Neues Passwort festlegen</h1>
|
|
<form onSubmit={handleUpdatePassword} className="flex flex-col gap-4">
|
|
<input
|
|
type="password"
|
|
value={password}
|
|
onChange={(e) => setPassword(e.target.value)}
|
|
placeholder="Neues Passwort"
|
|
required
|
|
className="h-12 w-full rounded-lg border border-input bg-background px-4 text-sm"
|
|
/>
|
|
<button
|
|
type="submit"
|
|
disabled={loading}
|
|
className="flex h-12 w-full items-center justify-center gap-2 rounded-lg bg-primary font-semibold text-primary-foreground disabled:opacity-50"
|
|
>
|
|
{loading ? <Loader2 className="h-5 w-5 animate-spin" /> : "Passwort speichern"}
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</main>
|
|
)
|
|
} |