diff --git a/beta/src/components/Layout/HomeContent.js b/beta/src/components/Layout/HomeContent.js
index 4461045ab..3b3496b22 100644
--- a/beta/src/components/Layout/HomeContent.js
+++ b/beta/src/components/Layout/HomeContent.js
@@ -125,8 +125,8 @@ export function HomeContent() {
For frameworks, React is more than a library—React is an
architecture. React provides a single unified programming
- model that spans across the client and the server, and lets
- you use both for what they’re best at.
+ model that spans across the client and the server, letting you
+ use both for what they’re best at.
@@ -549,7 +549,7 @@ function Example2() {
{`import { Stack, Heading } from 'your-design-system';
import { Comment, AddComment } from '.';
-export function CommentList({ comments }) {
+export function CommentList({ comments, children }) {
let headingText = 'Be the first to comment';
if (comments.length > 0) {
headingText = comments.length + ' Comments';
@@ -560,7 +560,7 @@ export function CommentList({ comments }) {
{comments.map(comment =>
)}
-
+ {children}
);
}`}
@@ -618,19 +618,22 @@ import { CommentList, PostCover } from '.';
import { db } from './database.js';
export default async function PostPage({ params }) {
- const post = await db.posts.findOne({ slug: params.slug });
+ const post = await db.findPost({ slug: params.slug });
return (
}>
-
+
);
}
-async function PostComments({ post }) {
- const comments = await db.comments.findAll({ postId: post.id });
- return ;
+async function PostComments({ postId }) {
+ return (
+
+
+
+ );
}`}
@@ -701,10 +704,14 @@ function CommentsSkeleton() {
}
function PostComments({post}) {
- return ;
+ return (
+
+
+
+ );
}
-function CommentList({comments}) {
+function CommentList({comments, children}) {
let headingText = 'Be the first to comment';
if (comments.length > 0) {
headingText = comments.length + ' Comments';
@@ -715,7 +722,7 @@ function CommentList({comments}) {
{comments.map((comment) => (
))}
-
+ {children}
);
}