feat: update getServerSideProps to use event context and remove unused code

Author: LiasCode

examples/basic/src/pages/products/[id]/[name]/page.tsx

@@ -17,9 +17,6 @@ export default function ProductIdPage(props: { id: string; name: string }) {
 export const getServerSideProps: GetServerSidePropsFunction<{
   id: string;
   name: string;
-}> = async () => {
-  return {
-    id: Math.random().toFixed(10),
-    name: "Pedro",
-  };
+}> = async ({ event }) => {
+  return event.context.params as { id: string; name: string };
 };

examples/basic/src/pages/products/page.tsx

@@ -5,7 +5,6 @@ import "./products.css";
 
 export default function ProductsPage(props: { cuantity: number }) {
   const { props_status } = useAppContext();
-  console.log(props_status);
 
   return (
     <div>

packages/pranx/src/client/app-context.tsx

@@ -52,7 +52,10 @@ export const AppContextProvider = (props: PropsWithChildren) => {
     }
 
     try {
-      const response = await fetch(next_route_data.server_data_api_url);
+      const targetUrl = new URL(window.location.href);
+      targetUrl.searchParams.set("props", "only");
+
+      const response = await fetch(targetUrl);
       const json_data = (await response.json()) as { props: Record<string, any> };
       set_page_props(json_data.props);
       onRouteChangeUpdateHead(next_route_data);

packages/pranx/src/cmd/build.ts

@@ -3,7 +3,6 @@ import { logger } from "@/utils/logger.js";
 import { measureTime } from "@/utils/time-perf.js";
 import fse from "fs-extra";
 import kleur from "kleur";
-import crypto from "node:crypto";
 import { join } from "pathe";
 import { Fragment, h } from "preact";
 import { renderToStringAsync } from "preact-render-to-string";
@@ -148,7 +147,6 @@ path: ${final_path}`);
         css: [css_output.entry, css_output[final_path] || ""].filter(Boolean),
         static_generated_routes: [],
         absolute_module_path: module_path,
-        server_data_api_key: "",
       });
 
       for (const static_path of static_paths_result.paths) {
@@ -199,7 +197,6 @@ params returned by getStaticPaths: ${JSON.stringify(static_path.params)}`);
       module: pages_relative_path,
       props: statics_fn_result.props,
       rendering_kind: isStatic ? "static" : "server-side",
-      server_data_api_key: crypto.randomUUID(),
       revalidate: statics_fn_result.revalidate || -1,
       static_generated_routes: [],
       is_dynamic: isUrlDynamic,
@@ -219,7 +216,6 @@ params returned by getStaticPaths: ${JSON.stringify(static_path.params)}`);
         css: r.css,
         is_dynamic: r.is_dynamic,
         path_parsed_for_routing: filePathToRoutingPath(r.path),
-        server_data_api_url: `/_internal_/${r.server_data_api_key}`,
         static_generated_routes: r.static_generated_routes.map((r) => {
           return {
             path: r.path,

packages/pranx/src/cmd/start.ts

@@ -79,6 +79,7 @@ const createServeStatic = (event: H3Event<EventHandlerRequest>) =>
 
       return undefined;
     },
+
     headers: {
       "Cache-Control": "public, max-age=2592000, immutable", // agresive caching
       "Expires": new Date(Date.now() + 2592000000).toUTCString(), // one month
@@ -109,7 +110,17 @@ const attach_server_side_pages_to_app = async (server_manifest: SERVER_MANIFEST,
           let props_to_return = {};
 
           if (getServerSideProps) {
-            props_to_return = await getServerSideProps();
+            props_to_return = await getServerSideProps({
+              event,
+            });
+          }
+
+          event.res.headers.set("Cache-Control", "private, no-cache, no-store, must-revalidate");
+
+          if (event.url.searchParams.get("props") === "only") {
+            return {
+              props: props_to_return,
+            };
           }
 
           const target_route_index = hydrate_data.routes.findIndex((r) => r.path === route.path);
@@ -133,28 +144,9 @@ const attach_server_side_pages_to_app = async (server_manifest: SERVER_MANIFEST,
             css: route.css,
           });
 
-          event.res.headers.set("Cache-Control", "private, no-cache, no-store, must-revalidate");
           return html(event, html_string);
         })
       );
-
-      app.on(
-        "GET",
-        `/_internal_/${route.server_data_api_key}`,
-        defineHandler(async (event) => {
-          let props_to_return = {};
-
-          if (getServerSideProps) {
-            props_to_return = await getServerSideProps();
-          }
-
-          event.res.headers.set("Cache-Control", "no-store");
-
-          return {
-            props: props_to_return,
-          };
-        })
-      );
     }
   }
 };

packages/pranx/types/index.d.ts

@@ -1,3 +1,4 @@
+import { EventHandlerRequest, H3Event } from "h3";
 import { VNode } from "preact";
 import { PropsWithChildren } from "preact/compat";
 import { useHead } from "unhead";
@@ -29,8 +30,9 @@ export type GetStaticPropsFunction<
 > = (context: { params: Params }) => Promise<GetStaticPropsResult<Props>>;
 
 // Server Side
-export type GetServerSidePropsFunction<Props extends Record<string, any> = {}> =
-  () => Promise<Props>;
+export type GetServerSidePropsFunction<Props extends Record<string, any> = {}> = (context: {
+  event: H3Event<EventHandlerRequest>;
+}) => Promise<Props>;
 
 // Meta
 export type MetaFunction = typeof useHead;
@@ -69,7 +71,6 @@ export type ServerManifestRoute = {
   is_dynamic: boolean;
   dynamic_params: Array<string>;
   css: string[];
-  server_data_api_key: string;
 };
 
 export type SERVER_MANIFEST = {
@@ -86,7 +87,6 @@ export type HydrateDataRoute = {
   css: string[];
   path_parsed_for_routing: string;
   static_generated_routes: Array<{ path: string; props: Record<string, any> }>;
-  server_data_api_url: string;
 };
 
 export type HYDRATE_DATA = {