@nestjs-ssr/react 0.2.1 → 0.2.2

package/dist/index.js

@@ -7,12 +7,13 @@ var path = require('path');
 var devalue = require('devalue');
 var escapeHtml = require('escape-html');
 var server = require('react-dom/server');
-var react = require('react');
+var React = require('react');
 var operators = require('rxjs/operators');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var escapeHtml__default = /*#__PURE__*/_interopDefault(escapeHtml);
+var React__default = /*#__PURE__*/_interopDefault(React);
 
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
@@ -191,18 +192,16 @@ window.__LAYOUTS__ = ${devalue.uneval(layoutMetadata)};
 exports.TemplateParserService = _ts_decorate([
   common.Injectable()
 ], exports.TemplateParserService);
-
-// src/render/error-pages/error-page-development.tsx
 function ErrorPageDevelopment({ error, viewPath, phase }) {
   const stackLines = error.stack ? error.stack.split("\n").slice(1) : [];
-  return /* @__PURE__ */ React.createElement("html", {
+  return /* @__PURE__ */ React__default.default.createElement("html", {
     lang: "en"
-  }, /* @__PURE__ */ React.createElement("head", null, /* @__PURE__ */ React.createElement("meta", {
+  }, /* @__PURE__ */ React__default.default.createElement("head", null, /* @__PURE__ */ React__default.default.createElement("meta", {
     charSet: "UTF-8"
-  }), /* @__PURE__ */ React.createElement("meta", {
+  }), /* @__PURE__ */ React__default.default.createElement("meta", {
     name: "viewport",
     content: "width=device-width, initial-scale=1.0"
-  }), /* @__PURE__ */ React.createElement("title", null, `SSR Error - ${error.name}`), /* @__PURE__ */ React.createElement("style", {
+  }), /* @__PURE__ */ React__default.default.createElement("title", null, `SSR Error - ${error.name}`), /* @__PURE__ */ React__default.default.createElement("style", {
     dangerouslySetInnerHTML: {
       __html: `
               body {
@@ -253,30 +252,28 @@ function ErrorPageDevelopment({ error, viewPath, phase }) {
               }
             `
     }
-  })), /* @__PURE__ */ React.createElement("body", null, /* @__PURE__ */ React.createElement("div", {
+  })), /* @__PURE__ */ React__default.default.createElement("body", null, /* @__PURE__ */ React__default.default.createElement("div", {
     className: "error-container"
-  }, /* @__PURE__ */ React.createElement("h1", null, "Server-Side Rendering Error"), /* @__PURE__ */ React.createElement("div", {
+  }, /* @__PURE__ */ React__default.default.createElement("h1", null, "Server-Side Rendering Error"), /* @__PURE__ */ React__default.default.createElement("div", {
     className: "error-type"
-  }, error.name), /* @__PURE__ */ React.createElement("div", {
+  }, error.name), /* @__PURE__ */ React__default.default.createElement("div", {
     className: "error-message"
-  }, error.message), /* @__PURE__ */ React.createElement("h2", null, "Stack Trace"), /* @__PURE__ */ React.createElement("div", {
+  }, error.message), /* @__PURE__ */ React__default.default.createElement("h2", null, "Stack Trace"), /* @__PURE__ */ React__default.default.createElement("div", {
     className: "stack-trace"
-  }, /* @__PURE__ */ React.createElement("pre", null, stackLines.join("\n"))), /* @__PURE__ */ React.createElement("div", {
+  }, /* @__PURE__ */ React__default.default.createElement("pre", null, stackLines.join("\n"))), /* @__PURE__ */ React__default.default.createElement("div", {
     className: "meta"
-  }, /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("strong", null, "View Path:"), " ", viewPath), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("strong", null, "Error Phase:"), " ", phase === "shell" ? "Shell (before streaming started)" : "Streaming (during content delivery)"), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("strong", null, "Environment:"), " Development")))));
+  }, /* @__PURE__ */ React__default.default.createElement("p", null, /* @__PURE__ */ React__default.default.createElement("strong", null, "View Path:"), " ", viewPath), /* @__PURE__ */ React__default.default.createElement("p", null, /* @__PURE__ */ React__default.default.createElement("strong", null, "Error Phase:"), " ", phase === "shell" ? "Shell (before streaming started)" : "Streaming (during content delivery)"), /* @__PURE__ */ React__default.default.createElement("p", null, /* @__PURE__ */ React__default.default.createElement("strong", null, "Environment:"), " Development")))));
 }
 __name(ErrorPageDevelopment, "ErrorPageDevelopment");
-
-// src/render/error-pages/error-page-production.tsx
 function ErrorPageProduction() {
-  return /* @__PURE__ */ React.createElement("html", {
+  return /* @__PURE__ */ React__default.default.createElement("html", {
     lang: "en"
-  }, /* @__PURE__ */ React.createElement("head", null, /* @__PURE__ */ React.createElement("meta", {
+  }, /* @__PURE__ */ React__default.default.createElement("head", null, /* @__PURE__ */ React__default.default.createElement("meta", {
     charSet: "UTF-8"
-  }), /* @__PURE__ */ React.createElement("meta", {
+  }), /* @__PURE__ */ React__default.default.createElement("meta", {
     name: "viewport",
     content: "width=device-width, initial-scale=1.0"
-  }), /* @__PURE__ */ React.createElement("title", null, "Error"), /* @__PURE__ */ React.createElement("style", {
+  }), /* @__PURE__ */ React__default.default.createElement("title", null, "Error"), /* @__PURE__ */ React__default.default.createElement("style", {
     dangerouslySetInnerHTML: {
       __html: `
               body {
@@ -303,9 +300,9 @@ function ErrorPageProduction() {
               }
             `
     }
-  })), /* @__PURE__ */ React.createElement("body", null, /* @__PURE__ */ React.createElement("div", {
+  })), /* @__PURE__ */ React__default.default.createElement("body", null, /* @__PURE__ */ React__default.default.createElement("div", {
     className: "error-container"
-  }, /* @__PURE__ */ React.createElement("h1", null, "500"), /* @__PURE__ */ React.createElement("p", null, "Internal Server Error"), /* @__PURE__ */ React.createElement("p", null, "Something went wrong while rendering this page."))));
+  }, /* @__PURE__ */ React__default.default.createElement("h1", null, "500"), /* @__PURE__ */ React__default.default.createElement("p", null, "Internal Server Error"), /* @__PURE__ */ React__default.default.createElement("p", null, "Something went wrong while rendering this page."))));
 }
 __name(ErrorPageProduction, "ErrorPageProduction");
 
@@ -364,7 +361,7 @@ exports.StreamingErrorHandler = class _StreamingErrorHandler {
   */
   renderDevelopmentErrorPage(error, viewPath, phase) {
     const ErrorComponent = this.errorPageDevelopment || ErrorPageDevelopment;
-    const element = react.createElement(ErrorComponent, {
+    const element = React.createElement(ErrorComponent, {
       error,
       viewPath,
       phase
@@ -376,7 +373,7 @@ exports.StreamingErrorHandler = class _StreamingErrorHandler {
   */
   renderProductionErrorPage() {
     const ErrorComponent = this.errorPageProduction || ErrorPageProduction;
-    const element = react.createElement(ErrorComponent);
+    const element = React.createElement(ErrorComponent);
     return "<!DOCTYPE html>\n" + server.renderToStaticMarkup(element);
   }
 };
@@ -677,60 +674,79 @@ exports.RenderService = class _RenderService {
   async renderToStream(viewComponent, data = {}, res, head) {
     const startTime = Date.now();
     let shellReadyTime = 0;
-    try {
-      let template = this.template;
-      if (this.vite) {
-        template = await this.vite.transformIndexHtml("/", template);
-      }
-      const templateParts = this.templateParser.parseTemplate(template);
-      let renderModule;
-      if (this.vite) {
-        renderModule = await this.vite.ssrLoadModule(this.entryServerPath);
-      } else {
-        if (this.serverManifest) {
-          const manifestEntry = Object.entries(this.serverManifest).find(([key, value]) => value.isEntry && key.includes("entry-server"));
-          if (manifestEntry) {
-            const [, entry] = manifestEntry;
-            const serverPath = path.join(process.cwd(), "dist/server", entry.file);
-            renderModule = await import(serverPath);
+    return new Promise((resolve, reject) => {
+      const executeStream = /* @__PURE__ */ __name(async () => {
+        let template = this.template;
+        if (this.vite) {
+          template = await this.vite.transformIndexHtml("/", template);
+        }
+        const templateParts = this.templateParser.parseTemplate(template);
+        let renderModule;
+        if (this.vite) {
+          renderModule = await this.vite.ssrLoadModule(this.entryServerPath);
+        } else {
+          if (this.serverManifest) {
+            const manifestEntry = Object.entries(this.serverManifest).find(([key, value]) => value.isEntry && key.includes("entry-server"));
+            if (manifestEntry) {
+              const [, entry] = manifestEntry;
+              const serverPath = path.join(process.cwd(), "dist/server", entry.file);
+              renderModule = await import(serverPath);
+            } else {
+              throw new Error("Server bundle not found in manifest. Run `pnpm build:server` to generate the server bundle.");
+            }
           } else {
             throw new Error("Server bundle not found in manifest. Run `pnpm build:server` to generate the server bundle.");
           }
-        } else {
-          throw new Error("Server bundle not found in manifest. Run `pnpm build:server` to generate the server bundle.");
         }
-      }
-      const { data: pageData, __context: context, __layouts: layouts } = data;
-      const componentName = viewComponent.displayName || viewComponent.name || "Component";
-      const inlineScripts = this.templateParser.buildInlineScripts(pageData, context, componentName, layouts);
-      const clientScript = this.templateParser.getClientScriptTag(this.isDevelopment, this.manifest);
-      const stylesheetTags = this.templateParser.getStylesheetTags(this.isDevelopment, this.manifest);
-      const headTags = this.templateParser.buildHeadTags(head);
-      let didError = false;
-      const { pipe, abort } = renderModule.renderComponentStream(viewComponent, data, {
-        onShellReady: /* @__PURE__ */ __name(() => {
-          shellReadyTime = Date.now();
-          res.statusCode = didError ? 500 : 200;
-          res.setHeader("Content-Type", "text/html; charset=utf-8");
-          let htmlStart = templateParts.htmlStart;
-          htmlStart = htmlStart.replace("<!--styles-->", stylesheetTags);
-          htmlStart = htmlStart.replace("<!--head-meta-->", headTags);
-          res.write(htmlStart);
-          res.write(templateParts.rootStart);
-          pipe(res);
-          if (this.isDevelopment) {
-            const ttfb = shellReadyTime - startTime;
-            this.logger.log(`[SSR] ${componentName} shell ready in ${ttfb}ms (stream mode - TTFB)`);
+        const { data: pageData, __context: context, __layouts: layouts } = data;
+        const componentName = viewComponent.displayName || viewComponent.name || "Component";
+        const inlineScripts = this.templateParser.buildInlineScripts(pageData, context, componentName, layouts);
+        const clientScript = this.templateParser.getClientScriptTag(this.isDevelopment, this.manifest);
+        const stylesheetTags = this.templateParser.getStylesheetTags(this.isDevelopment, this.manifest);
+        const headTags = this.templateParser.buildHeadTags(head);
+        let didError = false;
+        let shellErrorOccurred = false;
+        const { PassThrough } = await import('stream');
+        const reactStream = new PassThrough();
+        let allReadyFired = false;
+        const { pipe, abort } = renderModule.renderComponentStream(viewComponent, data, {
+          onShellReady: /* @__PURE__ */ __name(() => {
+            shellReadyTime = Date.now();
+            if (!res.headersSent) {
+              res.statusCode = didError ? 500 : 200;
+              res.setHeader("Content-Type", "text/html; charset=utf-8");
+            }
+            let htmlStart = templateParts.htmlStart;
+            htmlStart = htmlStart.replace("<!--styles-->", stylesheetTags);
+            htmlStart = htmlStart.replace("<!--head-meta-->", headTags);
+            res.write(htmlStart);
+            res.write(templateParts.rootStart);
+            pipe(reactStream);
+            reactStream.pipe(res, {
+              end: false
+            });
+            if (this.isDevelopment) {
+              const ttfb = shellReadyTime - startTime;
+              this.logger.log(`[SSR] ${componentName} shell ready in ${ttfb}ms (stream mode - TTFB)`);
+            }
+          }, "onShellReady"),
+          onShellError: /* @__PURE__ */ __name((error) => {
+            shellErrorOccurred = true;
+            this.streamingErrorHandler.handleShellError(error, res, componentName, this.isDevelopment);
+            resolve();
+          }, "onShellError"),
+          onError: /* @__PURE__ */ __name((error) => {
+            didError = true;
+            this.streamingErrorHandler.handleStreamError(error, componentName);
+          }, "onError"),
+          onAllReady: /* @__PURE__ */ __name(() => {
+            allReadyFired = true;
+          }, "onAllReady")
+        });
+        reactStream.on("end", () => {
+          if (shellErrorOccurred) {
+            return;
           }
-        }, "onShellReady"),
-        onShellError: /* @__PURE__ */ __name((error) => {
-          this.streamingErrorHandler.handleShellError(error, res, componentName, this.isDevelopment);
-        }, "onShellError"),
-        onError: /* @__PURE__ */ __name((error) => {
-          didError = true;
-          this.streamingErrorHandler.handleStreamError(error, componentName);
-        }, "onError"),
-        onAllReady: /* @__PURE__ */ __name(() => {
           res.write(inlineScripts);
           res.write(clientScript);
           res.write(templateParts.rootEnd);
@@ -739,17 +755,25 @@ exports.RenderService = class _RenderService {
           if (this.isDevelopment) {
             const totalTime = Date.now() - startTime;
             const streamTime = Date.now() - shellReadyTime;
-            this.logger.log(`[SSR] ${componentName} streaming complete in ${totalTime}ms total (${streamTime}ms streaming)`);
+            const viaAllReady = allReadyFired ? " (onAllReady fired)" : " (onAllReady never fired)";
+            this.logger.log(`[SSR] ${componentName} streaming complete in ${totalTime}ms total (${streamTime}ms streaming)${viaAllReady}`);
           }
-        }, "onAllReady")
+          resolve();
+        });
+        reactStream.on("error", (error) => {
+          reject(error);
+        });
+        res.on("close", () => {
+          abort();
+          resolve();
+        });
+      }, "executeStream");
+      executeStream().catch((error) => {
+        const componentName = typeof viewComponent === "function" ? viewComponent.name : String(viewComponent);
+        this.streamingErrorHandler.handleShellError(error, res, componentName, this.isDevelopment);
+        resolve();
       });
-      res.on("close", () => {
-        abort();
-      });
-    } catch (error) {
-      const componentName = typeof viewComponent === "function" ? viewComponent.name : String(viewComponent);
-      this.streamingErrorHandler.handleShellError(error, res, componentName, this.isDevelopment);
-    }
+    });
   }
 };
 exports.RenderService = _ts_decorate3([
@@ -883,6 +907,9 @@ exports.RenderInterceptor = class RenderInterceptor {
       const httpContext = context.switchToHttp();
       const request = httpContext.getRequest();
       const response = httpContext.getResponse();
+      if (typeof data === "string") {
+        return data;
+      }
       const renderContext = {
         url: request.url,
         path: request.path,
@@ -973,11 +1000,23 @@ var ViteInitializerService = class _ViteInitializerService {
   viteMode;
   vitePort;
   viteServer = null;
+  isShuttingDown = false;
   constructor(renderService, httpAdapterHost, viteConfig) {
     this.renderService = renderService;
     this.httpAdapterHost = httpAdapterHost;
     this.viteMode = viteConfig?.mode || "embedded";
     this.vitePort = viteConfig?.port || 5173;
+    this.registerSignalHandlers();
+  }
+  registerSignalHandlers() {
+    const cleanup = /* @__PURE__ */ __name(async (signal) => {
+      if (this.isShuttingDown) return;
+      this.isShuttingDown = true;
+      this.logger.log(`Received ${signal}, closing Vite server...`);
+      await this.closeViteServer();
+    }, "cleanup");
+    process.once("SIGTERM", () => cleanup("SIGTERM"));
+    process.once("SIGINT", () => cleanup("SIGINT"));
   }
   async onModuleInit() {
     const isDevelopment = process.env.NODE_ENV !== "production";
@@ -1066,9 +1105,23 @@ var ViteInitializerService = class _ViteInitializerService {
   * This prevents port conflicts on hot reload
   */
   async onModuleDestroy() {
+    await this.closeViteServer();
+  }
+  /**
+  * Cleanup: Close Vite server on application shutdown
+  * Belt-and-suspenders approach with onModuleDestroy
+  */
+  async onApplicationShutdown() {
+    await this.closeViteServer();
+  }
+  async closeViteServer() {
+    if (this.isShuttingDown && !this.viteServer) return;
+    this.isShuttingDown = true;
     if (this.viteServer) {
       try {
+        this.renderService.setViteServer(null);
         await this.viteServer.close();
+        this.viteServer = null;
         this.logger.log("\u2713 Vite server closed");
       } catch (error) {
         this.logger.warn(`Failed to close Vite server: ${error.message}`);
@@ -1337,9 +1390,9 @@ exports.RenderModule = _ts_decorate6([
     ]
   })
 ], exports.RenderModule);
-var PageContext = /* @__PURE__ */ react.createContext(null);
+var PageContext = /* @__PURE__ */ React.createContext(null);
 function PageContextProvider({ context, children }) {
-  return /* @__PURE__ */ React.createElement(PageContext.Provider, {
+  return /* @__PURE__ */ React__default.default.createElement(PageContext.Provider, {
     value: context
   }, children);
 }
@@ -1351,7 +1404,7 @@ function createSSRHooks() {
     * Contains URL metadata, headers, and any custom properties you've added.
     */
     usePageContext: /* @__PURE__ */ __name(() => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("usePageContext must be used within PageContextProvider");
       }
@@ -1368,7 +1421,7 @@ function createSSRHooks() {
     * ```
     */
     useParams: /* @__PURE__ */ __name(() => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("useParams must be used within PageContextProvider");
       }
@@ -1386,7 +1439,7 @@ function createSSRHooks() {
     * ```
     */
     useQuery: /* @__PURE__ */ __name(() => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("useQuery must be used within PageContextProvider");
       }
@@ -1406,7 +1459,7 @@ function createSSRHooks() {
     * ```
     */
     useRequest: /* @__PURE__ */ __name(() => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("useRequest must be used within PageContextProvider");
       }
@@ -1432,7 +1485,7 @@ function createSSRHooks() {
     * ```
     */
     useHeaders: /* @__PURE__ */ __name(() => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("useHeaders must be used within PageContextProvider");
       }
@@ -1467,7 +1520,7 @@ function createSSRHooks() {
     * ```
     */
     useHeader: /* @__PURE__ */ __name((name) => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("useHeader must be used within PageContextProvider");
       }
@@ -1493,7 +1546,7 @@ function createSSRHooks() {
     * ```
     */
     useCookies: /* @__PURE__ */ __name(() => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("useCookies must be used within PageContextProvider");
       }
@@ -1515,7 +1568,7 @@ function createSSRHooks() {
     * ```
     */
     useCookie: /* @__PURE__ */ __name((name) => {
-      const context = react.useContext(PageContext);
+      const context = React.useContext(PageContext);
       if (!context) {
         throw new Error("useCookie must be used within PageContextProvider");
       }