Delete User

1"use client"
2 
3import { useAuth } from "@better-auth-ui/react"
4import type { ComponentProps } from "react"
5 
6import { cn } from "@/lib/utils"
7import { DeleteAccount } from "./delete-account"
8 
9export type DangerZoneProps = {
10  className?: string
11}
12 
13/**
14 * Renders the danger zone heading and {@link DeleteAccount}.
15 * Registered as a `securityCard` by `deleteUserPlugin()`; gate by registering the plugin.
16 */
17export function DangerZone({
18  className,
19  ...props
20}: DangerZoneProps & Omit<ComponentProps<"div">, "children" | "className">) {
21  const { localization } = useAuth()
22 
23  return (
24    <div className={cn("flex w-full flex-col", className)} {...props}>
25      <h2 className="text-sm font-semibold mb-3 text-destructive">
26        {localization.settings.dangerZone}
27      </h2>
28 
29      <DeleteAccount />
30    </div>
31  )
32}