feat (vs-code-ext): do not allow for more than one preview panels open at a time

Author: gabrielmfern

packages/vs-code-extension/src/extension.ts

@@ -66,13 +66,17 @@ export function activate(context: vscode.ExtensionContext) {
   let disposable = vscode.commands.registerCommand(
     "react-email-preview.open",
     () => {
+      if (typeof previewPanel !== 'undefined') return;
+
       previewPanel = vscode.window.createWebviewPanel(
-        "react-email preview",
-        "react-email preview",
+        "react-email preview - try opening an email",
+        "react-email preview - try opening an email",
         vscode.ViewColumn.Two,
         { enableScripts: true },
       );
 
+      previewPanel.onDidDispose(() => previewPanel = undefined);
+
       updatePreviewPanelContent();
 
       vscode.workspace.onDidChangeTextDocument((ev) => {

packages/vs-code-extension/src/renderOpenEmailFile.ts

@@ -5,6 +5,7 @@ import { rm, unlink, writeFile } from "fs/promises";
 import * as esbuild from "esbuild";
 
 import { render } from "@react-email/render";
+import { existsSync } from "fs";
 
 const extensionPreviewFolder = ".vscpreview" as const;
 
@@ -61,7 +62,9 @@ export async function renderOpenEmailFile(
         outfile: builtFileWithCurrentContents,
       });
 
-      await unlink(currentlyOpenTabFilesPathWithCurrentContents); // unlink the temporary file after building it
+      if (existsSync(currentlyOpenTabFilesPathWithCurrentContents)) {
+        await unlink(currentlyOpenTabFilesPathWithCurrentContents); // unlink the temporary file after building it
+      }
 
       delete require.cache[builtFileWithCurrentContents];
       // we need to use require since it has a way to programatically invalidate its cache