Refactor HMR server-side watcher. Move to fs.watch instead of the inbuild esbuild.watch

src/functions/server/web-pages/grab-page-bundled-react-component.tsx

@@ -16,9 +16,8 @@ export default async function grabPageBundledReactComponent({
     try {
         let tsx = ``;
 
-        const server_res_json = EJSON.stringify(server_res || {})?.replace(
-            /"/g,
-            '\\"',
+        const server_res_json = JSON.stringify(
+            EJSON.stringify(server_res || {}) ?? "{}",
         );
 
         if (root_file) {
@@ -27,7 +26,7 @@ export default async function grabPageBundledReactComponent({
 
         tsx += `import Page from "${file_path}"\n`;
         tsx += `export default function Main() {\n\n`;
-        tsx += `const props = JSON.parse("${server_res_json}")\n\n`;
+        tsx += `const props = JSON.parse(${server_res_json})\n\n`;
         tsx += `    return (\n`;
         if (root_file) {
             tsx += `        <Root suppressHydrationWarning={true} {...props}><Page {...props} /></Root>\n`;

src/functions/server/web-pages/grab-page-component.tsx

@@ -27,6 +27,7 @@ export default async function grabPageComponent({
 }: Params): Promise<GrabPageComponentRes> {
     const url = req?.url ? new URL(req.url) : undefined;
     const router = global.ROUTER;
+    const now = Date.now();
 
     let routeParams: BunxRouteParams | undefined = undefined;
 
@@ -77,7 +78,7 @@ export default async function grabPageComponent({
 
         const { root_file } = grabRootFile();
 
-        const module: BunextPageModule = await import(file_path);
+        const module: BunextPageModule = await import(`${file_path}?t=${now}`);
 
         if (debug) {
             log.info(`module:`, module);
@@ -106,7 +107,10 @@ export default async function grabPageComponent({
 
             try {
                 if (routeParams) {
-                    const serverData = await module["server"]?.(routeParams);
+                    const serverData = await module["server"]?.({
+                        ...routeParams,
+                        query: { ...routeParams.query, ...match?.query },
+                    });
                     return {
                         ...serverData,
                         ...default_props,

src/functions/server/web-pages/grab-web-page-hydration-script.tsx

@@ -16,7 +16,7 @@ export default async function ({ bundledMap }: Params) {
     script += `        console.log(\`HMR Changes Detected. Updating ...\`);\n`;
     script += `        try {\n`;
     script += `            const data = JSON.parse(event.data);\n`;
-    // script += `            console.log("data", data);\n`;
+    script += `            console.log("data", data);\n`;
     // script += `            const modulePath = \`/\${data.target_map.path}\`;\n\n`;
 
     // script += `            const modulePath = \`/${AppData["ClientHMRPath"]}?href=\${window.location.href}&t=\${Date.now()}\`;\n\n`;