vynte-infra/plunk
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: Added ability to overwrite sender mail and name for templates and campaigns

Browse Source
This commit is contained in:
Dries Augustyns
2024-09-24 17:19:55 +02:00
parent 213081174d
commit f1d4d5073c
11 changed files with 259 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/api/src/controllers/Tasks.ts
+11 -2
View File
@@ -41,6 +41,9 @@ export class Tasks {
let subject = "";
let body = "";
let email = "";
let name = "";
if (action) {
const { template, notevents } = action;
@@ -52,6 +55,9 @@ export class Tasks {
}
}
email = project.verified && project.email ? template.email ?? project.email : "[email protected]";
name = template.from ?? project.from ?? project.name;
({ subject, body } = EmailService.format({
subject: template.subject,
body: template.body,
@@ -62,6 +68,9 @@ export class Tasks {
},
}));
} else if (campaign) {
email = project.verified && project.email ? campaign.email ?? project.email : "[email protected]";
name = campaign.from ?? project.from ?? project.name;
({ subject, body } = EmailService.format({
subject: campaign.subject,
body: campaign.body,
@@ -75,8 +84,8 @@ export class Tasks {
const { messageId } = await EmailService.send({
from: {
name: project.from ?? project.name,
email: project.verified && project.email ? project.email : "[email protected]",
name,
email,
},
to: [contact.email],
content: {
packages/api/src/controllers/v1/Campaigns.ts
+24 -3
View File
@@ -3,7 +3,7 @@ import { CampaignSchemas, UtilitySchemas } from "@plunk/shared";
import dayjs from "dayjs";
import type { Request, Response } from "express";
import { prisma } from "../../database/prisma";
import { HttpException, NotFound } from "../../exceptions";
import { HttpException, NotAllowed, NotFound } from "../../exceptions";
import { type IJwt, type ISecret, isAuthenticated, isValidSecretKey } from "../../middleware/auth";
import { CampaignService } from "../../services/CampaignService";
import { ContactService } from "../../services/ContactService";
@@ -160,6 +160,7 @@ export class Campaigns {
subject: campaign.subject,
body: campaign.body,
style: campaign.style,
email: campaign.email,
},
});
@@ -180,7 +181,15 @@ export class Campaigns {
throw new NotFound("project");
}
let { subject, body, recipients, style } = CampaignSchemas.create.parse(req.body);
let { subject, body, recipients, style, email, from } = CampaignSchemas.create.parse(req.body);
if (email && !project.verified) {
throw new NotAllowed("You need to attach a domain to your project to customize the sender address");
}
if (email && email.split("@")[1] !== project.email?.split("@")[1]) {
throw new NotAllowed("The sender address must be the same domain as the project's email address");
}
if (recipients.length === 1 && recipients[0] === "all") {
const projectContacts = await prisma.contact.findMany({
@@ -197,6 +206,8 @@ export class Campaigns {
subject,
body,
style,
from: from === "" ? null : from,
email: email === "" ? null : email,
},
});
@@ -253,7 +264,15 @@ export class Campaigns {
throw new NotFound("project");
}
let { id, subject, body, recipients, style } = CampaignSchemas.update.parse(req.body);
let { id, subject, body, recipients, style, email, from } = CampaignSchemas.update.parse(req.body);
if (email && !project.verified) {
throw new NotAllowed("You need to attach a domain to your project to customize the sender address");
}
if (email && email.split("@")[1] !== project.email?.split("@")[1]) {
throw new NotAllowed("The sender address must be the same domain as the project's email address");
}
if (recipients.length === 1 && recipients[0] === "all") {
const projectContacts = await prisma.contact.findMany({
@@ -276,6 +295,8 @@ export class Campaigns {
subject,
body,
style,
from: from === "" ? null : from,
email: email === "" ? null : email,
},
include: {
recipients: { select: { id: true } },
packages/api/src/controllers/v1/Templates.ts
+29 -3
View File
@@ -60,6 +60,7 @@ export class Templates {
body: template.body,
type: template.type,
style: template.style,
email: template.email,
},
});
@@ -101,7 +102,15 @@ export class Templates {
throw new NotFound("project");
}
const { subject, body, type, style } = TemplateSchemas.create.parse(req.body);
const { subject, body, type, style, email, from } = TemplateSchemas.create.parse(req.body);
if (email && !project.verified) {
throw new NotAllowed("You need to attach a domain to your project to customize the sender address");
}
if (email && email.split("@")[1] !== project.email?.split("@")[1]) {
throw new NotAllowed("The sender address must be the same domain as the project's email address");
}
const template = await prisma.template.create({
data: {
@@ -110,6 +119,8 @@ export class Templates {
body,
type,
style,
from: from === "" ? null : from,
email: email === "" ? null : email,
},
});
@@ -151,7 +162,7 @@ export class Templates {
throw new NotFound("project");
}
const { id, subject, body, type, style } = TemplateSchemas.update.parse(req.body);
const { id, subject, body, type, style, email, from } = TemplateSchemas.update.parse(req.body);
let template = await TemplateService.id(id);
@@ -159,9 +170,24 @@ export class Templates {
throw new NotFound("template");
}
if (email && !project.verified) {
throw new NotAllowed("You need to attach a domain to your project to customize the sender address");
}
if (email && email.split("@")[1] !== project.email?.split("@")[1]) {
throw new NotAllowed("The sender address must be the same domain as the project's email address");
}
template = await prisma.template.update({
where: { id },
data: { subject, body, type, style },
data: {
subject,
body,
type,
style,
from: from === "" ? null : from,
email: email === "" ? null : email,
},
include: {
actions: true,
},
packages/api/src/services/ActionService.ts
+2 -2
View File
@@ -120,8 +120,8 @@ export class ActionService {
const { messageId } = await EmailService.send({
from: {
name: project.from ?? project.name,
email: project.verified && project.email ? project.email : "[email protected]",
name: action.template.from ?? project.from ?? project.name,
email: project.verified && project.email ? action.template.email ?? project.email : "[email protected]",
},
to: [contact.email],
content: {
packages/dashboard/src/pages/campaigns/[id].tsx
+48 -7
View File
@@ -32,6 +32,8 @@ import { network } from "../../lib/network";
interface CampaignValues {
subject: string;
body: string;
email?: string;
from?: string;
recipients: string[];
style: "PLUNK" | "HTML";
}
@@ -71,6 +73,8 @@ export default function Index() {
watch,
reset,
setValue,
setError,
clearErrors,
} = useForm<CampaignValues>({
resolver: zodResolver(CampaignSchemas.update),
defaultValues: { recipients: [], body: undefined },
@@ -87,6 +91,21 @@ export default function Index() {
});
}, [reset, campaign]);
useEffect(() => {
watch((value, { name, type }) => {
if (name === "email") {
if (value.email && project?.email && !value.email.endsWith(project.email.split("@")[1])) {
setError("email", {
type: "manual",
message: `The sender address must end with @${project.email?.split("@")[1]}`,
});
} else {
clearErrors("email");
}
}
});
}, [watch, project, setError, clearErrors]);
if (!project || !campaign || !events || (watch("body") as string | undefined) === undefined) {
return <FullscreenLoader />;
}
@@ -404,13 +423,35 @@ export default function Index() {
}
>
<form onSubmit={handleSubmit(update)} className="space-6 grid gap-6 sm:grid-cols-6">
<Input
className={"sm:col-span-6"}
label={"Subject"}
placeholder={`Welcome to ${project.name}!`}
register={register("subject")}
error={errors.subject}
/>
<div className={"sm:col-span-6 grid sm:grid-cols-6 gap-6"}>
<Input
className={"sm:col-span-6"}
label={"Subject"}
placeholder={`Welcome to ${project.name}!`}
register={register("subject")}
error={errors.subject}
/>
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Email"}
placeholder={`${project.email}`}
register={register("email")}
error={errors.email}
/>
)}
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Name"}
placeholder={`${project.name}`}
register={register("from")}
error={errors.from}
/>
)}
</div>
{contacts ? (
<>
packages/dashboard/src/pages/campaigns/new.tsx
+50 -8
View File
@@ -6,7 +6,7 @@ import dayjs from "dayjs";
import { AnimatePresence, motion } from "framer-motion";
import { Search, Users2, XIcon } from "lucide-react";
import { useRouter } from "next/router";
import React, { useState } from "react";
import React, { useEffect, useState } from "react";
import { type FieldError, useForm } from "react-hook-form";
import { toast } from "sonner";
import { Alert, Card, Dropdown, Editor, FullscreenLoader, Input, MultiselectDropdown } from "../../components";
@@ -20,6 +20,8 @@ import { network } from "../../lib/network";
interface CampaignValues {
subject: string;
body: string;
email?: string;
from?: string;
recipients: string[];
style: "PLUNK" | "HTML";
}
@@ -58,6 +60,8 @@ export default function Index() {
formState: { errors },
setValue,
watch,
setError,
clearErrors,
} = useForm<CampaignValues>({
resolver: zodResolver(CampaignSchemas.create),
defaultValues: {
@@ -67,6 +71,21 @@ export default function Index() {
},
});
useEffect(() => {
watch((value, { name, type }) => {
if (name === "email") {
if (value.email && project?.email && !value.email.endsWith(project.email.split("@")[1])) {
setError("email", {
type: "manual",
message: `The sender address must end with @${project.email?.split("@")[1]}`,
});
} else {
clearErrors("email");
}
}
});
}, [watch, project, setError, clearErrors]);
if (!project || !events) {
return <FullscreenLoader />;
}
@@ -194,13 +213,36 @@ export default function Index() {
<Dashboard>
<Card title={"Create a new campaign"}>
<form onSubmit={handleSubmit(create)} className="space-6 grid gap-6 sm:grid-cols-6">
<Input
className={"sm:col-span-6"}
label={"Subject"}
placeholder={`Welcome to ${project.name}!`}
register={register("subject")}
error={errors.subject}
/>
<div className={"sm:col-span-6 grid sm:grid-cols-6 gap-6"}>
<Input
className={"sm:col-span-6"}
label={"Subject"}
placeholder={`Welcome to ${project.name}!`}
register={register("subject")}
error={errors.subject}
/>
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Email"}
placeholder={`${project.email}`}
register={register("email")}
error={errors.email}
/>
)}
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Name"}
placeholder={`${project.name}`}
register={register("from")}
error={errors.from}
/>
)}
</div>
{contacts ? (
<>
<div className={"sm:col-span-3"}>
packages/dashboard/src/pages/templates/[id].tsx
+39
View File
@@ -16,6 +16,8 @@ import { network } from "../../lib/network";
interface TemplateValues {
subject: string;
body: string;
email?: string;
from?: string;
type: "MARKETING" | "TRANSACTIONAL";
style: "PLUNK" | "HTML";
}
@@ -41,6 +43,8 @@ export default function Index() {
watch,
setValue,
reset,
setError,
clearErrors,
} = useForm<TemplateValues>({
resolver: zodResolver(TemplateSchemas.update),
defaultValues: {
@@ -56,6 +60,21 @@ export default function Index() {
reset(template);
}, [reset, template]);
useEffect(() => {
watch((value, { name, type }) => {
if (name === "email") {
if (value.email && project?.email && !value.email.endsWith(project.email.split("@")[1])) {
setError("email", {
type: "manual",
message: `The sender address must end with @${project.email?.split("@")[1]}`,
});
} else {
clearErrors("email");
}
}
});
}, [watch, project, setError, clearErrors]);
if (!project || !template || (watch("body") as string | undefined) === undefined) {
return <FullscreenLoader />;
}
@@ -248,6 +267,26 @@ export default function Index() {
</AnimatePresence>
</div>
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Email"}
placeholder={`${project.email}`}
register={register("email")}
error={errors.email}
/>
)}
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Name"}
placeholder={`${project.name}`}
register={register("from")}
error={errors.from}
/>
)}
<div className={"sm:col-span-6"}>
<Editor
value={watch("body")}
packages/dashboard/src/pages/templates/new.tsx
+40 -1
View File
@@ -3,7 +3,7 @@ import { TemplateSchemas } from "@plunk/shared";
import type { Template } from "@prisma/client";
import { AnimatePresence, motion } from "framer-motion";
import { useRouter } from "next/router";
import React from "react";
import React, { useEffect } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { Card, Dropdown, Editor, FullscreenLoader, Input, Tooltip } from "../../components";
@@ -15,6 +15,8 @@ import { network } from "../../lib/network";
interface TemplateValues {
subject: string;
body: string;
email?: string;
from?: string;
type: "MARKETING" | "TRANSACTIONAL";
style: "PLUNK" | "HTML";
}
@@ -41,6 +43,8 @@ export default function Index() {
formState: { errors },
watch,
setValue,
setError,
clearErrors,
} = useForm<TemplateValues>({
resolver: zodResolver(TemplateSchemas.create),
defaultValues: {
@@ -50,6 +54,21 @@ export default function Index() {
},
});
useEffect(() => {
watch((value, { name, type }) => {
if (name === "email") {
if (value.email && project?.email && !value.email.endsWith(project.email.split("@")[1])) {
setError("email", {
type: "manual",
message: `The sender address must end with @${project.email?.split("@")[1]}`,
});
} else {
clearErrors("email");
}
}
});
}, [watch, project, setError, clearErrors]);
if (!project) {
return <FullscreenLoader />;
}
@@ -141,6 +160,26 @@ export default function Index() {
</AnimatePresence>
</div>
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Email"}
placeholder={`${project.email}`}
register={register("email")}
error={errors.email}
/>
)}
{project.verified && (
<Input
className={"sm:col-span-3"}
label={"Sender Name"}
placeholder={`${project.name}`}
register={register("from")}
error={errors.from}
/>
)}
<div className={"sm:col-span-6"}>
<Editor
value={watch("body")}
packages/shared/src/index.ts
+8
View File
@@ -133,6 +133,8 @@ export const CampaignSchemas = {
.min(1, "Subject needs to be at least 1 character long")
.max(70, "Subject needs to be less than 70 characters long"),
body: z.string().min(1, "Body needs to be at least 1 character long"),
email: email.nullish().or(z.literal("")),
from: z.string().nullish(),
recipients: z.array(z.string()),
style: z.nativeEnum(TemplateStyle).default("PLUNK"),
}),
@@ -143,6 +145,8 @@ export const CampaignSchemas = {
.min(1, "Subject needs to be at least 1 character long")
.max(70, "Subject needs to be less than 70 characters long"),
body: z.string().min(1, "Body needs to be at least 1 character long"),
email: email.nullish().or(z.literal("")),
from: z.string().nullish(),
recipients: z.array(z.string()),
style: z.nativeEnum(TemplateStyle).default("PLUNK"),
}),
@@ -208,6 +212,8 @@ export const TemplateSchemas = {
create: z.object({
subject: z.string().min(1, "Subject can't be empty").max(70, "Subject needs to be less than 70 characters long"),
body: z.string().min(1, "Body can't be empty"),
email: email.nullish().or(z.literal("")),
from: z.string().nullish(),
type: z.nativeEnum(TemplateType).default("MARKETING"),
style: z.nativeEnum(TemplateStyle).default("PLUNK"),
}),
@@ -215,6 +221,8 @@ export const TemplateSchemas = {
id,
subject: z.string().min(1, "Subject can't be empty").max(70, "Subject needs to be less than 70 characters long"),
body: z.string().min(1, "Body can't be empty"),
email: email.nullish().or(z.literal("")),
from: z.string().nullish(),
type: z.nativeEnum(TemplateType).default("MARKETING"),
style: z.nativeEnum(TemplateStyle).default("PLUNK"),
}),