iBoss/bolt-diy
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix(browser-extensions): don't render directly in body

Browse Source
This commit is contained in:
Sam Denty
2024-10-04 09:31:25 +02:00
committed by Sam Denty
parent f6d79c5610
commit 6a9cb78fd6
5 changed files with 87 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
app/entry.server.tsx
View File

@@ -2,6 +2,9 @@ import type { AppLoadContext, EntryContext } from '@remix-run/cloudflare';
import { RemixServer } from '@remix-run/react';
import { isbot } from 'isbot';
import { renderToReadableStream } from 'react-dom/server';
import { renderHeadToString } from 'remix-island';
import { Head } from './root';
import { themeStore } from '~/lib/stores/theme';
export default async function handleRequest(
request: Request,
@@ -10,7 +13,7 @@ export default async function handleRequest(
remixContext: EntryContext,
_loadContext: AppLoadContext,
) {
const body = await renderToReadableStream(<RemixServer context={remixContext} url={request.url} />, {
const readable = await renderToReadableStream(<RemixServer context={remixContext} url={request.url} />, {
signal: request.signal,
onError(error: unknown) {
console.error(error);
@@ -18,8 +21,49 @@ export default async function handleRequest(
},
});
const body = new ReadableStream({
start(controller) {
const head = renderHeadToString({ request, remixContext, Head });
controller.enqueue(
new Uint8Array(
new TextEncoder().encode(
`<!DOCTYPE html><html lang="en" data-theme="${themeStore.value}"><head>${head}</head><body><div id="root" class="w-full h-full">`,
),
),
);
const reader = readable.getReader();
function read() {
reader
.read()
.then(({ done, value }) => {
if (done) {
controller.enqueue(new Uint8Array(new TextEncoder().encode(`</div></body></html>`)));
controller.close();
return;
}
controller.enqueue(value);
read();
})
.catch((error) => {
controller.error(error);
readable.cancel();
});
}
read();
},
cancel() {
readable.cancel();
},
});
if (isbot(request.headers.get('user-agent') || '')) {
await body.allReady;
await readable.allReady;
}
responseHeaders.set('Content-Type', 'text/html');