Components
<ChangeEmailConfirmationEmail />
Email template for approving an email address change from the current address.
Usage
import { ChangeEmailConfirmationEmail } from "@better-auth-ui/solid/email"
import { render } from "@solidjs-email/main"
const html = await render(() =>
ChangeEmailConfirmationEmail({
url: "https://better-auth-ui.com/api/auth/change-email/verify?token=example-token",
appName: "Better Auth UI",
logoURL: {
light: "/favicon-96x96.png",
dark: "/favicon-96x96-inverted.png"
},
currentEmail: "[email protected]",
newEmail: "[email protected]",
expirationMinutes: 60,
darkMode: true,
poweredBy: true
})
)Better Auth setup
Render this template from user.changeEmail.sendChangeEmailConfirmation and send it to user.email. Better Auth supplies the approval URL and requested address.
sendChangeEmailConfirmation: async ({ user, newEmail, url }) => {
const html = await render(() =>
ChangeEmailConfirmationEmail({
url,
currentEmail: user.email,
newEmail,
appName: "My App"
})
)
await sendEmail({
to: user.email,
subject: "Approve your email change",
html
})
}Use EmailChangedEmail separately if you also send a notification after the address has changed.
Installation
npx shadcn@latest add https://better-auth-ui.com/r/solid/change-email-confirmation-email.jsonProps
Prop
Type
Features
- Shows the current and requested email addresses
- Includes an approval button and fallback URL
- Explains that ignoring the message leaves the address unchanged
- Supports expiration details, theming, branding, and localization
Last updated on