[Docs Site] Add React to Container API (#20918)

* [Docs Site] Add React to Container API

* fix componentToString

* fix import

Author: KianNH

src/util/container.ts

@@ -1,6 +1,6 @@
 import { experimental_AstroContainer } from "astro/container";
-import { getContainerRenderer } from "@astrojs/mdx";
-import { loadRenderers } from "astro:container";
+import reactRenderer from "@astrojs/react/server.js";
+import mdxRenderer from "@astrojs/mdx/server.js";
 import { render, type CollectionEntry } from "astro:content";
 import type { AstroComponentFactory } from "astro/runtime/server/index.js";
 
@@ -12,9 +12,14 @@ export async function entryToString(
 		return entry.rendered.html;
 	}
 
-	const renderers = await loadRenderers([getContainerRenderer()]);
-	const container = await experimental_AstroContainer.create({
-		renderers,
+	const container = await experimental_AstroContainer.create({});
+	container.addServerRenderer({
+		name: "astro:jsx",
+		renderer: mdxRenderer,
+	});
+	container.addServerRenderer({
+		name: "@astrojs/react",
+		renderer: reactRenderer,
 	});
 
 	const { Content } = await render(entry);
@@ -31,9 +36,14 @@ export async function componentToString(
 	component: AstroComponentFactory,
 	props: any,
 ) {
-	const renderers = await loadRenderers([getContainerRenderer()]);
-	const container = await experimental_AstroContainer.create({
-		renderers,
+	const container = await experimental_AstroContainer.create({});
+	container.addServerRenderer({
+		name: "astro:jsx",
+		renderer: mdxRenderer,
+	});
+	container.addServerRenderer({
+		name: "@astrojs/react",
+		renderer: reactRenderer,
 	});
 
 	const html = await container.renderToString(component, {