linting

Author: AbanoubGhadban

node_package/src/RSCClientRoot.ts

@@ -62,7 +62,7 @@ const createRSCStreamFromPage = () => {
         return chunks.length;
       };
       streamController = controller;
-    }
+    },
   });
 
   if (typeof document !== 'undefined' && document.readyState === 'loading') {
@@ -74,13 +74,13 @@ const createRSCStreamFromPage = () => {
   }
 
   return stream;
-}
+};
 
 const createFromRSCStream = () => {
   const stream = createRSCStreamFromPage();
   const transformedStream = transformRSCStreamAndReplayConsoleLogs(stream);
   return createFromReadableStream<React.ReactNode>(transformedStream);
-}
+};
 
 /**
  * RSCClientRoot is a React component that handles client-side rendering of React Server Components (RSC).
@@ -111,7 +111,7 @@ const RSCClientRoot: RenderFunction = async (
     const root = await createFromRSCStream();
     ReactDOMClient.hydrateRoot(domNode, root);
   } else {
-    const root = await fetchRSC({ componentName, rscPayloadGenerationUrlPath, componentProps })
+    const root = await fetchRSC({ componentName, rscPayloadGenerationUrlPath, componentProps });
     ReactDOMClient.createRoot(domNode).render(root);
   }
   // Added only to satisfy the return type of RenderFunction

node_package/src/RSCPayloadContainer.ts

@@ -3,26 +3,25 @@ import * as React from 'react';
 type StreamChunk = {
   chunk: string;
   isLastChunk: boolean;
-}
+};
 
 type RSCPayloadContainerProps = {
   RSCPayloadStream: NodeJS.ReadableStream;
-}
+};
 
 type RSCPayloadContainerInnerProps = {
   chunkIndex: number;
   getChunkPromise: (chunkIndex: number) => Promise<StreamChunk>;
-}
+};
 
 function escapeScript(script: string) {
-  return script
-    .replace(/<!--/g, '<\\!--')
-    .replace(/<\/(script)/gi, '</\\$1');
+  return script.replace(/<!--/g, '<\\!--').replace(/<\/(script)/gi, '</\\$1');
 }
 
-const RSCPayloadContainer = (
-  { chunkIndex, getChunkPromise }: RSCPayloadContainerInnerProps,
-): React.ReactNode => {
+const RSCPayloadContainer = ({
+  chunkIndex,
+  getChunkPromise,
+}: RSCPayloadContainerInnerProps): React.ReactNode => {
   const chunkPromise = getChunkPromise(chunkIndex);
   const chunk = React.use(chunkPromise);
 
@@ -42,13 +41,10 @@ const RSCPayloadContainer = (
     React.createElement(
       React.Suspense,
       { fallback: null, key: `suspense-${chunkIndex}` },
-      React.createElement(
-        RSCPayloadContainer,
-        { chunkIndex: chunkIndex + 1, getChunkPromise },
-      ),
+      React.createElement(RSCPayloadContainer, { chunkIndex: chunkIndex + 1, getChunkPromise }),
     ),
   ]);
-}
+};
 
 export default function RSCPayloadContainerWrapper({ RSCPayloadStream }: RSCPayloadContainerProps) {
   const [chunkPromises] = React.useState<Promise<StreamChunk>[]>(() => {
@@ -84,13 +80,16 @@ export default function RSCPayloadContainerWrapper({ RSCPayloadStream }: RSCPayl
     return promises;
   });
 
-  const getChunkPromise = React.useCallback((chunkIndex: number) => {
-    if (chunkIndex > chunkPromises.length) {
-      throw new Error('React on Rails Error: RSC Chunk index out of bounds');
-    }
+  const getChunkPromise = React.useCallback(
+    (chunkIndex: number) => {
+      if (chunkIndex > chunkPromises.length) {
+        throw new Error('React on Rails Error: RSC Chunk index out of bounds');
+      }
 
-    return chunkPromises[chunkIndex];
-  }, [chunkPromises]);
+      return chunkPromises[chunkIndex];
+    },
+    [chunkPromises],
+  );
 
   return React.createElement(
     React.Suspense,

node_package/src/RSCServerRoot.ts

@@ -17,28 +17,36 @@ declare global {
 type RSCServerRootProps = {
   componentName: string;
   componentProps: Record<string, unknown>;
-}
+};
 
 if (!('use' in React && typeof React.use === 'function')) {
-  throw new Error('React.use is not defined. Please ensure you are using React 18 with experimental features enabled or React 19+ to use server components.');
+  throw new Error(
+    'React.use is not defined. Please ensure you are using React 18 with experimental features enabled or React 19+ to use server components.',
+  );
 }
 
 const { use } = React;
 
-const createFromReactOnRailsNodeStream = (stream: NodeJS.ReadableStream, ssrManifest: Record<string, unknown>) => {
+const createFromReactOnRailsNodeStream = (
+  stream: NodeJS.ReadableStream,
+  ssrManifest: Record<string, unknown>,
+) => {
   const transformedStream = transformRSCStream(stream);
   return createFromNodeStream(transformedStream, ssrManifest);
-}
+};
 
-const createSSRManifest = async (reactServerManifestFileName: string, reactClientManifestFileName: string) => {
+const createSSRManifest = async (
+  reactServerManifestFileName: string,
+  reactClientManifestFileName: string,
+) => {
   const [reactServerManifest, reactClientManifest] = await Promise.all([
     loadJsonFile(reactServerManifestFileName),
     loadJsonFile(reactClientManifestFileName),
   ]);
 
   const ssrManifest = {
     moduleLoading: {
-      prefix: "/webpack/development/",
+      prefix: '/webpack/development/',
       crossOrigin: null,
     },
     moduleMap: {} as Record<string, unknown>,
@@ -51,38 +59,47 @@ const createSSRManifest = async (reactServerManifestFileName: string, reactClien
         id: (serverFileBundlingInfo as { id: string }).id,
         chunks: (serverFileBundlingInfo as { chunks: string[] }).chunks,
         name: '*',
-      }
+      },
     };
   });
 
   return ssrManifest;
-}
+};
 
-const RSCServerRoot: RenderFunction = async ({ componentName, componentProps }: RSCServerRootProps, railsContext?: RailsContext) => {
-  if (!railsContext?.serverSide || !railsContext?.reactClientManifestFileName || !railsContext?.reactServerClientManifestFileName) {
+const RSCServerRoot: RenderFunction = async (
+  { componentName, componentProps }: RSCServerRootProps,
+  railsContext?: RailsContext,
+) => {
+  if (
+    !railsContext?.serverSide ||
+    !railsContext?.reactClientManifestFileName ||
+    !railsContext?.reactServerClientManifestFileName
+  ) {
     throw new Error(
-      `${'serverClientManifestFileName and reactServerClientManifestFileName are required. ' +
-      'Please ensure that React Server Component webpack configurations are properly set ' +
-      'as stated in the React Server Component tutorial. The received rails context is: '}${  JSON.stringify(railsContext)}`
+      `${
+        'serverClientManifestFileName and reactServerClientManifestFileName are required. ' +
+        'Please ensure that React Server Component webpack configurations are properly set ' +
+        'as stated in the React Server Component tutorial. The received rails context is: '
+      }${JSON.stringify(railsContext)}`,
     );
   }
 
   if (typeof generateRSCPayload !== 'function') {
     throw new Error(
       'generateRSCPayload is not defined. Please ensure that you are using at least version 4.0.0 of ' +
-      'React on Rails Pro and the node renderer, and that ReactOnRailsPro.configuration.enable_rsc_support ' +
-      'is set to true.'
+        'React on Rails Pro and the node renderer, and that ReactOnRailsPro.configuration.enable_rsc_support ' +
+        'is set to true.',
     );
   }
 
   const ssrManifest = await createSSRManifest(
     railsContext.reactServerClientManifestFileName,
-    railsContext.reactClientManifestFileName
+    railsContext.reactClientManifestFileName,
   );
   const rscPayloadStream = await generateRSCPayload(
     componentName,
     componentProps,
-    railsContext.serverSideRSCPayloadParameters
+    railsContext.serverSideRSCPayloadParameters,
   );
 
   // Tee the stream to pass it to the server component and the payload container
@@ -92,20 +109,14 @@ const RSCServerRoot: RenderFunction = async ({ componentName, componentProps }:
   rscPayloadStream.pipe(rscPayloadStream2);
   const serverComponentElement = createFromReactOnRailsNodeStream(rscPayloadStream1, ssrManifest);
 
-  return () => React.createElement(
-    React.Fragment,
-    null, [
-      React.createElement(
-        React.Fragment,
-        { key: 'serverComponentElement' },
-        use(serverComponentElement)
-      ),
-      React.createElement(
-        RSCPayloadContainer,
-        { RSCPayloadStream: rscPayloadStream2, key: 'rscPayloadContainer' },
-      ),
-    ]
-  );
+  return () =>
+    React.createElement(React.Fragment, null, [
+      React.createElement(React.Fragment, { key: 'serverComponentElement' }, use(serverComponentElement)),
+      React.createElement(RSCPayloadContainer, {
+        RSCPayloadStream: rscPayloadStream2,
+        key: 'rscPayloadContainer',
+      }),
+    ]);
 };
 
 export default RSCServerRoot;

node_package/src/ReactOnRails.client.ts

@@ -93,9 +93,7 @@ ctx.ReactOnRails = {
     }
 
     if (Object.keys(newOptions).length > 0) {
-      throw new Error(
-        `Invalid options passed to ReactOnRails.options: ${JSON.stringify(newOptions)}`,
-      );
+      throw new Error(`Invalid options passed to ReactOnRails.options: ${JSON.stringify(newOptions)}`);
     }
   },
 

node_package/src/buildConsoleReplay.ts

@@ -51,7 +51,7 @@ export function consoleReplay(
 }
 
 export default function buildConsoleReplay(
-  customConsoleHistory: typeof console['history'] | undefined = undefined,
+  customConsoleHistory: (typeof console)['history'] | undefined = undefined,
   numberOfMessagesToSkip: number = 0,
 ): string {
   const consoleReplayJS = consoleReplay(customConsoleHistory, numberOfMessagesToSkip);

node_package/src/registerServerComponent/server.rsc.ts

@@ -3,12 +3,12 @@ import { ReactComponent, RenderFunction } from '../types';
 
 /**
  * Registers React Server Components (RSC) with React on Rails for the RSC bundle.
- * 
+ *
  * This function handles the registration of components in the RSC bundle context,
  * where components are registered directly into the ComponentRegistry without any
  * additional wrapping. This is different from the server bundle registration,
  * which wraps components with RSCServerRoot.
- * 
+ *
  * @param components - Object mapping component names to their implementations
  *
  * @example
@@ -19,8 +19,7 @@ import { ReactComponent, RenderFunction } from '../types';
  * });
  * ```
  */
-const registerServerComponent = (
-  components: { [id: string]: ReactComponent | RenderFunction },
-) => ReactOnRails.register(components);
+const registerServerComponent = (components: { [id: string]: ReactComponent | RenderFunction }) =>
+  ReactOnRails.register(components);
 
 export default registerServerComponent;

node_package/src/registerServerComponent/server.ts

@@ -4,10 +4,10 @@ import { ReactComponent, RenderFunction, RailsContext } from '../types';
 
 /**
  * Registers React Server Components (RSC) with React on Rails for the server bundle.
- * 
+ *
  * This function wraps each component with RSCServerRoot, which handles the server-side
  * rendering of React Server Components using pre-generated RSC payloads.
- * 
+ *
  * The RSCServerRoot component:
  * - Uses pre-generated RSC payloads from the RSC bundle
  * - Builds the rendering tree of the server component

node_package/src/streamServerRenderedReactComponent.ts

@@ -96,7 +96,7 @@ export const transformRenderStreamChunksToResultObject = (renderState: StreamRen
     }
     const consoleReplayJsonChunk = JSON.stringify(createResultObject('', consoleReplayScript, renderState));
     return consoleReplayJsonChunk;
-  }
+  };
 
   const transformStream = new PassThrough({
     transform(chunk, _, callback) {

node_package/src/transformRSCNodeStreamAndReplayConsoleLogs.ts

@@ -30,6 +30,8 @@ export default function transformRSCStream(stream: NodeJS.ReadableStream): NodeJ
   try {
     return stream.pipe(htmlExtractor);
   } catch (error) {
-    throw new Error(`Error transforming RSC stream (${stream.constructor.name}), (stream: ${stream}), stringified stream: ${JSON.stringify(stream)}, error: ${error}`);
+    throw new Error(
+      `Error transforming RSC stream (${stream.constructor.name}), (stream: ${stream}), stringified stream: ${JSON.stringify(stream)}, error: ${error}`,
+    );
   }
 }

node_package/src/transformRSCStreamAndReplayConsoleLogs.ts

@@ -1,6 +1,8 @@
 import { RSCPayloadChunk } from './types';
 
-export default function transformRSCStreamAndReplayConsoleLogs(stream: ReadableStream<Uint8Array | RenderResult>) {
+export default function transformRSCStreamAndReplayConsoleLogs(
+  stream: ReadableStream<Uint8Array | RenderResult>,
+) {
   return new ReadableStream({
     async start(controller) {
       const reader = stream.getReader();
@@ -9,12 +11,15 @@ export default function transformRSCStreamAndReplayConsoleLogs(stream: ReadableS
 
       let lastIncompleteChunk = '';
       let { value, done } = await reader.read();
-      
+
       const handleJsonChunk = (chunk: RenderResult) => {
         const { html, consoleReplayScript = '' } = chunk;
         controller.enqueue(encoder.encode(html ?? ''));
 
-        const replayConsoleCode = consoleReplayScript.trim().replace(/^<script.*>/, '').replace(/<\/script>$/, '');
+        const replayConsoleCode = consoleReplayScript
+          .trim()
+          .replace(/^<script.*>/, '')
+          .replace(/<\/script>$/, '');
         if (replayConsoleCode?.trim() !== '') {
           const scriptElement = document.createElement('script');
           scriptElement.textContent = replayConsoleCode;

node_package/src/types/index.ts

@@ -35,20 +35,23 @@ export type RailsContext = {
   search: string | null;
   httpAcceptLanguage: string;
   rscPayloadGenerationUrl: string;
-} & ({
-  serverSide: false;
-} | {
-  serverSide: true;
-  // These parameters are passed from React on Rails Pro to the node renderer.
-  // They contain the necessary information to generate the RSC (React Server Components) payload.
-  // Typically, this includes the bundle hash of the RSC bundle.
-  // The react-on-rails package uses 'unknown' for these parameters to avoid direct dependency.
-  // This ensures that if the communication protocol between the node renderer and the Rails server changes,
-  // we don't need to update this type or introduce a breaking change.
-  serverSideRSCPayloadParameters: unknown;
-  reactClientManifestFileName?: string;
-  reactServerClientManifestFileName?: string;
-});
+} & (
+  | {
+      serverSide: false;
+    }
+  | {
+      serverSide: true;
+      // These parameters are passed from React on Rails Pro to the node renderer.
+      // They contain the necessary information to generate the RSC (React Server Components) payload.
+      // Typically, this includes the bundle hash of the RSC bundle.
+      // The react-on-rails package uses 'unknown' for these parameters to avoid direct dependency.
+      // This ensures that if the communication protocol between the node renderer and the Rails server changes,
+      // we don't need to update this type or introduce a breaking change.
+      serverSideRSCPayloadParameters: unknown;
+      reactClientManifestFileName?: string;
+      reactServerClientManifestFileName?: string;
+    }
+);
 
 // not strictly what we want, see https://github.com/microsoft/TypeScript/issues/17867#issuecomment-323164375
 type AuthenticityHeaders = Record<string, string> & {