Convert loadReactClientManifest to async and update RSC rendering

Author: AbanoubGhadban

node_package/src/ReactOnRailsRSC.ts

@@ -33,10 +33,10 @@ const streamRenderRSCComponent = (reactElement: ReactElement, options: RSCRender
   };
 
   const { pipeToTransform, readableStream, emitError } = transformRenderStreamChunksToResultObject(renderState);
-  try {
+  loadReactClientManifest(reactClientManifestFileName).then((reactClientManifest) => {
     const rscStream = renderToPipeableStream(
       reactElement,
-      loadReactClientManifest(reactClientManifestFileName),
+      reactClientManifest,
       {
         onError: (err) => {
           const error = convertToError(err);
@@ -50,15 +50,15 @@ const streamRenderRSCComponent = (reactElement: ReactElement, options: RSCRender
       }
     );
     pipeToTransform(rscStream);
-    return readableStream;
-  } catch (e) {
+  }).catch((e) => {
     const error = convertToError(e);
     renderState.hasErrors = true;
     renderState.error = error;
     const htmlResult = handleError({ e: error, name: options.name, serverSide: true });
     const jsonResult = JSON.stringify(createResultObject(htmlResult, buildConsoleReplay(), renderState));
     return stringToStream(jsonResult);
-  }
+  });
+  return readableStream;
 };
 
 ReactOnRails.serverRenderRSCReactComponent = (options: RSCRenderParams) => {

node_package/src/loadReactClientManifest.ts

@@ -1,17 +1,17 @@
 import path from 'path';
-import fs from 'fs';
+import fs from 'fs/promises';
 
 const loadedReactClientManifests = new Map<string, Record<string, unknown>>();
 
-export default function loadReactClientManifest(reactClientManifestFileName: string) {
+export default async function loadReactClientManifest(reactClientManifestFileName: string) {
   // React client manifest is uploaded to node renderer as an asset.
   // Renderer copies assets to the same place as the server-bundle.js and rsc-bundle.js.
   // Thus, the __dirname of this code is where we can find the manifest file.
   const manifestPath = path.resolve(__dirname, reactClientManifestFileName);
   if (!loadedReactClientManifests.has(manifestPath)) {
     // TODO: convert to async
     try {
-      const manifest = JSON.parse(fs.readFileSync(manifestPath, 'utf8'));
+      const manifest = JSON.parse(await fs.readFile(manifestPath, 'utf8'));
       loadedReactClientManifests.set(manifestPath, manifest);
     } catch (error) {
       throw new Error(`Failed to load React client manifest from ${manifestPath}: ${error}`);