fix(react-email): ovewriting common user env variable (#2910)

Author: gabrielmfern

.changeset/fuzzy-shoes-wait.md

@@ -0,0 +1,5 @@
+---
+"react-email": patch
+---
+
+fix RESEND_API_KEY being overwritten in email preview

.changeset/sweet-snails-sleep.md

@@ -0,0 +1,5 @@
+---
+"@react-email/preview-server": patch
+---
+
+fix RESEND_API_KEY being overwritten in email preview

packages/preview-server/src/app/env.ts

@@ -1,15 +1,17 @@
 /** ONLY ACCESSIBLE ON THE SERVER */
-export const userProjectLocation = process.env.USER_PROJECT_LOCATION!;
+export const userProjectLocation =
+  process.env.REACT_EMAIL_INTERNAL_USER_PROJECT_LOCATION!;
 
 /** ONLY ACCESSIBLE ON THE SERVER */
-export const previewServerLocation = process.env.PREVIEW_SERVER_LOCATION!;
+export const previewServerLocation =
+  process.env.REACT_EMAIL_INTERNAL_PREVIEW_SERVER_LOCATION!;
 
 /** ONLY ACCESSIBLE ON THE SERVER */
 export const emailsDirectoryAbsolutePath =
-  process.env.EMAILS_DIR_ABSOLUTE_PATH!;
+  process.env.REACT_EMAIL_INTERNAL_EMAILS_DIR_ABSOLUTE_PATH!;
 
 /** ONLY ACCESSIBLE ON THE SERVER */
-export const resendApiKey = process.env.RESEND_API_KEY;
+export const resendApiKey = process.env.REACT_EMAIL_INTERNAL_RESEND_API_KEY;
 
 export const isBuilding = process.env.NEXT_PUBLIC_IS_BUILDING === 'true';
 

packages/react-email/src/commands/build.ts

@@ -34,10 +34,10 @@ const rootDir = ${isInMonorepo ? `'${rootDir.replace(/\\/g, '/')}'` : 'previewSe
 const nextConfig = {
   env: {
     NEXT_PUBLIC_IS_BUILDING: 'true',
-    EMAILS_DIR_RELATIVE_PATH: emailsDirRelativePath,
-    EMAILS_DIR_ABSOLUTE_PATH: path.resolve(userProjectLocation, emailsDirRelativePath),
-    PREVIEW_SERVER_LOCATION: previewServerLocation,
-    USER_PROJECT_LOCATION: userProjectLocation
+    REACT_EMAIL_INTERNAL_EMAILS_DIR_RELATIVE_PATH: emailsDirRelativePath,
+    REACT_EMAIL_INTERNAL_EMAILS_DIR_ABSOLUTE_PATH: path.resolve(userProjectLocation, emailsDirRelativePath),
+    REACT_EMAIL_INTERNAL_PREVIEW_SERVER_LOCATION: previewServerLocation,
+    REACT_EMAIL_INTERNAL_USER_PROJECT_LOCATION: userProjectLocation
   },
   turbopack: {
     root: rootDir,

packages/react-email/src/utils/preview/get-env-variables-for-preview-app.ts

@@ -7,10 +7,14 @@ export const getEnvVariablesForPreviewApp = (
   resendApiKey?: string,
 ) => {
   return {
-    EMAILS_DIR_RELATIVE_PATH: relativePathToEmailsDirectory,
-    EMAILS_DIR_ABSOLUTE_PATH: path.resolve(cwd, relativePathToEmailsDirectory),
-    PREVIEW_SERVER_LOCATION: previewServerLocation,
-    USER_PROJECT_LOCATION: cwd,
-    RESEND_API_KEY: resendApiKey,
+    REACT_EMAIL_INTERNAL_EMAILS_DIR_RELATIVE_PATH:
+      relativePathToEmailsDirectory,
+    REACT_EMAIL_INTERNAL_EMAILS_DIR_ABSOLUTE_PATH: path.resolve(
+      cwd,
+      relativePathToEmailsDirectory,
+    ),
+    REACT_EMAIL_INTERNAL_PREVIEW_SERVER_LOCATION: previewServerLocation,
+    REACT_EMAIL_INTERNAL_USER_PROJECT_LOCATION: cwd,
+    REACT_EMAIL_INTERNAL_RESEND_API_KEY: resendApiKey,
   } as const;
 };