dinou 5.0.2 → 5.1.0

package/dinou/core/client-webpack.jsx

@@ -5,11 +5,13 @@ import {
   useTransition,
   useLayoutEffect,
   useMemo,
+  Component,
 } from "react";
 import { createFromFetch } from "react-server-dom-webpack/client";
 import { hydrateRoot } from "react-dom/client";
 import { RouterContext } from "./navigation.js";
 import { resolveUrl, isExternalUrl } from "./navigation-utils.js";
+import { createServerFunctionProxy } from "./server-function-proxy-webpack.js";
 
 // ====================================================================
 // 1. GLOBAL STATE (Outside the component)
@@ -81,11 +83,109 @@ const getRSCPayload = (rscKey, isPrefetch = false) => {
       }
       return res;
     }),
+    {
+      callServer: async (id, args) => {
+        const proxy = createServerFunctionProxy(id);
+        return proxy(...args);
+      }
+    }
   );
   cache.set(url, promise); // <--- KEY TO AVOID LOOP
   return promise;
 };
 
+const getErrorRSCPayload = (route, error) => {
+  const url = route.split("::")[0];
+  const cacheKey = `error::${url}::${error.message || String(error)}`;
+  if (cache.has(cacheKey)) {
+    return cache.get(cacheKey);
+  }
+
+  const payloadUrl = "/____rsc_payload_error____" + url;
+  const promise = createFromFetch(
+    fetch(payloadUrl, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({
+        error: {
+          message: error.message || "Unknown Error",
+          name: error.name,
+          stack: error.stack,
+        },
+      }),
+    }).then((res) => {
+      if (res.headers.has("x-rsc-redirect")) {
+        const redirectUrl = res.headers.get("x-rsc-redirect");
+        cache.delete(cacheKey);
+        if (window.__DINOU_ROUTER_NAVIGATE__) {
+          window.__DINOU_ROUTER_NAVIGATE__(redirectUrl, { replace: true });
+        } else {
+          window.location.href = redirectUrl;
+        }
+        return new Promise(() => {});
+      }
+      return res;
+    }),
+    {
+      callServer: async (id, args) => {
+        const proxy = createServerFunctionProxy(id);
+        return proxy(...args);
+      }
+    }
+  );
+  cache.set(cacheKey, promise);
+  return promise;
+};
+
+class ErrorBoundary extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false, error: null };
+  }
+
+  static getDerivedStateFromError(error) {
+    return { hasError: true, error };
+  }
+
+  componentDidCatch(error, errorInfo) {
+    console.error("[Dinou] ErrorBoundary caught error:", error, errorInfo);
+    if (this.props.onError) {
+      this.props.onError(error);
+    }
+  }
+
+  render() {
+    if (this.state.hasError) {
+      if (this.props.fallback) {
+        return this.props.fallback(this.state.error);
+      }
+      const isDev = process.env.NODE_ENV !== "production";
+      return (
+        <div style={{ padding: "20px", fontFamily: "sans-serif" }}>
+          <h2>Application Error</h2>
+          <p>An unexpected error occurred on the client.</p>
+          <pre style={{ backgroundColor: "#f5f5f5", padding: "15px", borderRadius: "5px", overflowX: "auto" }}>
+            {isDev ? (
+              <>
+                <div style={{ fontWeight: "bold", marginBottom: "10px" }}>
+                  {this.state.error?.name || "Error"}: {this.state.error?.message || String(this.state.error)}
+                </div>
+                <div>{this.state.error?.stack}</div>
+              </>
+            ) : (
+              this.state.error?.message || String(this.state.error)
+            )}
+          </pre>
+        </div>
+      );
+    }
+    return this.props.children;
+  }
+}
+
+
 // ====================================================================
 // 3. ROUTER COMPONENT
 // ====================================================================
@@ -95,6 +195,7 @@ function Router() {
   const [isPopState, setIsPopState] = useState(false);
   const [isPending, startTransition] = useTransition();
   const [version, setVersion] = useState(0);
+  const [navError, setNavError] = useState(null);
 
   // 🧭 NAVIGATE FUNCTION (Core Logic)
   const navigate = (href, options = {}) => {
@@ -138,6 +239,7 @@ function Router() {
     startTransition(() => {
       setIsPopState(false);
       setRoute(finalPath);
+      setNavError(null);
     });
   };
 
@@ -174,6 +276,7 @@ function Router() {
     startTransition(() => {
       // 3. Increment version to force re-execution of useMemo
       setVersion((v) => v + 1);
+      setNavError(null);
     });
   };
 
@@ -220,6 +323,7 @@ function Router() {
       startTransition(() => {
         setIsPopState(true);
         setRoute(target);
+        setNavError(null);
       });
     };
 
@@ -265,7 +369,7 @@ function Router() {
 
   // RSC Logic
   const rscKey = route + "::" + version;
-  const content = getRSCPayload(rscKey);
+  const content = navError ? getErrorRSCPayload(route, navError) : getRSCPayload(rscKey);
 
   const contextValue = useMemo(
     () => ({
@@ -281,7 +385,12 @@ function Router() {
 
   return (
     <RouterContext.Provider value={contextValue}>
-      {use(content)}
+      <ErrorBoundary
+        key={navError ? "error" : "normal"}
+        onError={setNavError}
+      >
+        {use(content)}
+      </ErrorBoundary>
     </RouterContext.Provider>
   );
 }

package/dinou/core/client.jsx

@@ -6,11 +6,13 @@ import {
   useTransition,
   useLayoutEffect,
   useMemo,
+  Component,
 } from "react";
 import { createFromFetch } from "@roggc/react-server-dom-esm/client";
 import { hydrateRoot } from "react-dom/client";
 import { RouterContext } from "./navigation.js";
 import { resolveUrl, isExternalUrl } from "./navigation-utils.js";
+import { createServerFunctionProxy } from "./server-function-proxy.js";
 
 // ====================================================================
 // 1. GLOBAL STATE (Outside the component)
@@ -88,11 +90,109 @@ const getRSCPayload = (rscKey, isPrefetch = false) => {
       }
       return res;
     }),
+    {
+      callServer: async (id, args) => {
+        const proxy = createServerFunctionProxy(id);
+        return proxy(...args);
+      }
+    }
   );
   cache.set(url, promise); // <--- KEY TO AVOID LOOP
   return promise;
 };
 
+const getErrorRSCPayload = (route, error) => {
+  const url = route.split("::")[0];
+  const cacheKey = `error::${url}::${error.message || String(error)}`;
+  if (cache.has(cacheKey)) {
+    return cache.get(cacheKey);
+  }
+
+  const payloadUrl = "/____rsc_payload_error____" + url;
+  const promise = createFromFetch(
+    fetch(payloadUrl, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({
+        error: {
+          message: error.message || "Unknown Error",
+          name: error.name,
+          stack: error.stack,
+        },
+      }),
+    }).then((res) => {
+      if (res.headers.has("x-rsc-redirect")) {
+        const redirectUrl = res.headers.get("x-rsc-redirect");
+        cache.delete(cacheKey);
+        if (window.__DINOU_ROUTER_NAVIGATE__) {
+          window.__DINOU_ROUTER_NAVIGATE__(redirectUrl, { replace: true });
+        } else {
+          window.location.href = redirectUrl;
+        }
+        return new Promise(() => {});
+      }
+      return res;
+    }),
+    {
+      callServer: async (id, args) => {
+        const proxy = createServerFunctionProxy(id);
+        return proxy(...args);
+      }
+    }
+  );
+  cache.set(cacheKey, promise);
+  return promise;
+};
+
+class ErrorBoundary extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false, error: null };
+  }
+
+  static getDerivedStateFromError(error) {
+    return { hasError: true, error };
+  }
+
+  componentDidCatch(error, errorInfo) {
+    console.error("[Dinou] ErrorBoundary caught error:", error, errorInfo);
+    if (this.props.onError) {
+      this.props.onError(error);
+    }
+  }
+
+  render() {
+    if (this.state.hasError) {
+      if (this.props.fallback) {
+        return this.props.fallback(this.state.error);
+      }
+      const isDev = process.env.NODE_ENV !== "production";
+      return (
+        <div style={{ padding: "20px", fontFamily: "sans-serif" }}>
+          <h2>Application Error</h2>
+          <p>An unexpected error occurred on the client.</p>
+          <pre style={{ backgroundColor: "#f5f5f5", padding: "15px", borderRadius: "5px", overflowX: "auto" }}>
+            {isDev ? (
+              <>
+                <div style={{ fontWeight: "bold", marginBottom: "10px" }}>
+                  {this.state.error?.name || "Error"}: {this.state.error?.message || String(this.state.error)}
+                </div>
+                <div>{this.state.error?.stack}</div>
+              </>
+            ) : (
+              this.state.error?.message || String(this.state.error)
+            )}
+          </pre>
+        </div>
+      );
+    }
+    return this.props.children;
+  }
+}
+
+
 // ====================================================================
 // 3. ROUTER COMPONENT
 // ====================================================================
@@ -102,6 +202,7 @@ function Router() {
   const [isPopState, setIsPopState] = useState(false);
   const [isPending, startTransition] = useTransition();
   const [version, setVersion] = useState(0);
+  const [navError, setNavError] = useState(null);
 
   // 🧭 NAVIGATE FUNCTION (Core Logic)
   const navigate = (href, options = {}) => {
@@ -145,6 +246,7 @@ function Router() {
     startTransition(() => {
       setIsPopState(false);
       setRoute(finalPath);
+      setNavError(null);
     });
   };
 
@@ -181,6 +283,7 @@ function Router() {
     startTransition(() => {
       // 3. Increment version to force re-execution of useMemo
       setVersion((v) => v + 1);
+      setNavError(null);
     });
   };
 
@@ -227,6 +330,7 @@ function Router() {
       startTransition(() => {
         setIsPopState(true);
         setRoute(target);
+        setNavError(null);
       });
     };
 
@@ -272,7 +376,7 @@ function Router() {
 
   // RSC Logic
   const rscKey = route + "::" + version;
-  const content = getRSCPayload(rscKey);
+  const content = navError ? getErrorRSCPayload(route, navError) : getRSCPayload(rscKey);
 
   const contextValue = useMemo(
     () => ({
@@ -288,7 +392,12 @@ function Router() {
 
   return (
     <RouterContext.Provider value={contextValue}>
-      {use(content)}
+      <ErrorBoundary
+        key={navError ? "error" : "normal"}
+        onError={setNavError}
+      >
+        {use(content)}
+      </ErrorBoundary>
     </RouterContext.Provider>
   );
 }

package/dinou/core/generate-static-page.js

@@ -10,7 +10,7 @@ const OUT_DIR = path.resolve("dist2");
 async function generateStaticPage(reqPath) {
   const finalReqPath = reqPath.endsWith("/") ? reqPath : reqPath + "/";
   const htmlPath = path.join(OUT_DIR, finalReqPath, "index.html");
-  const tempHtmlPath = path.join(OUT_DIR, finalReqPath, "index.html.tmp");
+  const tempHtmlPath = path.join(OUT_DIR, finalReqPath, `index.html.${Date.now()}-${Math.random()}.tmp`);
 
   const query = {};
   const paramsString = JSON.stringify(query);
@@ -94,6 +94,7 @@ async function generateStaticPage(reqPath) {
           revalidate: metadata.revalidate,
           generatedAt: Date.now(),
           effects: metadata.effects,
+          tags: metadata.tags || [],
         }, null, 2),
         "utf8"
       );

package/dinou/core/generate-static-pages.js

@@ -107,6 +107,7 @@ async function generateStaticPages(routes) {
             revalidate: metadata.revalidate,
             generatedAt: Date.now(),
             effects: metadata.effects,
+            tags: metadata.tags || [],
           }, null, 2),
           "utf8"
         );

package/dinou/core/generate-static-rsc.js

@@ -15,9 +15,8 @@ const OUT_DIR = path.resolve("dist2");
 async function generateStaticRSC(reqPath) {
   const finalReqPath = reqPath.endsWith("/") ? reqPath : reqPath + "/";
 
-  // 1. PATHS: Final and Temporary
   const payloadPath = path.join(OUT_DIR, finalReqPath, "rsc.rsc");
-  const tempPayloadPath = payloadPath + ".tmp"; // 👈 We write here
+  const tempPayloadPath = path.join(OUT_DIR, finalReqPath, `rsc.rsc.${Date.now()}-${Math.random()}.tmp`);
 
   // 👇 2. MOCK RES (Complete and Robust Version)
   const mockRes = {

package/dinou/core/path-utils.js

@@ -0,0 +1,10 @@
+function normalizePathCase(p) {
+  if (process.platform === "win32" && typeof p === "string" && p[1] === ":") {
+    return p.charAt(0).toLowerCase() + p.slice(1);
+  }
+  return p;
+}
+
+module.exports = {
+  normalizePathCase,
+};

package/dinou/core/server.js

@@ -5,6 +5,8 @@ const isWebpack = process.env.DINOU_BUILD_TOOL === "webpack";
 globalThis.__dinou_require__ = require;
 const path = require("path");
 
+const { normalizePathCase } = require("./path-utils.js");
+
 let reactServerPath, reactDomServerPath, reactJsxRuntimePath, reactJsxDevRuntimePath;
 
 if (!isWebpack) {
@@ -124,11 +126,10 @@ if (isDevelopment) {
       while (attempts < maxRetries) {
         try {
           // console.log(`Attempting to load manifest (try ${attempts + 1})...`);
-          return JSON.parse(readFileSync(manifestPath, "utf8"));
+          const text = readFileSync(manifestPath, "utf8");
+          if (!text.trim()) throw new Error("Empty JSON");
+          return JSON.parse(text);
         } catch (err) {
-          if (err.code !== "ENOENT") {
-            throw err; // Rethrow if it's not a file not found error
-          }
           attempts++;
           if (attempts >= maxRetries) {
             throw err; // Rethrow after max retries
@@ -628,7 +629,7 @@ async function serveRSCPayload(req, res, isOld = false, isStatic = false) {
           const metaObj = JSON.parse(readFileSync(metadataPath, "utf8"));
           currentGeneratedAt = metaObj.generatedAt || null;
         }
-      } catch (e) {}
+      } catch (e) { }
 
       const useOld =
         isOld ||
@@ -797,7 +798,43 @@ async function serveRSCPayload(req, res, isOld = false, isStatic = false) {
     });
   } catch (error) {
     console.error("Error rendering RSC:", error);
-    res.status(500).send("Internal Server Error");
+    try {
+      const serializedError = {
+        message: error.message || "Unknown Error",
+        name: error.name,
+        stack: isDevelopment ? error.stack : undefined,
+      };
+      const context = getContext(req, res);
+      await requestStorage.run(context, async () => {
+        const jsx = await getErrorJSX(
+          reqPath,
+          { ...req.query },
+          serializedError,
+          isDevelopment,
+        );
+        const manifest = isDevelopment
+          ? JSON.parse(
+            readFileSync(
+              path.resolve(
+                process.cwd(),
+                isWebpack
+                  ? `${outputFolder}/react-client-manifest.json`
+                  : `react_client_manifest/react-client-manifest.json`,
+              ),
+              "utf8",
+            ),
+          )
+          : cachedClientManifest;
+        const { pipe } = isWebpack
+          ? renderToPipeableStream(jsx, manifest)
+          : renderToPipeableStream(jsx, pathToFileURL(process.cwd()).href + "/");
+        res.status(500);
+        pipe(res);
+      });
+    } catch (innerError) {
+      console.error("Fatal error rendering fallback error RSC:", innerError);
+      res.status(500).send("Internal Server Error");
+    }
   }
 }
 
@@ -822,29 +859,33 @@ app.post(/^\/____rsc_payload_error____\/.*\/?$/, async (req, res) => {
     const reqPath = (
       req.path.endsWith("/") ? req.path : req.path + "/"
     ).replace("/____rsc_payload_error____", "");
-    const jsx = await getErrorJSX(
-      reqPath,
-      { ...req.query },
-      req.body.error,
-      isDevelopment,
-    );
-    const manifest = isDevelopment
-      ? JSON.parse(
-        readFileSync(
-          path.resolve(
-            process.cwd(),
-            isWebpack
-              ? `${outputFolder}/react-client-manifest.json`
-              : `react_client_manifest/react-client-manifest.json`,
+
+    const context = getContext(req, res);
+    await requestStorage.run(context, async () => {
+      const jsx = await getErrorJSX(
+        reqPath,
+        { ...req.query },
+        req.body.error,
+        isDevelopment,
+      );
+      const manifest = isDevelopment
+        ? JSON.parse(
+          readFileSync(
+            path.resolve(
+              process.cwd(),
+              isWebpack
+                ? `${outputFolder}/react-client-manifest.json`
+                : `react_client_manifest/react-client-manifest.json`,
+            ),
+            "utf8",
           ),
-          "utf8",
-        ),
-      )
-      : cachedClientManifest;
-    const { pipe } = isWebpack
-      ? renderToPipeableStream(jsx, manifest)
-      : renderToPipeableStream(jsx, pathToFileURL(process.cwd()).href + "/");
-    pipe(res);
+        )
+        : cachedClientManifest;
+      const { pipe } = isWebpack
+        ? renderToPipeableStream(jsx, manifest)
+        : renderToPipeableStream(jsx, pathToFileURL(process.cwd()).href + "/");
+      pipe(res);
+    });
   } catch (error) {
     console.error("Error rendering RSC:", error);
     res.status(500).send("Internal Server Error");
@@ -985,10 +1026,10 @@ app.get(/^\/.*\/?$/, async (req, res) => {
       if (existsSync(fileToRead) && !dynamicState.value) {
         res.setHeader("Content-Type", "text/html");
         res.setHeader("Cache-Control", "no-store, no-cache, must-revalidate");
-        const meta = getStatus[reqPath];
+        const status = getStatus(reqPath);
 
-        if (meta && meta.status) {
-          res.statusCode = meta.status;
+        if (status) {
+          res.statusCode = status;
         } else {
           res.statusCode = 200; // Default
         }
@@ -1001,7 +1042,7 @@ app.get(/^\/.*\/?$/, async (req, res) => {
               const metaObj = JSON.parse(readFileSync(metadataPath, "utf8"));
               buildId = metaObj.generatedAt || "";
             }
-          } catch (e) {}
+          } catch (e) { }
 
           let scripts = `<script>window.__DINOU_USE_STATIC__=true;</script>`;
           if (htmlPathOld) {
@@ -1208,8 +1249,27 @@ app.post("/____server_function____", async (req, res) => {
       return res.status(400).json({ error: "Invalid file URL format" });
     }
 
-    // Extract relativePath and normalize (remove 'file://' and potential '/')
-    let relativePath = fileUrl.replace(/^file:\/\/\/?/, "").trim();
+    let relativePath;
+
+    // Check if the URL is a relative reference (e.g. file:///src/...)
+    // If so, extract it directly without using fileURLToPath (which throws on Windows without a drive letter)
+    const isRelativeSrc = fileUrl.startsWith("file:///src/") || fileUrl.startsWith("file:///src\\");
+
+    if (isRelativeSrc) {
+      relativePath = fileUrl.replace(/^file:\/\/\/?/, "").trim();
+    } else {
+      const resolvedPath = fileURLToPath(fileUrl);
+      relativePath = resolvedPath;
+
+      const normalizedCwd = normalizePathCase(process.cwd());
+      const normalizedResolved = normalizePathCase(resolvedPath);
+
+      if (normalizedResolved.startsWith(normalizedCwd)) {
+        relativePath = path.relative(normalizedCwd, normalizedResolved);
+      } else {
+        relativePath = relativePath.replace(/^[\\/]+/, "");
+      }
+    }
     const normalizedRelative = relativePath.replace(/\\/g, "/");
     if (
       normalizedRelative.startsWith("/") ||
@@ -1220,7 +1280,7 @@ app.post("/____server_function____", async (req, res) => {
         .status(400)
         .json({ error: "Invalid path: no absolute, traversal, or drive letter allowed" });
     }
-    // console.log("relPath", relativePath);
+
     // Restrict to 'src/' folder: prepend 'src/' if missing, and resolve absolutePath
     if (!relativePath.startsWith("src/") && !relativePath.startsWith("src\\")) {
       relativePath = path.join("src", relativePath);
@@ -1234,9 +1294,10 @@ app.post("/____server_function____", async (req, res) => {
         .status(403)
         .json({ error: "Access denied: file outside src directory" });
     }
-    // console.log("absPath", absolutePath);
+
     // Verify that the file exists
     if (!existsSync(absolutePath)) {
+      // console.error("❌ [Dinou Server Function 404] File not found! id:", id, "relativePath:", relativePath, "absolutePath:", absolutePath);
       return res.status(404).json({ error: "File not found" });
     }
 
@@ -1257,8 +1318,8 @@ app.post("/____server_function____", async (req, res) => {
           .status(403)
           .json({ error: "Not a valid server function file" });
       }
-      // Parse exports (you need to implement parseExports on server if not present)
-      const exports = parseExports(fileContent); // Assume you move parseExports to a shared util
+      // Parse exports
+      const exports = parseExports(fileContent);
       allowedExports = new Set(exports);
     }
 
@@ -1271,10 +1332,10 @@ app.post("/____server_function____", async (req, res) => {
       return res.status(400).json({ error: "Invalid export name" });
     }
 
-    // Proceed with import (using your importModule)
+    // Proceed with import
     const mod = await importModule(absolutePath);
 
-    // Validate exportName: only allow 'default' or others if you define a whitelist
+    // Validate exportName
     if (!exportName || (exportName !== "default" && !mod[exportName])) {
       return res.status(400).json({ error: "Invalid export name" });
     }

package/dinou/esbuild/helpers-esbuild/get-config-esbuild-prod.mjs

@@ -56,6 +56,9 @@ export default function getConfigEsbuildProd({
     metafile: true,
     logLevel: "warning",
     minify: true,
+    define: {
+      "process.env.NODE_ENV": JSON.stringify("production"),
+    },
     external: [
       "/__SERVER_FUNCTION_PROXY__",
       "/serverFunctionProxy.js",

package/dinou/package.json

@@ -1,12 +1,17 @@
 {
   "name": "dinou-ejected",
-  "version": "5.0.2",
+  "version": "5.1.0",
   "main": "index.js",
   "private": true,
   "exports": {
     ".": {
       "import": "./index.mjs",
       "require": "./index.js"
+    },
+    "./server": {
+      "types": "./server.d.ts",
+      "import": "./server.mjs",
+      "require": "./server.js"
     }
   },
   "types": "./index.d.ts",

package/dinou/server.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Revalidates the cache for a specific route path.
+ * * It deletes the old cached HTML and RSC files and rebuilds them synchronously.
+ * @param path The path of the route to revalidate (e.g. "/blog" or "/blog/12").
+ */
+export declare function revalidatePath(path: string): Promise<void>;
+
+/**
+ * Revalidates all routes that are associated with the specified cache tag.
+ * @param tag The tag string to revalidate (e.g. "blog-posts").
+ */
+export declare function revalidateTag(tag: string): Promise<void>;

package/dinou/server.js

@@ -0,0 +1,10 @@
+module.exports = {
+  revalidatePath: async function (path) {
+    const { revalidatePath: fn } = require("./core/cache-revalidate.js");
+    return fn(path);
+  },
+  revalidateTag: async function (tag) {
+    const { revalidateTag: fn } = require("./core/cache-revalidate.js");
+    return fn(tag);
+  },
+};