payload-plugin-newsletter 0.16.9 → 0.17.0

package/CHANGELOG.md

@@ -1,3 +1,46 @@
+## [0.17.0] - 2025-07-29
+
+### Added
+- **Custom Block Email Converter Support** - Added support for custom block email conversion in broadcasts
+  - New `customBlockConverter` option in `BroadcastCustomizations` interface
+  - Allows users to provide their own email conversion logic for custom Lexical blocks
+  - Converter receives block node and media URL, returns email-safe HTML
+  - Supports async operations for fetching external data during conversion
+
+- **Server-Side Email Preview Generation** - Implemented server-side email preview for accurate rendering
+  - New `/api/broadcasts/preview` endpoint for generating email previews
+  - Updated BroadcastInlinePreview component to use server-side preview
+  - Ensures preview exactly matches what will be sent via email
+  - Custom block converters work in both preview and sent emails
+
+### Changed
+- **Email Conversion Functions Now Async** - All email conversion functions are now async to support custom converters
+  - `convertToEmailSafeHtml` and all internal converters are now async
+  - Maintains backward compatibility - existing code continues to work
+  - Enables custom converters to perform async operations like API calls
+
+### Technical
+- Updated `convertNode`, `convertParagraph`, `convertHeading`, etc. to be async functions
+- Added `customBlockConverter` parameter throughout the email conversion pipeline
+- Custom converter is called first, falls back to default handling if it returns empty
+- Error handling for custom converter failures with graceful fallback
+- Preview endpoint uses same conversion logic as email sending for consistency
+
+## [0.16.10] - 2025-01-29
+
+### Fixed
+- **Corrected Syntax Errors** - Fixed TypeScript compilation errors in broadcast afterChange hook
+  - Simplified deferred create logic to avoid nested try-catch blocks
+  - Removed duplicate error handling and extra braces
+  - Fixed all TypeScript compilation errors
+  - Maintained functionality for deferred provider sync
+
+### Technical
+- Cleaned up afterChange hook structure
+- Simplified error handling flow
+- Removed redundant code blocks
+- All TypeScript errors resolved
+
 ## [0.16.9] - 2025-01-29
 
 ### Fixed

package/dist/collections.cjs

@@ -963,62 +963,73 @@ async function convertToEmailSafeHtml(editorState, options) {
   if (!editorState) {
     return "";
   }
-  const rawHtml = await lexicalToEmailHtml(editorState, options?.mediaUrl);
+  const rawHtml = await lexicalToEmailHtml(editorState, options?.mediaUrl, options?.customBlockConverter);
   const sanitizedHtml = import_isomorphic_dompurify.default.sanitize(rawHtml, EMAIL_SAFE_CONFIG);
   if (options?.wrapInTemplate) {
     return wrapInEmailTemplate(sanitizedHtml, options.preheader);
   }
   return sanitizedHtml;
 }
-async function lexicalToEmailHtml(editorState, mediaUrl) {
+async function lexicalToEmailHtml(editorState, mediaUrl, customBlockConverter) {
   const { root } = editorState;
   if (!root || !root.children) {
     return "";
   }
-  const html = root.children.map((node) => convertNode(node, mediaUrl)).join("");
-  return html;
+  const htmlParts = await Promise.all(
+    root.children.map((node) => convertNode(node, mediaUrl, customBlockConverter))
+  );
+  return htmlParts.join("");
 }
-function convertNode(node, mediaUrl) {
+async function convertNode(node, mediaUrl, customBlockConverter) {
   switch (node.type) {
     case "paragraph":
-      return convertParagraph(node, mediaUrl);
+      return convertParagraph(node, mediaUrl, customBlockConverter);
     case "heading":
-      return convertHeading(node, mediaUrl);
+      return convertHeading(node, mediaUrl, customBlockConverter);
     case "list":
-      return convertList(node, mediaUrl);
+      return convertList(node, mediaUrl, customBlockConverter);
     case "listitem":
-      return convertListItem(node, mediaUrl);
+      return convertListItem(node, mediaUrl, customBlockConverter);
     case "blockquote":
-      return convertBlockquote(node, mediaUrl);
+      return convertBlockquote(node, mediaUrl, customBlockConverter);
     case "text":
       return convertText(node);
     case "link":
-      return convertLink(node, mediaUrl);
+      return convertLink(node, mediaUrl, customBlockConverter);
     case "linebreak":
       return "<br>";
     case "upload":
       return convertUpload(node, mediaUrl);
     case "block":
-      return convertBlock(node, mediaUrl);
+      return await convertBlock(node, mediaUrl, customBlockConverter);
     default:
       if (node.children) {
-        return node.children.map((child) => convertNode(child, mediaUrl)).join("");
+        const childParts = await Promise.all(
+          node.children.map((child) => convertNode(child, mediaUrl, customBlockConverter))
+        );
+        return childParts.join("");
       }
       return "";
   }
 }
-function convertParagraph(node, mediaUrl) {
+async function convertParagraph(node, mediaUrl, customBlockConverter) {
   const align = getAlignment(node.format);
-  const children = node.children?.map((child) => convertNode(child, mediaUrl)).join("") || "";
+  const childParts = await Promise.all(
+    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
+  );
+  const children = childParts.join("");
   if (!children.trim()) {
     return '<p style="margin: 0 0 16px 0; min-height: 1em;">&nbsp;</p>';
   }
   return `<p style="margin: 0 0 16px 0; text-align: ${align};">${children}</p>`;
 }
-function convertHeading(node, mediaUrl) {
+async function convertHeading(node, mediaUrl, customBlockConverter) {
   const tag = node.tag || "h1";
   const align = getAlignment(node.format);
-  const children = node.children?.map((child) => convertNode(child, mediaUrl)).join("") || "";
+  const childParts = await Promise.all(
+    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
+  );
+  const children = childParts.join("");
   const styles2 = {
     h1: "font-size: 32px; font-weight: 700; margin: 0 0 24px 0; line-height: 1.2;",
     h2: "font-size: 24px; font-weight: 600; margin: 0 0 16px 0; line-height: 1.3;",
@@ -1027,18 +1038,27 @@ function convertHeading(node, mediaUrl) {
   const style = `${styles2[tag] || styles2.h3} text-align: ${align};`;
   return `<${tag} style="${style}">${children}</${tag}>`;
 }
-function convertList(node, mediaUrl) {
+async function convertList(node, mediaUrl, customBlockConverter) {
   const tag = node.listType === "number" ? "ol" : "ul";
-  const children = node.children?.map((child) => convertNode(child, mediaUrl)).join("") || "";
+  const childParts = await Promise.all(
+    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
+  );
+  const children = childParts.join("");
   const style = tag === "ul" ? "margin: 0 0 16px 0; padding-left: 24px; list-style-type: disc;" : "margin: 0 0 16px 0; padding-left: 24px; list-style-type: decimal;";
   return `<${tag} style="${style}">${children}</${tag}>`;
 }
-function convertListItem(node, mediaUrl) {
-  const children = node.children?.map((child) => convertNode(child, mediaUrl)).join("") || "";
+async function convertListItem(node, mediaUrl, customBlockConverter) {
+  const childParts = await Promise.all(
+    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
+  );
+  const children = childParts.join("");
   return `<li style="margin: 0 0 8px 0;">${children}</li>`;
 }
-function convertBlockquote(node, mediaUrl) {
-  const children = node.children?.map((child) => convertNode(child, mediaUrl)).join("") || "";
+async function convertBlockquote(node, mediaUrl, customBlockConverter) {
+  const childParts = await Promise.all(
+    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
+  );
+  const children = childParts.join("");
   const style = "margin: 0 0 16px 0; padding-left: 16px; border-left: 4px solid #e5e7eb; color: #6b7280;";
   return `<blockquote style="${style}">${children}</blockquote>`;
 }
@@ -1058,8 +1078,11 @@ function convertText(node) {
   }
   return text;
 }
-function convertLink(node, mediaUrl) {
-  const children = node.children?.map((child) => convertNode(child, mediaUrl)).join("") || "";
+async function convertLink(node, mediaUrl, customBlockConverter) {
+  const childParts = await Promise.all(
+    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
+  );
+  const children = childParts.join("");
   const url = node.fields?.url || "#";
   const newTab = node.fields?.newTab ?? false;
   const targetAttr = newTab ? ' target="_blank"' : "";
@@ -1090,8 +1113,18 @@ function convertUpload(node, mediaUrl) {
   }
   return `<div style="margin: 0 0 16px 0; text-align: center;">${imgHtml}</div>`;
 }
-function convertBlock(node, mediaUrl) {
-  const blockType = node.fields?.blockName;
+async function convertBlock(node, mediaUrl, customBlockConverter) {
+  const blockType = node.fields?.blockName || node.blockName;
+  if (customBlockConverter) {
+    try {
+      const customHtml = await customBlockConverter(node, mediaUrl);
+      if (customHtml) {
+        return customHtml;
+      }
+    } catch (error) {
+      console.error(`Custom block converter error for ${blockType}:`, error);
+    }
+  }
   switch (blockType) {
     case "button":
       return convertButtonBlock(node.fields);
@@ -1099,7 +1132,10 @@ function convertBlock(node, mediaUrl) {
       return convertDividerBlock(node.fields);
     default:
       if (node.children) {
-        return node.children.map((child) => convertNode(child, mediaUrl)).join("");
+        const childParts = await Promise.all(
+          node.children.map((child) => convertNode(child, mediaUrl, customBlockConverter))
+        );
+        return childParts.join("");
       }
       return "";
   }
@@ -1473,7 +1509,9 @@ var createBroadcastsCollection = (pluginConfig) => {
               const { BroadcastApiProvider: BroadcastApiProvider2 } = await Promise.resolve().then(() => (init_broadcast2(), broadcast_exports));
               const provider = new BroadcastApiProvider2(providerConfig);
               req.payload.logger.info("Converting content to HTML...");
-              const htmlContent = await convertToEmailSafeHtml(doc.contentSection?.content);
+              const htmlContent = await convertToEmailSafeHtml(doc.contentSection?.content, {
+                customBlockConverter: pluginConfig.customizations?.broadcasts?.customBlockConverter
+              });
               if (!htmlContent || htmlContent.trim() === "") {
                 req.payload.logger.info("Skipping provider sync - content is empty after conversion");
                 return doc;
@@ -1569,77 +1607,49 @@ var createBroadcastsCollection = (pluginConfig) => {
                   req.payload.logger.info("Still missing required fields for provider sync");
                   return doc;
                 }
-                try {
-                  req.payload.logger.info("Creating broadcast in provider (deferred from initial create)...");
-                  const htmlContent = await convertToEmailSafeHtml(doc.contentSection?.content);
-                  if (!htmlContent || htmlContent.trim() === "") {
-                    req.payload.logger.info("Skipping provider sync - content is empty after conversion");
-                    return doc;
-                  }
-                  const createData = {
-                    name: doc.subject,
-                    subject: doc.subject,
-                    preheader: doc.contentSection?.preheader,
-                    content: htmlContent,
-                    trackOpens: doc.settings?.trackOpens,
-                    trackClicks: doc.settings?.trackClicks,
-                    replyTo: doc.settings?.replyTo || providerConfig.replyTo,
-                    audienceIds: doc.audienceIds?.map((a) => a.audienceId)
-                  };
-                  req.payload.logger.info("Creating broadcast with data:", {
-                    name: createData.name,
-                    subject: createData.subject,
-                    preheader: createData.preheader || "NONE",
-                    contentLength: htmlContent ? htmlContent.length : 0,
-                    contentPreview: htmlContent ? htmlContent.substring(0, 100) + "..." : "EMPTY",
-                    apiUrl: providerConfig.apiUrl,
-                    hasToken: !!providerConfig.token
-                  });
-                  const providerBroadcast = await provider.create(createData);
-                  await req.payload.update({
-                    collection: "broadcasts",
-                    id: doc.id,
-                    data: {
-                      providerId: providerBroadcast.id,
-                      providerData: providerBroadcast.providerData
-                    },
-                    req
-                  });
-                  req.payload.logger.info(`Broadcast ${doc.id} created in provider successfully (deferred)`);
-                  return {
-                    ...doc,
-                    providerId: providerBroadcast.id,
-                    providerData: providerBroadcast.providerData
-                  };
-                } catch (error) {
-                  req.payload.logger.error("Raw error from broadcast provider (deferred create):");
-                  req.payload.logger.error(error);
-                  if (error instanceof Error) {
-                    req.payload.logger.error("Error is instance of Error:", {
-                      message: error.message,
-                      stack: error.stack,
-                      name: error.name,
-                      ...error.details,
-                      ...error.response,
-                      ...error.data,
-                      ...error.status,
-                      ...error.statusText
-                    });
-                  } else if (typeof error === "string") {
-                    req.payload.logger.error("Error is a string:", error);
-                  } else if (error && typeof error === "object") {
-                    req.payload.logger.error("Error is an object:", JSON.stringify(error, null, 2));
-                  } else {
-                    req.payload.logger.error("Unknown error type:", typeof error);
-                  }
-                  req.payload.logger.error("Failed broadcast document (deferred create):", {
-                    id: doc.id,
-                    subject: doc.subject,
-                    hasContent: !!doc.contentSection?.content,
-                    contentType: doc.contentSection?.content ? typeof doc.contentSection.content : "none"
-                  });
+                req.payload.logger.info("Creating broadcast in provider (deferred from initial create)...");
+                const htmlContent = await convertToEmailSafeHtml(doc.contentSection?.content, {
+                  customBlockConverter: pluginConfig.customizations?.broadcasts?.customBlockConverter
+                });
+                if (!htmlContent || htmlContent.trim() === "") {
+                  req.payload.logger.info("Skipping provider sync - content is empty after conversion");
                   return doc;
                 }
+                const createData = {
+                  name: doc.subject,
+                  subject: doc.subject,
+                  preheader: doc.contentSection?.preheader,
+                  content: htmlContent,
+                  trackOpens: doc.settings?.trackOpens,
+                  trackClicks: doc.settings?.trackClicks,
+                  replyTo: doc.settings?.replyTo || providerConfig.replyTo,
+                  audienceIds: doc.audienceIds?.map((a) => a.audienceId)
+                };
+                req.payload.logger.info("Creating broadcast with data:", {
+                  name: createData.name,
+                  subject: createData.subject,
+                  preheader: createData.preheader || "NONE",
+                  contentLength: htmlContent ? htmlContent.length : 0,
+                  contentPreview: htmlContent ? htmlContent.substring(0, 100) + "..." : "EMPTY",
+                  apiUrl: providerConfig.apiUrl,
+                  hasToken: !!providerConfig.token
+                });
+                const providerBroadcast = await provider.create(createData);
+                await req.payload.update({
+                  collection: "broadcasts",
+                  id: doc.id,
+                  data: {
+                    providerId: providerBroadcast.id,
+                    providerData: providerBroadcast.providerData
+                  },
+                  req
+                });
+                req.payload.logger.info(`Broadcast ${doc.id} created in provider successfully (deferred)`);
+                return {
+                  ...doc,
+                  providerId: providerBroadcast.id,
+                  providerData: providerBroadcast.providerData
+                };
               }
               if (doc.providerId) {
                 const capabilities = provider.getCapabilities();
@@ -1659,7 +1669,9 @@ var createBroadcastsCollection = (pluginConfig) => {
                     updates.preheader = doc.contentSection?.preheader;
                   }
                   if (JSON.stringify(doc.contentSection?.content) !== JSON.stringify(previousDoc?.contentSection?.content)) {
-                    updates.content = await convertToEmailSafeHtml(doc.contentSection?.content);
+                    updates.content = await convertToEmailSafeHtml(doc.contentSection?.content, {
+                      customBlockConverter: pluginConfig.customizations?.broadcasts?.customBlockConverter
+                    });
                   }
                   if (doc.settings?.trackOpens !== previousDoc?.settings?.trackOpens) {
                     updates.trackOpens = doc.settings.trackOpens;
@@ -1684,16 +1696,32 @@ var createBroadcastsCollection = (pluginConfig) => {
                 }
               }
             } catch (error) {
+              req.payload.logger.error("Raw error from broadcast update operation:");
+              req.payload.logger.error(error);
               if (error instanceof Error) {
-                req.payload.logger.error("Failed to handle broadcast update operation:", {
+                req.payload.logger.error("Error is instance of Error:", {
                   message: error.message,
                   stack: error.stack,
                   name: error.name,
-                  ...error.details
+                  ...error.details,
+                  ...error.response,
+                  ...error.data,
+                  ...error.status,
+                  ...error.statusText
                 });
+              } else if (typeof error === "string") {
+                req.payload.logger.error("Error is a string:", error);
+              } else if (error && typeof error === "object") {
+                req.payload.logger.error("Error is an object:", JSON.stringify(error, null, 2));
               } else {
-                req.payload.logger.error("Failed to handle broadcast update operation:", error);
+                req.payload.logger.error("Unknown error type:", typeof error);
               }
+              req.payload.logger.error("Failed broadcast document (update operation):", {
+                id: doc.id,
+                subject: doc.subject,
+                hasContent: !!doc.contentSection?.content,
+                contentType: doc.contentSection?.content ? typeof doc.contentSection.content : "none"
+              });
             }
           }
           return doc;