@tanstack/start-server-core 1.132.0-alpha.2 → 1.132.0-alpha.21

package/src/index.tsx

@@ -58,3 +58,5 @@ export type {
 export * from './virtual-modules'
 
 export { HEADERS } from './constants'
+
+export { createServerRpc } from './createServerRpc'

package/src/serializer/ServerFunctionSerializationAdapter.ts

@@ -0,0 +1,24 @@
+import { createSerializationAdapter } from '@tanstack/router-core'
+import { TSS_SERVER_FUNCTION } from '@tanstack/start-client-core'
+import { createServerRpc } from '../createServerRpc'
+import { getServerFnById } from '../getServerFnById'
+
+export const ServerFunctionSerializationAdapter = createSerializationAdapter({
+  key: '$TSS/serverfn',
+  test: (v): v is { functionId: string } => {
+    if (typeof v !== 'object' || v === null) return false
+
+    if (!(TSS_SERVER_FUNCTION in v)) return false
+
+    return !!v[TSS_SERVER_FUNCTION]
+  },
+  toSerializable: ({ functionId }) => ({ functionId }),
+  fromSerializable: ({ functionId }) => {
+    const fn = async (opts: any, signal: any): Promise<any> => {
+      const serverFn = await getServerFnById(functionId)
+      const result = await serverFn(opts ?? {}, signal)
+      return result.result
+    }
+    return createServerRpc(functionId, fn)
+  },
+})

package/src/serializer/getSerovalPlugins.ts

@@ -0,0 +1,10 @@
+import { makeSerovalPlugin } from '@tanstack/router-core'
+import { getDefaultSerovalPlugins } from '@tanstack/start-client-core'
+import { ServerFunctionSerializationAdapter } from './ServerFunctionSerializationAdapter'
+
+export function getSerovalPlugins() {
+  return [
+    ...getDefaultSerovalPlugins(),
+    makeSerovalPlugin(ServerFunctionSerializationAdapter),
+  ]
+}

package/src/server-functions-handler.ts

@@ -1,9 +1,13 @@
 import { isNotFound } from '@tanstack/router-core'
 import invariant from 'tiny-invariant'
-import { startSerializer } from '@tanstack/start-client-core'
-import { VIRTUAL_MODULES } from './virtual-modules'
-import { loadVirtualModule } from './loadVirtualModule'
+import {
+  TSS_FORMDATA_CONTEXT,
+  X_TSS_SERIALIZED,
+} from '@tanstack/start-client-core'
+import { fromJSON, toCrossJSONAsync, toCrossJSONStream } from 'seroval'
 import { getResponse } from './request-response'
+import { getServerFnById } from './getServerFnById'
+import { getSerovalPlugins } from './serializer/getSerovalPlugins'
 
 function sanitizeBase(base: string | undefined) {
   if (!base) {
@@ -15,72 +19,6 @@ function sanitizeBase(base: string | undefined) {
   return base.replace(/^\/|\/$/g, '')
 }
 
-async function revive(root: any, reviver?: (key: string, value: any) => any) {
-  async function reviveNode(holder: any, key: string) {
-    const value = holder[key]
-
-    if (value && typeof value === 'object') {
-      await Promise.all(Object.keys(value).map((k) => reviveNode(value, k)))
-    }
-
-    if (reviver) {
-      holder[key] = await reviver(key, holder[key])
-    }
-  }
-
-  const holder = { '': root }
-  await reviveNode(holder, '')
-  return holder['']
-}
-
-async function reviveServerFns(key: string, value: any) {
-  if (value && value.__serverFn === true && value.functionId) {
-    const serverFn = await getServerFnById(value.functionId)
-    return async (opts: any, signal: any): Promise<any> => {
-      const result = await serverFn(opts ?? {}, signal)
-      return result.result
-    }
-  }
-  return value
-}
-
-async function getServerFnById(serverFnId: string) {
-  const { default: serverFnManifest } = await loadVirtualModule(
-    VIRTUAL_MODULES.serverFnManifest,
-  )
-
-  const serverFnInfo = serverFnManifest[serverFnId]
-
-  if (!serverFnInfo) {
-    console.info('serverFnManifest', serverFnManifest)
-    throw new Error('Server function info not found for ' + serverFnId)
-  }
-
-  const fnModule = await serverFnInfo.importer()
-
-  if (!fnModule) {
-    console.info('serverFnInfo', serverFnInfo)
-    throw new Error('Server function module not resolved for ' + serverFnId)
-  }
-
-  const action = fnModule[serverFnInfo.functionName]
-
-  if (!action) {
-    console.info('serverFnInfo', serverFnInfo)
-    console.info('fnModule', fnModule)
-    throw new Error(
-      `Server function module export not resolved for serverFn ID: ${serverFnId}`,
-    )
-  }
-  return action
-}
-
-async function parsePayload(payload: any) {
-  const parsedPayload = startSerializer.parse(payload)
-  await revive(parsedPayload, reviveServerFns)
-  return parsedPayload
-}
-
 export const handleServerAction = async ({ request }: { request: Request }) => {
   const controller = new AbortController()
   const signal = controller.signal
@@ -104,7 +42,6 @@ export const handleServerAction = async ({ request }: { request: Request }) => {
   }
 
   const isCreateServerFn = 'createServerFn' in search
-  const isRaw = 'raw' in search
 
   if (typeof serverFnId !== 'string') {
     throw new Error('Invalid server action param for serverFnId: ' + serverFnId)
@@ -118,14 +55,21 @@ export const handleServerAction = async ({ request }: { request: Request }) => {
     'application/x-www-form-urlencoded',
   ]
 
+  const contentType = request.headers.get('Content-Type')
+  const serovalPlugins = getSerovalPlugins()
+
+  function parsePayload(payload: any) {
+    const parsedPayload = fromJSON(payload, { plugins: serovalPlugins })
+    return parsedPayload
+  }
+
   const response = await (async () => {
     try {
       let result = await (async () => {
         // FormData
         if (
-          request.headers.get('Content-Type') &&
-          formDataContentTypes.some((type) =>
-            request.headers.get('Content-Type')?.includes(type),
+          formDataContentTypes.some(
+            (type) => contentType && contentType.includes(type),
           )
         ) {
           // We don't support GET requests with FormData payloads... that seems impossible
@@ -133,45 +77,59 @@ export const handleServerAction = async ({ request }: { request: Request }) => {
             method.toLowerCase() !== 'get',
             'GET requests with FormData payloads are not supported',
           )
+          const formData = await request.formData()
+          const serializedContext = formData.get(TSS_FORMDATA_CONTEXT)
+          formData.delete(TSS_FORMDATA_CONTEXT)
+
+          const params = {
+            context: {} as any,
+            data: formData,
+          }
+          if (typeof serializedContext === 'string') {
+            try {
+              params.context = parsePayload(JSON.parse(serializedContext))
+            } catch {}
+          }
 
-          return await action(await request.formData(), signal)
+          return await action(params, signal)
         }
 
         // Get requests use the query string
         if (method.toLowerCase() === 'get') {
+          invariant(
+            isCreateServerFn,
+            'expected GET request to originate from createServerFn',
+          )
           // By default the payload is the search params
-          let payload: any = search
-
-          // If this GET request was created by createServerFn,
-          // then the payload will be on the payload param
-          if (isCreateServerFn) {
-            payload = search.payload
-          }
-
+          let payload: any = search.payload
           // If there's a payload, we should try to parse it
-          payload = payload ? await parsePayload(payload) : payload
+          payload = payload ? await parsePayload(JSON.parse(payload)) : payload
 
           // Send it through!
           return await action(payload, signal)
         }
 
-        // This must be a POST request, likely JSON???
-        const jsonPayloadAsString = await request.text()
+        if (method.toLowerCase() !== 'post') {
+          throw new Error('expected POST method')
+        }
+
+        if (!contentType || !contentType.includes('application/json')) {
+          throw new Error('expected application/json content type')
+        }
 
-        // We should probably try to deserialize the payload
-        // as JSON, but we'll just pass it through for now.
-        const payload = await parsePayload(jsonPayloadAsString)
+        const jsonPayload = await request.json()
 
         // If this POST request was created by createServerFn,
-        // it's payload will be the only argument
+        // its payload will be the only argument
         if (isCreateServerFn) {
+          const payload = await parsePayload(jsonPayload)
           return await action(payload, signal)
         }
 
         // Otherwise, we'll spread the payload. Need to
         // support `use server` functions that take multiple
         // arguments.
-        return await action(...(payload as any), signal)
+        return await action(...jsonPayload)
       })()
 
       // Any time we get a Response back, we should just
@@ -192,18 +150,6 @@ export const handleServerAction = async ({ request }: { request: Request }) => {
         }
       }
 
-      // if (!search.createServerFn) {
-      //   result = result.result
-      // }
-
-      // else if (
-      //   isPlainObject(result) &&
-      //   'result' in result &&
-      //   result.result instanceof Response
-      // ) {
-      //   return result.result
-      // }
-
       // TODO: RSCs Where are we getting this package?
       // if (isValidElement(result)) {
       //   const { renderToPipeableStream } = await import(
@@ -228,16 +174,86 @@ export const handleServerAction = async ({ request }: { request: Request }) => {
       }
 
       const response = getResponse()
-      return new Response(
-        result !== undefined ? startSerializer.stringify(result) : undefined,
-        {
+      let nonStreamingBody: any = undefined
+
+      if (result !== undefined) {
+        // first run without the stream in case `result` does not need streaming
+        let done = false as boolean
+        const callbacks: {
+          onParse: (value: any) => void
+          onDone: () => void
+          onError: (error: any) => void
+        } = {
+          onParse: (value) => {
+            nonStreamingBody = value
+          },
+          onDone: () => {
+            done = true
+          },
+          onError: (error) => {
+            throw error
+          },
+        }
+        toCrossJSONStream(result, {
+          refs: new Map(),
+          plugins: serovalPlugins,
+          onParse(value) {
+            callbacks.onParse(value)
+          },
+          onDone() {
+            callbacks.onDone()
+          },
+          onError: (error) => {
+            callbacks.onError(error)
+          },
+        })
+        if (done) {
+          return new Response(
+            nonStreamingBody ? JSON.stringify(nonStreamingBody) : undefined,
+            {
+              status: response?.status,
+              statusText: response?.statusText,
+              headers: {
+                'Content-Type': 'application/json',
+                [X_TSS_SERIALIZED]: 'true',
+              },
+            },
+          )
+        }
+
+        // not done yet, we need to stream
+        const stream = new ReadableStream({
+          start(controller) {
+            callbacks.onParse = (value) =>
+              controller.enqueue(JSON.stringify(value) + '\n')
+            callbacks.onDone = () => {
+              try {
+                controller.close()
+              } catch (error) {
+                controller.error(error)
+              }
+            }
+            callbacks.onError = (error) => controller.error(error)
+            // stream the initial body
+            if (nonStreamingBody !== undefined) {
+              callbacks.onParse(nonStreamingBody)
+            }
+          },
+        })
+        return new Response(stream, {
           status: response?.status,
           statusText: response?.statusText,
           headers: {
-            'Content-Type': 'application/json',
+            'Content-Type': 'application/x-ndjson',
+            [X_TSS_SERIALIZED]: 'true',
           },
-        },
-      )
+        })
+      }
+
+      return new Response(undefined, {
+        status: response?.status,
+        statusText: response?.statusText,
+      })
     } catch (error: any) {
       if (error instanceof Response) {
         return error
@@ -265,10 +281,21 @@ export const handleServerAction = async ({ request }: { request: Request }) => {
       console.error(error)
       console.info()
 
-      return new Response(startSerializer.stringify(error), {
-        status: 500,
+      const serializedError = JSON.stringify(
+        await Promise.resolve(
+          toCrossJSONAsync(error, {
+            refs: new Map(),
+            plugins: serovalPlugins,
+          }),
+        ),
+      )
+      const response = getResponse()
+      return new Response(serializedError, {
+        status: response?.status ?? 500,
+        statusText: response?.statusText,
         headers: {
           'Content-Type': 'application/json',
+          [X_TSS_SERIALIZED]: 'true',
         },
       })
     }
@@ -276,10 +303,6 @@ export const handleServerAction = async ({ request }: { request: Request }) => {
 
   request.signal.removeEventListener('abort', abort)
 
-  if (isRaw) {
-    return response
-  }
-
   return response
 }