Email Changed Email

1import type { ReactNode } from "react"
2import {
3  Body,
4  Button,
5  Container,
6  Head,
7  Heading,
8  Hr,
9  Html,
10  Img,
11  Link,
12  Preview,
13  pixelBasedPreset,
14  Section,
15  Tailwind,
16  Text
17} from "react-email"
18 
19import { cn } from "../../../lib/utils"
20import {
21  type EmailClassNames,
22  type EmailColors,
23  EmailStyles
24} from "./email-styles"
25 
26const emailChangedEmailLocalization = {
27  YOUR_EMAIL_ADDRESS_HAS_BEEN_CHANGED: "Your email address has been changed",
28  LOGO: "Logo",
29  EMAIL_ADDRESS_CHANGED: "Email address changed",
30  EMAIL_ADDRESS_FOR_YOUR_ACCOUNT_CHANGED:
31    "The email address for your {appName} account has been changed.",
32  PREVIOUS_EMAIL: "Previous email:",
33  NEW_EMAIL: "New email:",
34  IF_YOU_MADE_THIS_CHANGE:
35    "If you made this change, you can safely ignore this email.",
36  I_DIDNT_MAKE_THIS_CHANGE: "I didn't make this change",
37  EMAIL_SENT_BY: "Email sent by {appName}.",
38  IF_YOU_DIDNT_AUTHORIZE_THIS_CHANGE:
39    "If you didn't authorize this change, please contact support immediately {supportEmail} to secure your account.",
40  POWERED_BY_BETTER_AUTH: "Powered by {betterAuth}"
41}
42 
43/**
44 * Localization strings for the EmailChangedEmail component.
45 *
46 * Contains all text content used in the email changed notification email template.
47 */
48export type EmailChangedEmailLocalization = typeof emailChangedEmailLocalization
49 
50/**
51 * Props for the EmailChangedEmail component.
52 */
53export interface EmailChangedEmailProps {
54  /** The previous email address that was changed */
55  oldEmail?: string
56  /** The new email address */
57  newEmail?: string
58  /** URL to revert the email change if unauthorized */
59  revertURL?: string
60  /** Name of the application sending the email */
61  appName?: string
62  /** Support email address for security concerns */
63  supportEmail?: string
64  /** Logo URL(s) - a single string or light/dark variants. If omitted, no logo is shown. */
65  logoURL?: string | { light: string; dark: string }
66  /** Custom CSS class names for styling specific parts of the email */
67  classNames?: EmailClassNames
68  /** Custom color scheme for light and dark modes */
69  colors?: EmailColors
70  /** Whether to show the "Powered by better-auth" footer */
71  poweredBy?: boolean
72  /** Whether to enable dark mode support */
73  darkMode?: boolean
74  /** Additional React nodes to inject into the email head */
75  head?: ReactNode
76  /**
77   * Localization overrides for customizing email text
78   * @remarks `EmailChangedEmailLocalization`
79   */
80// … truncated