mirror of
https://github.com/Portabase/portabase.git
synced 2026-07-14 11:16:13 +02:00
Working on sending email. Now ok.
This commit is contained in:
@@ -1,15 +1,12 @@
|
|||||||
import {
|
import {
|
||||||
Body,
|
Body,
|
||||||
Button,
|
|
||||||
Container,
|
Container,
|
||||||
Head,
|
Head,
|
||||||
Html,
|
Html,
|
||||||
Img,
|
Img,
|
||||||
Link,
|
|
||||||
Preview,
|
Preview,
|
||||||
Section,
|
Section,
|
||||||
Tailwind,
|
Tailwind,
|
||||||
Text,
|
|
||||||
} from "@react-email/components";
|
} from "@react-email/components";
|
||||||
import * as React from "react";
|
import * as React from "react";
|
||||||
import { PropsWithChildren } from "react";
|
import { PropsWithChildren } from "react";
|
||||||
@@ -31,7 +28,7 @@ export const EmailLayout = ({ children, preview }: PropsWithChildren<{ preview?:
|
|||||||
<Container className="bg-white border border-gray-200 p-12">
|
<Container className="bg-white border border-gray-200 p-12">
|
||||||
<Img
|
<Img
|
||||||
src={`${baseUrl}/logo-title-black.png`}
|
src={`${baseUrl}/logo-title-black.png`}
|
||||||
width="400"
|
width="200"
|
||||||
height="auto"
|
height="auto"
|
||||||
alt="Logo"
|
alt="Logo"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -0,0 +1,16 @@
|
|||||||
|
import { Button } from "@react-email/button";
|
||||||
|
import { Html } from "@react-email/html";
|
||||||
|
import * as React from "react";
|
||||||
|
|
||||||
|
export default function HelloEmail() {
|
||||||
|
return (
|
||||||
|
<Html>
|
||||||
|
<Button
|
||||||
|
href="https://example.com"
|
||||||
|
style={{ background: "#000", color: "#fff" }}
|
||||||
|
>
|
||||||
|
Hello Charles
|
||||||
|
</Button>
|
||||||
|
</Html>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -3,26 +3,40 @@ import {
|
|||||||
} from "@react-email/components";
|
} from "@react-email/components";
|
||||||
import * as React from "react";
|
import * as React from "react";
|
||||||
import EmailLayout from "./EmailLayout";
|
import EmailLayout from "./EmailLayout";
|
||||||
|
import {Button} from "@react-email/button";
|
||||||
|
|
||||||
|
|
||||||
export const TestEmailSettings = () => {
|
export const TestEmailSettings = () => {
|
||||||
return (
|
return (
|
||||||
<EmailLayout
|
<EmailLayout
|
||||||
preview="Test Email"
|
preview="Email Setup"
|
||||||
>
|
>
|
||||||
|
|
||||||
<Text
|
<Text
|
||||||
className="text-base font-light leading-8 text-green-800 "
|
className="text-base font-light leading-8 text-green-800 "
|
||||||
|
|
||||||
>
|
>
|
||||||
Hi, this is a test email for settings and alerts !
|
Hi, your email settings are setup !
|
||||||
</Text>
|
</Text>
|
||||||
|
|
||||||
|
|
||||||
<Text
|
<Text
|
||||||
className="text-base font-light leading-8 text-green-800 ">
|
className="text-base font-light leading-8 text-green-800 "
|
||||||
Soluce Technologies | Portabase
|
|
||||||
|
>
|
||||||
|
Best regard,
|
||||||
|
</Text> <Text
|
||||||
|
className="text-base font-light leading-8 text-green-800 "
|
||||||
|
|
||||||
|
>
|
||||||
|
Portabase
|
||||||
</Text>
|
</Text>
|
||||||
|
|
||||||
</EmailLayout>
|
</EmailLayout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export default TestEmailSettings;
|
export default TestEmailSettings;
|
||||||
|
|||||||
+3
-1
@@ -6,7 +6,9 @@
|
|||||||
"dev": "next dev -p 80",
|
"dev": "next dev -p 80",
|
||||||
"build": "next build",
|
"build": "next build",
|
||||||
"start": "next start",
|
"start": "next start",
|
||||||
"lint": "next lint"
|
"lint": "next lint",
|
||||||
|
"email": "email dev"
|
||||||
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@auth/prisma-adapter": "^2.4.1",
|
"@auth/prisma-adapter": "^2.4.1",
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ import {sendEmail} from "@/utils/email-helper";
|
|||||||
import TestEmailSettings from "../../../../../../emails/TestEmailSettings";
|
import TestEmailSettings from "../../../../../../emails/TestEmailSettings";
|
||||||
import {render} from "@react-email/render";
|
import {render} from "@react-email/render";
|
||||||
import {toast} from "sonner";
|
import {toast} from "sonner";
|
||||||
|
import HelloEmail from "../../../../../../emails/HelloEmail";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -20,7 +21,7 @@ export const SettingsEmailTab = (props: SettingsEmailTabProps) => {
|
|||||||
mutationFn: async () => {
|
mutationFn: async () => {
|
||||||
const email = await sendEmail({
|
const email = await sendEmail({
|
||||||
to: props.settings.smtpUser,
|
to: props.settings.smtpUser,
|
||||||
subject: "Portabase email test !",
|
subject: "Portabase",
|
||||||
html: await render(TestEmailSettings(),{})
|
html: await render(TestEmailSettings(),{})
|
||||||
});
|
});
|
||||||
if(email.response){
|
if(email.response){
|
||||||
@@ -32,7 +33,6 @@ export const SettingsEmailTab = (props: SettingsEmailTabProps) => {
|
|||||||
|
|
||||||
|
|
||||||
const handleSendMailTest = async () => {
|
const handleSendMailTest = async () => {
|
||||||
console.log("Sending email test...");
|
|
||||||
await mutation.mutateAsync()
|
await mutation.mutateAsync()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -11,6 +11,8 @@ export const env = createEnv({
|
|||||||
DATABASE_URL: z.string().url(),
|
DATABASE_URL: z.string().url(),
|
||||||
NEXT_PUBLIC_SECRET: z.string(),
|
NEXT_PUBLIC_SECRET: z.string(),
|
||||||
NEXTAUTH_URL: z.string(),
|
NEXTAUTH_URL: z.string(),
|
||||||
|
NEXT_PUBLIC_DOMAIN_NAME: z.string(),
|
||||||
|
|
||||||
|
|
||||||
SMTP_PASSWORD: z.string().optional(),
|
SMTP_PASSWORD: z.string().optional(),
|
||||||
SMTP_FROM: z.string().optional(),
|
SMTP_FROM: z.string().optional(),
|
||||||
@@ -29,6 +31,7 @@ export const env = createEnv({
|
|||||||
S3_USE_SSL: z.string().optional(),
|
S3_USE_SSL: z.string().optional(),
|
||||||
|
|
||||||
STORAGE_TYPE: z.string().optional(),
|
STORAGE_TYPE: z.string().optional(),
|
||||||
|
|
||||||
},
|
},
|
||||||
/*
|
/*
|
||||||
* Environment variables available on the client (and server).
|
* Environment variables available on the client (and server).
|
||||||
|
|||||||
@@ -2,14 +2,12 @@
|
|||||||
import {prisma} from "@/prisma";
|
import {prisma} from "@/prisma";
|
||||||
import nodemailer from "nodemailer";
|
import nodemailer from "nodemailer";
|
||||||
|
|
||||||
|
|
||||||
type Payload = {
|
type Payload = {
|
||||||
to: string;
|
to: string;
|
||||||
subject: string;
|
subject: string;
|
||||||
html: any
|
html: any
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
export const sendEmail = async (data: Payload) => {
|
export const sendEmail = async (data: Payload) => {
|
||||||
|
|
||||||
const settings = await prisma.settings.findUnique({
|
const settings = await prisma.settings.findUnique({
|
||||||
@@ -18,7 +16,6 @@ export const sendEmail = async (data: Payload) => {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
const smtpSettings = {
|
const smtpSettings = {
|
||||||
host: settings.smtpHost,
|
host: settings.smtpHost,
|
||||||
port: parseInt(settings.smtpPort),
|
port: parseInt(settings.smtpPort),
|
||||||
@@ -28,15 +25,11 @@ export const sendEmail = async (data: Payload) => {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
// Create a transporter object using nodemailer
|
// Create a transporter object using nodemailer
|
||||||
const transporter = nodemailer.createTransport({
|
const transporter = nodemailer.createTransport({
|
||||||
...smtpSettings
|
...smtpSettings
|
||||||
});
|
});
|
||||||
|
|
||||||
// Render the React component to HTML
|
|
||||||
// const emailHtml = await render(HelloEmail(), {});
|
|
||||||
|
|
||||||
// Set up email options
|
// Set up email options
|
||||||
const mailOptions = {
|
const mailOptions = {
|
||||||
...data
|
...data
|
||||||
|
|||||||
Reference in New Issue
Block a user