Skip to content

Commit ac1d2b2

Browse files
ci: apply automated fixes
1 parent 1984a5e commit ac1d2b2

File tree

1 file changed

+16
-11
lines changed

1 file changed

+16
-11
lines changed

src/blog/react-server-components.md

Lines changed: 16 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -59,9 +59,11 @@ TanStack Start gives you two RSC helpers, and you can use either, both, or neith
5959
import { createServerFn } from '@tanstack/react-start'
6060
import { renderToReadableStream } from '@tanstack/react-start/rsc'
6161

62-
export const getGreeting = createServerFn({ method: 'GET' }).handler(async () => {
63-
return await renderToReadableStream(<h1>Hello from the server</h1>)
64-
})
62+
export const getGreeting = createServerFn({ method: 'GET' }).handler(
63+
async () => {
64+
return await renderToReadableStream(<h1>Hello from the server</h1>)
65+
},
66+
)
6567

6668
// Client
6769
import { createFromReadableStream } from '@tanstack/react-start/rsc'
@@ -71,7 +73,7 @@ function Greeting() {
7173

7274
useEffect(() => {
7375
getGreeting().then((stream) =>
74-
createFromReadableStream(stream).then(setContent)
76+
createFromReadableStream(stream).then(setContent),
7577
)
7678
}, [])
7779

@@ -82,7 +84,10 @@ function Greeting() {
8284
**`createCompositeComponent`** is for when you need slots—places where the client can inject its own components with full interactivity:
8385

8486
```tsx
85-
import { CompositeComponent, createCompositeComponent } from '@tanstack/react-start/rsc'
87+
import {
88+
CompositeComponent,
89+
createCompositeComponent,
90+
} from '@tanstack/react-start/rsc'
8691

8792
const getCard = createServerFn().handler(async () => {
8893
const src = await createCompositeComponent(
@@ -349,11 +354,11 @@ The patterns above cover most use cases. But if you want to serve RSCs from API
349354

350355
### The Primitives
351356

352-
| Function | Where it runs | What it does |
353-
| -------------------------- | ------------- | -------------------------------------------------- |
354-
| `renderToReadableStream` | Server only | Renders React elements to a Flight stream |
355-
| `createFromFetch` | Client | Decodes a Flight stream from a fetch response |
356-
| `createFromReadableStream` | Client/SSR | Decodes a Flight stream from any `ReadableStream` |
357+
| Function | Where it runs | What it does |
358+
| -------------------------- | ------------- | ------------------------------------------------- |
359+
| `renderToReadableStream` | Server only | Renders React elements to a Flight stream |
360+
| `createFromFetch` | Client | Decodes a Flight stream from a fetch response |
361+
| `createFromReadableStream` | Client/SSR | Decodes a Flight stream from any `ReadableStream` |
357362

358363
### Example: RSC via API Route
359364

@@ -370,7 +375,7 @@ const getFlightStream = createServerFn({ method: 'GET' }).handler(async () => {
370375
<div>
371376
<h1>Hello from the server</h1>
372377
<p>This is a Flight stream served via API route.</p>
373-
</div>
378+
</div>,
374379
)
375380
})
376381

0 commit comments

Comments
 (0)