From 9e65cc9d643ebf6f36a69d1f898c318752780eb5 Mon Sep 17 00:00:00 2001
From: Tobbe Lundberg <tobbe@tlundberg.com>
Date: Sat, 11 May 2024 11:06:37 +0200
Subject: [PATCH] __rwjs__router

---
 packages/router/src/page.ts        |  2 +-
 packages/vite/src/client.ts        | 20 +++++++++++++++++---
 packages/vite/src/lib/entries.ts   |  1 +
 packages/vite/src/rsc/rscWorker.ts | 12 ++++++++++++
 4 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/packages/router/src/page.ts b/packages/router/src/page.ts
index 6871c9c5eb3d..95a94a63d8cc 100644
--- a/packages/router/src/page.ts
+++ b/packages/router/src/page.ts
@@ -50,7 +50,7 @@ export function normalizePage(
     LazyComponent: specOrPage,
   }
 
-  console.log('normalizePage spec', specOrPage)
+  console.log('normalizePage spec', spec)
 
   return spec
 }
diff --git a/packages/vite/src/client.ts b/packages/vite/src/client.ts
index 5dcf8b14453a..ef48b14e9e24 100644
--- a/packages/vite/src/client.ts
+++ b/packages/vite/src/client.ts
@@ -1,4 +1,4 @@
-import { cache, use, useEffect, useState } from 'react'
+import React, { cache, use, useEffect, useState } from 'react'
 import type { ReactElement } from 'react'
 
 import type { Options } from 'react-server-dom-webpack/client'
@@ -23,8 +23,6 @@ const BASE_PATH = '/rw-rsc/'
 export function renderFromRscServer<TProps>(rscId: string) {
   console.log('serve rscId (renderFromRscServer)', rscId)
 
-  console.log('window', typeof window)
-
   // TODO (RSC): Remove this when we have a babel plugin to call another
   // function during SSR
   if (typeof window === 'undefined') {
@@ -32,6 +30,22 @@ export function renderFromRscServer<TProps>(rscId: string) {
     return null
   }
 
+  if (rscId === 'NavigationLayout') {
+    console.log('renderFromRscServer - NavigationLayout')
+
+    // @ts-expect-error I don't care about types, this is just for debugging
+    return function HardcodedNavigationLayout(props) {
+      return React.createElement('div', {}, [
+        'Hardcoded NavigationLayout',
+        React.createElement(
+          'pre',
+          {},
+          React.createElement('code', {}, JSON.stringify(props, null, 2)),
+        ),
+      ])
+    }
+  }
+
   type SetRerender = (
     rerender: (next: [Thenable<ReactElement>, string]) => void,
   ) => () => void
diff --git a/packages/vite/src/lib/entries.ts b/packages/vite/src/lib/entries.ts
index 3fb1f54febc5..8a2584046c71 100644
--- a/packages/vite/src/lib/entries.ts
+++ b/packages/vite/src/lib/entries.ts
@@ -36,6 +36,7 @@ export function getEntries() {
 
   entries['NavigationLayout'] =
     getPaths().web.layouts + '/NavigationLayout/NavigationLayout.tsx'
+  entries['__rwjs__Router'] = getPaths().web.src + '/ServerRoutes.tsx'
 
   // Add the ServerEntry entry, noting we use the "__rwjs__" prefix to avoid
   // any potential conflicts with user-defined entries
diff --git a/packages/vite/src/rsc/rscWorker.ts b/packages/vite/src/rsc/rscWorker.ts
index e3e7e4bf1acc..10f45cdbd03e 100644
--- a/packages/vite/src/rsc/rscWorker.ts
+++ b/packages/vite/src/rsc/rscWorker.ts
@@ -392,6 +392,18 @@ async function renderRsc(input: RenderInput): Promise<PipeableStream> {
     // continue for mutation mode
   }
 
+  if (input.rscId?.startsWith('__rwjs__router')) {
+    console.log('render Router rscId', input.rscId)
+    const router = await getFunctionComponent('__rwjs__Router')
+    console.log('render Router router', router)
+
+    return renderToPipeableStream(
+      createElement(router, { location: { pathname: '/about' } }),
+      // createElement('div', {}, 'AboutPage'),
+      bundlerConfig,
+    ).pipe(transformRsfId(config.root))
+  }
+
   if (input.rscId && input.props) {
     const component = await getFunctionComponent(input.rscId)