refactor: unify stream types by introducing PipeableOrReadableStream

Author: AbanoubGhadban

node_package/src/injectRSCPayload.ts

@@ -1,7 +1,6 @@
-import { PipeableStream } from 'react-dom/server';
 import { PassThrough, Transform } from 'stream';
 import { finished } from 'stream/promises';
-import { RailsContextWithServerComponentCapabilities } from './types/index.ts';
+import { RailsContextWithServerComponentCapabilities, PipeableOrReadableStream } from './types/index.ts';
 
 // In JavaScript, when an escape sequence with a backslash (\) is followed by a character
 // that isn't a recognized escape character, the backslash is ignored, and the character
@@ -50,7 +49,7 @@ function writeChunk(chunk: string, transform: Transform, cacheKey: string) {
  * @returns A combined stream with embedded RSC payloads
  */
 export default function injectRSCPayload(
-  pipeableHtmlStream: NodeJS.ReadableStream | PipeableStream,
+  pipeableHtmlStream: PipeableOrReadableStream,
   railsContext: RailsContextWithServerComponentCapabilities,
 ) {
   const htmlStream = new PassThrough();

node_package/src/streamServerRenderedReactComponent.ts

@@ -6,13 +6,14 @@ import createReactOutput from './createReactOutput.ts';
 import { isPromise, isServerRenderHash } from './isServerRenderResult.ts';
 import buildConsoleReplay from './buildConsoleReplay.ts';
 import handleError from './handleError.ts';
-import { renderToPipeableStream, PipeableStream } from './ReactDOMServer.cts';
+import { renderToPipeableStream } from './ReactDOMServer.cts';
 import { createResultObject, convertToError, validateComponent } from './serverRenderUtils.ts';
 import {
   assertRailsContextWithServerComponentCapabilities,
   RenderParams,
   StreamRenderState,
   StreamableComponentResult,
+  PipeableOrReadableStream,
 } from './types/index.ts';
 import injectRSCPayload from './injectRSCPayload.ts';
 import { notifySSREnd } from './postSSRHooks.ts';
@@ -112,8 +113,8 @@ export const transformRenderStreamChunksToResultObject = (renderState: StreamRen
     },
   });
 
-  let pipedStream: PipeableStream | NodeJS.ReadableStream | null = null;
-  const pipeToTransform = (pipeableStream: PipeableStream | NodeJS.ReadableStream) => {
+  let pipedStream: PipeableOrReadableStream | null = null;
+  const pipeToTransform = (pipeableStream: PipeableOrReadableStream) => {
     pipeableStream.pipe(transformStream);
     pipedStream = pipeableStream;
   };

node_package/src/types/index.ts

@@ -1,6 +1,7 @@
 /// <reference types="react/experimental" />
 
 import type { ReactElement, ReactNode, Component, ComponentType } from 'react';
+import type { PipeableStream } from 'react-dom/server';
 import type { Readable } from 'stream';
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
@@ -176,6 +177,8 @@ interface RenderFunction {
 
 type ReactComponentOrRenderFunction = ReactComponent | RenderFunction;
 
+type PipeableOrReadableStream = PipeableStream | NodeJS.ReadableStream;
+
 export type {
   ReactComponentOrRenderFunction,
   ReactComponent,
@@ -192,6 +195,7 @@ export type {
   RenderFunctionSyncResult,
   RenderFunctionAsyncResult,
   StreamableComponentResult,
+  PipeableOrReadableStream,
 };
 
 export interface RegisteredComponent {