@xk2800/nextjs-template 0.6.1-beta.3 → 0.7.0-beta.0

package/README.md

@@ -99,6 +99,7 @@ bun --env-file=.env.production server/test-connection/index.ts
 7. Password reset and self-serve email verification, both via Resend-delivered React Email templates
 8. Security email alerts — new-device sign-ins and passkey add/remove, mirrored to the activity log
 9. Cookie-consent banner — "Necessary only" / "Accept all", with a "Cookie settings" link in the footer to change it later. The device fingerprint and Google One Tap only run after "Accept all"
+10. Self-serve account deletion from the dashboard Settings page (password-confirmed, cascades all user data)
 
 ## WIP
 

package/components/dashboard/deleteAccountCard.tsx

@@ -0,0 +1,137 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+import { toast } from 'sonner'
+import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '../ui/card'
+import { Button } from '../ui/button'
+import { Input } from '../ui/input'
+import { PasswordInput } from '../ui/password-input'
+import {
+  AlertDialog,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from '../ui/alert-dialog'
+import { authClient, useSession } from '../../lib/auth-client'
+
+export default function DeleteAccountCard() {
+  const { data: session } = useSession()
+  const email = session?.user.email ?? ''
+  // null = still checking. Credential users confirm with their password;
+  // OAuth-only users have none, so they type their email instead and the
+  // server requires a recent sign-in (better-auth's freshAge check).
+  const [hasPassword, setHasPassword] = useState<boolean | null>(null)
+  const [open, setOpen] = useState(false)
+  const [password, setPassword] = useState('')
+  const [typedEmail, setTypedEmail] = useState('')
+  const [deleting, setDeleting] = useState(false)
+
+  useEffect(() => {
+    authClient.listAccounts().then(({ data }) => {
+      setHasPassword(!!data?.some((a) => a.providerId === 'credential'))
+    })
+  }, [])
+
+  const canSubmit = hasPassword ? password.length > 0 : typedEmail.trim().toLowerCase() === email.toLowerCase()
+
+  const close = (next: boolean) => {
+    if (deleting) return
+    setOpen(next)
+    if (!next) {
+      setPassword('')
+      setTypedEmail('')
+    }
+  }
+
+  const deleteAccount = async (e: React.FormEvent) => {
+    e.preventDefault()
+    if (!canSubmit) return
+    setDeleting(true)
+    try {
+      const { error } = await authClient.deleteUser(hasPassword ? { password } : {})
+      if (error) {
+        toast.error(
+          error.code === 'SESSION_EXPIRED'
+            ? 'For your security, sign out and sign back in, then try again.'
+            : error.message || 'Could not delete account',
+        )
+        return
+      }
+      // Full reload, not router.push: drops every cached session/client state.
+      window.location.href = '/'
+    } finally {
+      setDeleting(false)
+    }
+  }
+
+  return (
+    <>
+      <Card className="border-destructive/50">
+        <CardHeader>
+          <CardTitle>Delete account</CardTitle>
+          <CardDescription>
+            Permanently delete your account, sessions, passkeys, and activity
+            history. This can&apos;t be undone.
+          </CardDescription>
+        </CardHeader>
+        <CardContent>
+          <Button variant="destructive" onClick={() => setOpen(true)} disabled={hasPassword === null}>
+            Delete account
+          </Button>
+        </CardContent>
+      </Card>
+
+      <AlertDialog open={open} onOpenChange={close}>
+        <AlertDialogContent>
+          <form onSubmit={deleteAccount} className="space-y-4">
+            <AlertDialogHeader>
+              <AlertDialogTitle>Delete your account?</AlertDialogTitle>
+              <AlertDialogDescription>
+                Everything tied to <strong>{email}</strong> is removed immediately
+                and you&apos;ll be signed out on every device.
+              </AlertDialogDescription>
+            </AlertDialogHeader>
+
+            {hasPassword ? (
+              <div className="flex flex-col gap-1">
+                <label htmlFor="delete-password" className="text-sm font-medium">
+                  Enter your password to confirm
+                </label>
+                <PasswordInput
+                  id="delete-password"
+                  autoComplete="current-password"
+                  value={password}
+                  onChange={(e) => setPassword(e.target.value)}
+                  autoFocus
+                />
+              </div>
+            ) : (
+              <div className="flex flex-col gap-1">
+                <label htmlFor="delete-email" className="text-sm font-medium">
+                  Type <strong>{email}</strong> to confirm
+                </label>
+                <Input
+                  id="delete-email"
+                  autoComplete="off"
+                  value={typedEmail}
+                  onChange={(e) => setTypedEmail(e.target.value)}
+                  autoFocus
+                />
+              </div>
+            )}
+
+            <AlertDialogFooter>
+              <AlertDialogCancel type="button" disabled={deleting}>Cancel</AlertDialogCancel>
+              <Button type="submit" variant="destructive" disabled={!canSubmit || deleting}>
+                {deleting ? 'Deleting...' : 'Delete account'}
+              </Button>
+            </AlertDialogFooter>
+          </form>
+        </AlertDialogContent>
+      </AlertDialog>
+    </>
+  )
+}

package/dist/activity/queries.d.mts

@@ -1,4 +1,4 @@
-import { A as ActivityActionEnum } from '../schema-BghJ8N4X.mjs';
+import { A as ActivityActionEnum } from '../schema-BrBmQFkn.mjs';
 import 'drizzle-orm';
 import 'drizzle-orm/pg-core';
 

package/dist/activity/queries.d.ts

@@ -1,4 +1,4 @@
-import { A as ActivityActionEnum } from '../schema-BghJ8N4X.js';
+import { A as ActivityActionEnum } from '../schema-BrBmQFkn.js';
 import 'drizzle-orm';
 import 'drizzle-orm/pg-core';
 

package/dist/auth/helpers.js

@@ -787,7 +787,13 @@ function createAuth(overrides = {}) {
           input: false
           // Prevent users from setting their own role
         }
-      }
+      },
+      // Self-service "Delete account" (dashboard Settings → Danger zone).
+      // Credential users confirm with their password; OAuth-only users have
+      // no password, so better-auth instead requires a session younger than
+      // `freshAge` (default 1 day). Every user-owned table cascades on delete.
+      // Impersonation and last-admin guards live in hooks.before below.
+      deleteUser: { enabled: true }
     },
     // Advanced options
     advanced: {
@@ -891,6 +897,20 @@ function createAuth(overrides = {}) {
           }
           return;
         }
+        if (ctx.path === "/delete-user") {
+          const current2 = await api.getSessionFromCtx(ctx, { disableCookieCache: true });
+          if (!current2) return;
+          if (current2.session.impersonatedBy) {
+            throw new api.APIError("FORBIDDEN", { message: "Stop impersonating before deleting an account." });
+          }
+          if (current2.user.role === "admin") {
+            const [{ count }] = await db.select({ count: drizzleOrm.sql`count(*)` }).from(users).where(drizzleOrm.eq(users.role, "admin"));
+            if (Number(count) <= 1) {
+              throw new api.APIError("FORBIDDEN", { message: "You're the only admin. Promote another user to admin first." });
+            }
+          }
+          return;
+        }
         if (ctx.path !== "/admin/stop-impersonating") return;
         const current = await api.getSessionFromCtx(ctx, { disableCookieCache: true });
         if (current == null ? void 0 : current.session.impersonatedBy) {