Resend HTML error - trying to send email with react-email component
Answered
Rhinelander posted this in #help-forum
RhinelanderOP
error
- As far as I know resend auto converts components in to plain text IDK why am I getting this error.
send-reset-password.tsx
email-reset-password.tsx
Type 'Element' is not assignable to type 'string'.ts(2322)
index.d.ts(152, 5): The expected type comes from property 'html' which is declared here on type 'CreateEmailOptions'
(property) html: JSX.Element- As far as I know resend auto converts components in to plain text IDK why am I getting this error.
send-reset-password.tsx
import type { User } from "better-auth";
import { EmailResetPassword } from "../components/email-reset-password";
import { resend } from "../lib/resend";
export const sendResetPassword = async (user: User, url: string) => {
await resend.emails.send({
from: "noreply@example.com",
to: user.email,
subject: "Password reset",
html: <EmailResetPassword name={user.name} url={url} />,
});
};email-reset-password.tsx
import {
Body,
Button,
Column,
Container,
Head,
Html,
Link,
Preview,
Row,
Section,
Text,
} from "@react-email/components";
interface EmailResetPasswordProps {
name?: string;
url?: string;
}
export const EmailResetPassword = ({ name, url }: EmailResetPasswordProps) => {
return (
<Html>
<Head />
<Body style={main}>
...
</Body>
</Html>
);
};
// Styles
...