diff --git a/packages/router/src/rsc/RscRoutes.tsx b/packages/router/src/rsc/RscRoutes.tsx index bbcd5c882d6f..bb7e3906ba96 100644 --- a/packages/router/src/rsc/RscRoutes.tsx +++ b/packages/router/src/rsc/RscRoutes.tsx @@ -29,6 +29,41 @@ function onStreamFinished( ) } +async function rsaFetch( + serializedLocation: string, + rsaId: string, + rsaArgs: unknown[], +) { + const rscId = '_' + + const url = + BASE_PATH + rscId + '?action_id=' + rsaId + '&' + serializedLocation + + console.log('rsaFetch url', url) + + let body: Awaited> = '' + + try { + body = await encodeReply(rsaArgs) + } catch (e) { + console.error('Error encoding Server Action arguments', e) + } + + return fetch(url, { + method: 'POST', + body, + headers: { 'rw-rsc': '1' }, + }) +} + +function rscFetch(serializedLocation: string) { + const rscId = '__rwjs__Routes' + + return fetch(BASE_PATH + rscId + '?' + serializedLocation, { + headers: { 'rw-rsc': '1' }, + }) +} + type SerializedLocation = | `__rwjs__pathname=${string}&__rwjs__search=${string}` | `__rwjs__pathname=${string}&__rwjs__search=${string}::${string}` @@ -47,22 +82,11 @@ function rscFetchRoutes(serializedLocation: SerializedLocation) { console.log('rscFetchRoutes :: cache miss for', rscCacheKey) } - const rscId = '__rwjs__Routes' - - // TODO (RSC): During SSR we should not fetch (Is this function really - // called during SSR?) - const responsePromise = fetch(BASE_PATH + rscId + '?' + serializedLocation, { - headers: { - 'rw-rsc': '1', - }, - }) - const options: Options = { - // React will hold on to `callServer` and use that when it detects a - // server action is invoked (like `action={onSubmit}` in a
- // element). So for now at least we need to send it with every RSC - // request, so React knows what `callServer` method to use for server - // actions inside the RSC. + // React will hold on to `callServer` and use that when it detects a server + // action is invoked (like `action={onSubmit}` in a element). So for + // now at least we need to send it with every RSC request, so React knows + // what `callServer` method to use for server actions inside the RSC. // TODO (RSC): Need to figure out the types for callServer // @ts-expect-error types callServer: async function (rsaId: string, args: unknown[]) { @@ -76,28 +100,7 @@ function rscFetchRoutes(serializedLocation: SerializedLocation) { // same arguments const rscCacheKey: SerializedLocation = `${serializedLocation}::${rsaId}::${new Date()}` - const searchParams = new URLSearchParams() - searchParams.set('action_id', rsaId) - const rscId = '_' - - let body: Awaited> = '' - - try { - body = await encodeReply(args) - } catch (e) { - console.error('Error encoding Server Action arguments', e) - } - - const responsePromise = fetch( - BASE_PATH + rscId + '?' + searchParams + '&' + serializedLocation, - { - method: 'POST', - body, - headers: { - 'rw-rsc': '1', - }, - }, - ) + const responsePromise = rsaFetch(serializedLocation, rsaId, args) onStreamFinished(responsePromise, () => { updateCurrentRscCacheKey(rscCacheKey) @@ -116,10 +119,7 @@ function rscFetchRoutes(serializedLocation: SerializedLocation) { }, } - const modelPromise = createFromFetch( - responsePromise, - options, - ) + const modelPromise = createFromFetch(rscFetch(serializedLocation), options) rscCache.set(rscCacheKey, modelPromise)