update entry.server.tsx based on new remix template

Shopify · Mar 2, 2023 · 7ef939e · 7ef939e
1 parent 03dcc0b
commit 7ef939e
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 12 deletions.
diff --git a/templates/demo-store/app/entry.server.tsx b/templates/demo-store/app/entry.server.tsx
@@ -1,7 +1,7 @@
 import type {EntryContext} from '@shopify/remix-oxygen';
 import {RemixServer} from '@remix-run/react';
-import {renderToReadableStream} from 'react-dom/server';
 import isbot from 'isbot';
+import {renderToReadableStream} from 'react-dom/server';
 
 export default async function handleRequest(
   request: Request,
@@ -11,16 +11,23 @@ export default async function handleRequest(
 ) {
   const body = await renderToReadableStream(
     <RemixServer context={remixContext} url={request.url} />,
+    {
+      signal: request.signal,
+      onError(error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        responseStatusCode = 500;
+      },
+    },
   );
 
-  if (isbot(request.headers.get('User-Agent'))) {
+  if (isbot(request.headers.get('user-agent'))) {
     await body.allReady;
   }
 
   responseHeaders.set('Content-Type', 'text/html');
-
   return new Response(body, {
-    status: responseStatusCode,
     headers: responseHeaders,
+    status: responseStatusCode,
   });
 }
diff --git a/templates/hello-world/app/entry.server.tsx b/templates/hello-world/app/entry.server.tsx
@@ -1,5 +1,6 @@
 import type {EntryContext} from '@shopify/remix-oxygen';
 import {RemixServer} from '@remix-run/react';
+import isbot from 'isbot';
 import {renderToReadableStream} from 'react-dom/server';
 
 export default async function handleRequest(
@@ -10,12 +11,23 @@ export default async function handleRequest(
 ) {
   const body = await renderToReadableStream(
     <RemixServer context={remixContext} url={request.url} />,
+    {
+      signal: request.signal,
+      onError(error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        responseStatusCode = 500;
+      },
+    },
   );
 
-  responseHeaders.set('Content-Type', 'text/html');
+  if (isbot(request.headers.get('user-agent'))) {
+    await body.allReady;
+  }
 
+  responseHeaders.set('Content-Type', 'text/html');
   return new Response(body, {
-    status: responseStatusCode,
     headers: responseHeaders,
+    status: responseStatusCode,
   });
 }
diff --git a/templates/skeleton/app/entry.server.tsx b/templates/skeleton/app/entry.server.tsx
@@ -1,21 +1,33 @@
 import type {EntryContext} from '@shopify/remix-oxygen';
 import {RemixServer} from '@remix-run/react';
-import {renderToString} from 'react-dom/server';
+import isbot from 'isbot';
+import {renderToReadableStream} from 'react-dom/server';
 
-export default function handleRequest(
+export default async function handleRequest(
   request: Request,
   responseStatusCode: number,
   responseHeaders: Headers,
   remixContext: EntryContext,
 ) {
-  const markup = renderToString(
+  const body = await renderToReadableStream(
     <RemixServer context={remixContext} url={request.url} />,
+    {
+      signal: request.signal,
+      onError(error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        responseStatusCode = 500;
+      },
+    },
   );
 
-  responseHeaders.set('Content-Type', 'text/html');
+  if (isbot(request.headers.get('user-agent'))) {
+    await body.allReady;
+  }
 
-  return new Response('<!DOCTYPE html>' + markup, {
-    status: responseStatusCode,
+  responseHeaders.set('Content-Type', 'text/html');
+  return new Response(body, {
     headers: responseHeaders,
+    status: responseStatusCode,
   });
 }