From e45ac5552c13fc50832624b7deb0c6f631d461bf Mon Sep 17 00:00:00 2001
From: Ricky <rickhanlonii@fb.com>
Date: Thu, 25 Apr 2024 22:01:32 -0400
Subject: [PATCH] Better use(Promise) example in 19 blog (#6790)

* Better use(Promise) example in 19 blog

* Better use(Promise) example in 19 blog
---
 src/content/blog/2024/04/25/react-19.md | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/content/blog/2024/04/25/react-19.md b/src/content/blog/2024/04/25/react-19.md
index 52a8e1ec3..21784ca21 100644
--- a/src/content/blog/2024/04/25/react-19.md
+++ b/src/content/blog/2024/04/25/react-19.md
@@ -243,14 +243,23 @@ In React 19 we're introducing a new API to read resources in render: `use`.
 
 For example, you can read a promise with `use`, and React will Suspend until the promise resolves:
 
-```js {1,6}
+```js {1,5}
 import {use} from 'react';
 
 function Comments({commentsPromise}) {
-  // NOTE: this will resume the promise from the server.
-  // It will suspend until the data is available.
+  // `use` will suspend until the promise resolves.
   const comments = use(commentsPromise);
-  return comments.map(comment => <p>{comment}</p>);
+  return comments.map(comment => <p key={comment.id}>{comment}</p>);
+}
+
+function Page({commentsPromise}) {
+  // When `use` suspends in Comments,
+  // this Suspense boundary will be shown.
+  return (
+    <Suspense fallback={<div>Loading...</div>}>
+      <Comments commentsPromise={commentsPromise} />
+    </Suspense>
+  )
 }
 ```