External/portabase
1
0
Fork 0
mirror of https://github.com/Portabase/portabase.git synced 2026-07-14 11:16:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

Working on sending email. Now ok.

Browse Source
This commit is contained in:
charles-gauthereau
2024-11-17 19:24:59 +01:00
parent 0de1c4daa2
commit b5b71b6ca5
7 changed files with 45 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
emails/EmailLayout.tsx
+1 -4
View File
@@ -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"
/> />
emails/HelloEmail.tsx
+16
View File
@@ -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>
);
}
emails/TestEmailSettings.tsx
+19 -5
View File
@@ -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
</Text> >
Best regard,
</Text> <Text
className="text-base font-light leading-8 text-green-800 "
>
Portabase
</Text>
</EmailLayout> </EmailLayout>
); );
}; };
export default TestEmailSettings; export default TestEmailSettings;
package.json
+3 -1
View File
@@ -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",
src/components/wrappers/Dashboard/Settings/SettingsEmailTab/SettingsEmailTab.tsx
+3 -3
View File
@@ -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,8 +21,8 @@ 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){
toast.success("Test Email Successfully sent !"); toast.success("Test Email Successfully sent !");
@@ -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()
} }
src/env.mjs
+3
View File
@@ -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).
src/utils/email-helper.ts
-7
View File
@@ -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