4 ms·
> That doesn't work for the model defined in this post. Because now each post is a request to the server instead of one single request that returns a rendered l
by SebastianKra 1y ago
> That doesn't work for the model defined in this post. Because now each post is a request to the server instead of one single request that returns a rendered list of posts.
Thats where you’re wrong. The JSX snippet that I posted above gets turned into:
{
type: "src/ClientHoverCard.js#ClientHoverCard",
props: {
preview: // this is already rendered on the server
children: // this is already rendered on the server
}
}
If you wanted to fade the entire post when pressing the delete button without contexts, you’d create a client component like this:
"use client"
function DeletablePost({ children }: { children: ReactNode }) {
const [isDeleted, setDeleted] = useState(false)
return <div style={{ opacity: isDeleted ? 0.5 : 1 }}>
{children}
<DeleteButton onChange={setDeleted} />
</div>
}
And pass it a server component like this:
<DeletablePost>
<ServerPost />
</DeletablePoast>